Can't get the tabBar to work - help!

WarrenW · December 3, 2013, 8:48pm

What am I doing wrong here? I followed the tutorial for using images and no labels. I am getting a Attempt to index a nill value line 82 which is at the bracket right after local tabBar = widget.newTabBar. This is my first time using the tabBar.

Thanks!

Warren

---------------------------------------------------------------------------------- -- -- scenetemplate.lua -- ---------------------------------------------------------------------------------- local storyboard = require( "storyboard" ) local scene = storyboard.newScene() local widget = require( "widget" ) local function onPress( event ) &nbsp;&nbsp; local pressedTab = event.target &nbsp;&nbsp; print( pressedTab.\_id.." pressed!" ) end local tabButtons = { &nbsp;&nbsp; { &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; id = "Tab1", &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; width = 48, &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; height = 48, &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; defaultFile = "images\homered.png", &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; overFile = "images\homered.png", &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; onPress = onPress, &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; selected = true &nbsp;&nbsp; }, &nbsp;&nbsp; { &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; id = "Tab2", &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; width = 48, &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; height = 48, &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; defaultFile = "images\nightlifewhite.png", &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; overFile = "images\nightlifered.png", &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; onPress = onPress, &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; selected = false &nbsp;&nbsp; }, &nbsp;&nbsp; { &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; id = "Tab3", &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; width = 48, &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; height = 48, &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; defaultFile = "images\eventswhite.png", &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; overFile = "images\eventsred.png", &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; onPress = onPress, &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; selected = false &nbsp;&nbsp; }, &nbsp;&nbsp; { &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; id = "Tab4", &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; width = 48, &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; height = 48, &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; defaultFile = "images\culturewhite.png", &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; overFile = "images\culturered.png", &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; onPress = onPress, &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; selected = false &nbsp;&nbsp; }, &nbsp;&nbsp; { &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; id = "Tab5", &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; width = 48, &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; height = 48, &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; defaultFile = "images\searchwhite.png", &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; overFile = "images\searchred.png", &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; onPress = onPress, &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; selected = false &nbsp;&nbsp; }, &nbsp;&nbsp; { &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; id = "Tab6", &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; width = 48, &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; height = 48, &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; defaultFile = "images\contactwhite.png", &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; overFile = "images\contactred.png", &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; onPress = onPress, &nbsp;&nbsp;&nbsp;&nbsp;&nbsp; selected = false &nbsp;&nbsp; } } function scene:createScene( event ) &nbsp;&nbsp; &nbsp;local group = self.view local tabBar = widget.newTabBar&nbsp;&nbsp; &nbsp; { &nbsp;&nbsp; left = 0, &nbsp;&nbsp; top = display.contentHeight - 60, &nbsp;&nbsp; width = 300, &nbsp;&nbsp; height = 48, &nbsp;&nbsp;&nbsp; backgroundFile = "images\tab.png", &nbsp;&nbsp;&nbsp; tabSelectedLeftFile = "images\tab.png", &nbsp;&nbsp;&nbsp; tabSelectedRightFile = "images\tab.png", &nbsp;&nbsp;&nbsp; tabSelectedMiddleFile = "images\tab.png", &nbsp;&nbsp;&nbsp; tabSelectedFrameWidth = 48, &nbsp;&nbsp;&nbsp; tabSelectedFrameHeight = 48, &nbsp;&nbsp; buttons = tabButtons } end -- Called immediately after scene has moved onscreen: function scene:enterScene( event ) &nbsp;&nbsp; &nbsp;local group = self.view &nbsp;&nbsp; &nbsp; &nbsp;&nbsp; &nbsp; end -- Called when scene is about to move offscreen: function scene:exitScene( event ) &nbsp;&nbsp; &nbsp;local group = self.view &nbsp;&nbsp; &nbsp; &nbsp;&nbsp; &nbsp; end -- Called prior to the removal of scene's "view" (display group) function scene:destroyScene( event ) &nbsp;&nbsp; &nbsp;local group = self.view &nbsp;&nbsp; &nbsp; end --------------------------------------------------------------------------------- -- END OF YOUR IMPLEMENTATION --------------------------------------------------------------------------------- -- "createScene" event is dispatched if scene's view does not exist scene:addEventListener( "createScene", scene ) -- "enterScene" event is dispatched whenever scene transition has finished scene:addEventListener( "enterScene", scene ) -- "exitScene" event is dispatched before next scene's transition begins scene:addEventListener( "exitScene", scene ) -- "destroyScene" event is dispatched before view is unloaded, which can be -- automatically unloaded in low memory situations, or explicitly via a call to -- storyboard.purgeScene() or storyboard.removeScene(). scene:addEventListener( "destroyScene", scene ) --------------------------------------------------------------------------------- return scene

ksan · December 3, 2013, 9:02pm

In each your button definition area can you try putting in a label="", and see what happens? So your first button def would look like the following :

local tabButtons = { { id = "Tab1", width = 48, height = 48, label = "", defaultFile = "images\homered.png", overFile = "images\homered.png", onPress = onPress, selected = true },

Please put the label="", in each button and lets see if that solves the problem.

WarrenW · December 3, 2013, 9:05pm

I just tried and same error. I thought of that before but saw it was optional according to the docs. Nut sure what could be nil but its driving me crazy!

Thanks

WarrenW · December 3, 2013, 9:12pm

I loaded the code from the tutorial with no images and it worked fine. I put images in one tab and it failed. Anyone know why?

ksan · December 3, 2013, 9:22pm

Got it! Sorry for missing this earlier. Your slashes are pointing the wrong way in your image file path… They should be like :

“images/homered.png”,

rather than

“images\homered.png”,

which you have now. Hope this helps.

WarrenW · December 3, 2013, 9:26pm

I wish that was it but it is not. I had put the images in the same folder rather than the images folder and just had the images name there and still same issue. I am going to copy all of the code and images from their business demo online that works for me and then make changes till I have mine working. Unless you or someone sees what it is. Its probably something stupid I am missing!!

Warren

ksan · December 3, 2013, 9:31pm

Can you try

width = display.contentWidth,

rather than width = 300,

I don’t think CL tabBar implementation supports tabBar covering less than the width of your display. Maybe thats it.

WarrenW · December 3, 2013, 9:35pm

That wasn’t it either. The text demo was set to 240 and worked. I changed it anyways and fails with an image in the tab. The tab bar is drawing but fails before it draws the tabs.

ksan · December 3, 2013, 9:39pm

how about just trying to use the Corona Labs logo from Business Sample App. Just to rule out if anything is wrong with your images. Lets see if your code with CL icon works as is. Then its a matter of troubleshooting your image files.

ksan · December 3, 2013, 9:02pm

In each your button definition area can you try putting in a label="", and see what happens? So your first button def would look like the following :

local tabButtons = { { id = "Tab1", width = 48, height = 48, label = "", defaultFile = "images\homered.png", overFile = "images\homered.png", onPress = onPress, selected = true },

Please put the label="", in each button and lets see if that solves the problem.

WarrenW · December 3, 2013, 9:05pm

I just tried and same error. I thought of that before but saw it was optional according to the docs. Nut sure what could be nil but its driving me crazy!

Thanks

WarrenW · December 3, 2013, 9:12pm

I loaded the code from the tutorial with no images and it worked fine. I put images in one tab and it failed. Anyone know why?

ksan · December 3, 2013, 9:22pm

Got it! Sorry for missing this earlier. Your slashes are pointing the wrong way in your image file path… They should be like :

“images/homered.png”,

rather than

“images\homered.png”,

which you have now. Hope this helps.

WarrenW · December 3, 2013, 9:26pm

I wish that was it but it is not. I had put the images in the same folder rather than the images folder and just had the images name there and still same issue. I am going to copy all of the code and images from their business demo online that works for me and then make changes till I have mine working. Unless you or someone sees what it is. Its probably something stupid I am missing!!

Warren

ksan · December 3, 2013, 9:31pm

Can you try

width = display.contentWidth,

rather than width = 300,

I don’t think CL tabBar implementation supports tabBar covering less than the width of your display. Maybe thats it.

WarrenW · December 3, 2013, 9:35pm

That wasn’t it either. The text demo was set to 240 and worked. I changed it anyways and fails with an image in the tab. The tab bar is drawing but fails before it draws the tabs.

ksan · December 3, 2013, 9:39pm

how about just trying to use the Corona Labs logo from Business Sample App. Just to rule out if anything is wrong with your images. Lets see if your code with CL icon works as is. Then its a matter of troubleshooting your image files.