Does .rotation work with the tabBar widget?

When I use the .rotation command on my tabBar, the command is executed visually although there is a problem capturing the button touch events. When the tabBar is rotated 180 deg the touch events appear to have not updated. The issue is complicated further for 90/45 deg commands. 

 

To provide some context, I plan to update composer scenes using the tabBar. On an orientation change I plan to re-position and rotate the tabBar. I am using build version 2511, code below:

 

– Function to handle button events

local function handleTabBarEvent( event )

    print( event.target._id )  --reference to button’s ‘id’ parameter

end

 

– Configure the tab buttons to appear within the bar

local tabButtons = {

    {

        label = “Tab1”,

        id = “tab1”,

        selected = true,

        onPress = handleTabBarEvent

    },

    {

        label = “Tab2”,

        id = “tab2”,

        onPress = handleTabBarEvent

    },

        {

        label = “Tab3”,

        id = “tab3”,

        onPress = handleTabBarEvent

    },

    {

        label = “Tab4”,

        id = “tab4”,

        onPress = handleTabBarEvent

    }

}

 

– Create the widget

local tabBar = widget.newTabBar

{

    top = display.contentHeight-120,

    width = display.contentWidth,

    buttons = tabButtons

}

 

 tabBar.rotation = 180

Hi @allanlefeuvre,

I’m pretty sure you can’t rotate the tabBar and get the proper touch responses, because the tabBar detects which tab was pressed based on the position/width of the tabs, not on each tab as an “object”. If you want this kind of functionality, you may consider building your own “tab bar” using widget “radio button” switches arranged in a row, and visually customize them so that they look like tabs instead of circular radio buttons. Then, I believe you could rotate the entire display group that contains them, and the touch should be detected in the proper location no matter how the display group is rotated.

Hope this helps,

Brent

Thanks Brent

You could also destroy and recreate the tabBar. It will happen fast enough that it should happen in the same frame update cycle. Rob

Hi Rob, 

I was thinking about the destroy/recreate option although my master plan is to update the tabBar in response to orientation changes. Would this present problems when in landscape Left/Right orientation - 90 deg rotation required? 

Hi @allanlefeuvre,

I’m pretty sure you can’t rotate the tabBar and get the proper touch responses, because the tabBar detects which tab was pressed based on the position/width of the tabs, not on each tab as an “object”. If you want this kind of functionality, you may consider building your own “tab bar” using widget “radio button” switches arranged in a row, and visually customize them so that they look like tabs instead of circular radio buttons. Then, I believe you could rotate the entire display group that contains them, and the touch should be detected in the proper location no matter how the display group is rotated.

Hope this helps,

Brent

Thanks Brent

You could also destroy and recreate the tabBar. It will happen fast enough that it should happen in the same frame update cycle. Rob

Hi Rob, 

I was thinking about the destroy/recreate option although my master plan is to update the tabBar in response to orientation changes. Would this present problems when in landscape Left/Right orientation - 90 deg rotation required?