Will Tabbar load on top of Storyboard?

I can’t get the tabbar to load on my storyboard. Also can ListView3 be put in one tabbar Screen that lays ontop of storyboard? Thanks. [import]uid: 88495 topic_id: 35021 reply_id: 335021[/import]

I’m currently developing an app with tabbars, tableviews and listviews all in storyboard.

I don’t have an issue with them showing how I want them, ie tabbar covering listview.

By the sounds of it you just need to make sure you add your tabbar to the top group.

For example

[lua]local listgroup = display.newGroup()
local tabgroup = display.newGroup()

– create and add your listView to your listgroup
– create and add your tabBar to your tabgroup
– then
group:insert(listgroup)
group:insert(tabgroup)[/lua]

By adding the tabgroup last to the main group everything in that group will be above the rest of your display objects. [import]uid: 179960 topic_id: 35021 reply_id: 139228[/import]

I guess I got ahead of myself, I can’t even get the tabbar to display on top.

My main loads the intro. Should these be in the main?I apologize, I need to see code visual, most of the time.Thanks.

intro.lua

[code]
module(…, package.seeall)
local widget = require( “widget” )
local ui = require ( “ui” )

local viewController = require(“viewController”)

local roundedRect = display.newRoundedRect( 360, 225, 300, 40, 8 )
roundedRect:setFillColor( 0, 0, 0, 170 )

local t = display.newText( “Waiting for button event…”, 0, 0, “AmericanTypewriter-Bold”, 18 )
t.x, t.y = display.contentCenterX, 240

local mainView, tabView, currentScreen, tabBar

local mainView = display.newGroup()
local tabView = display.newGroup()
function new()
local localGroup = display.newGroup();


– Create 5 buttons, using different optional attributes

local function init()

local function loadScreen(newScreen)
if currentScreen then
currentScreen:cleanUp()
end
currentScreen = require(newScreen).new()
tabView:insert(currentScreen)

return true
end

local function showScreen(event)
local t = event.target
local phase = event.phase

if phase == “ended” then
if t.id == 1 then
loadScreen(“screen1”)
elseif t.id == 2 then
loadScreen(“screen2”)
elseif t.id == 3 then
loadScreen(“screen3”)
end
tabBar.selected(t)
end

return true
end

–Create a group that contains the entire screen and tab bar

–Create a group that contains the screens beneath the tab bar

mainView:insert(tabView)

loadScreen(“screen1”)

tabBar = viewController.newTabBar{
background = “tabBar.png”, --tab bar background
tabs = {“Play”, “News”, “About”}, --names to appear under each tab icon
onRelease = showScreen --function to execute when pressed
}
mainView:insert(tabBar)

tabBar.selected()

return true
end

– These are the functions triggered by the buttons

local button1Press = function( event )
if event.phase == “release” then
director:changeScene( “concoctions”, “fade” )
end
end

local button1Release = function( event )
if event.phase == “release” then
director:changeScene( “concoctions”, “fade” )
end
end
– These other four buttons share a single event handler function, identifying themselves by “id”
– Note that if a general “onEvent” handler is assigned, it overrides the “onPress” and “onRelease” handling

– Also, some label fonts may appear vertically offset in the Simulator, but not on device, due to
– different device font rendering. The button object has an optional “offset” property for minor
– vertical adjustment to the label position, if necessary (example: offset = -2)

local button2 = widget.newButton{
default = “buttonYellow.png”,
over = “buttonYellowOver.png”,
onEvent = buttonHandler,
id = “button2”,
label = “Condos”,
font = “Trebuchet-BoldItalic”,
labelColor = { default = { 51, 51, 51, 255 } },
fontSize = 22,
emboss = true
}

local button3 = widget.newButton{
default = “buttonGray.png”,
over = “buttonBlue.png”,
onEvent = buttonHandler,
id = “button3”,
label = “Amenities”,
font = “MarkerFelt-Thin”,
fontSize = 28,
emboss = true
}

----------------more buttons-------------

return localGroup;
end

[/code] [import]uid: 88495 topic_id: 35021 reply_id: 139240[/import]

Should line 71 not be

[lua]tabBar = widget.newTabBar{[/lua]
[import]uid: 179960 topic_id: 35021 reply_id: 139244[/import]

That did not create error nor change any elements. [import]uid: 88495 topic_id: 35021 reply_id: 139248[/import]

With Storyboard, things you DO NOT put into a storyboard view/group always stays on top. Typically you would create your tabBar in main.lua and do not manage it with storyboard and it will always be there on top.

[import]uid: 199310 topic_id: 35021 reply_id: 139263[/import]

I copied directly tabbar sample into my main file but retured a error for UI.lua of line 143. This lists a error for…, ‘newButton’? viRuntime error. Attempt to index local ‘button’ viewController.lu

Heres a link to the visual of the error…Thanks.

http://stephendrotar.com/apps/ui/ [import]uid: 88495 topic_id: 35021 reply_id: 139281[/import]

I swapped out the files in my main.lua and called intro.lua main.lua. Then, turned scene1.lua into my old intro.lua.

My next question…

I’m putting these into the scene1.lua…but still getting the error storyboard.gotoScene( “scene1”, “fade”, 400 ) can you help.Thanks.

function new()  
 local localGroup = display.newGroup();  
-------------------------------------------------------------------------------  
-- Create 5 buttons, using different optional attributes  
-------------------------------------------------------------------------------  
-- These are the functions triggered by the buttons  
local button1Release = function( event )  
if event.phase == "release" then  
 director:changeScene( "a", "fade" )  
 end  
end  
local buttonHandler = function( event )  
 if event.phase == "release" then  
 director:changeScene( "b", "fade" )  
 end  
end  
local buttonC = function( event )  
 if event.phase == "release" then  
 director:changeScene( "c", "fade" )  
 end  
end  
local link = function( event )  
 if event.phase == "release" then  
 director:changeScene( "a", "fade" )  
 end  
end  
  
local link = function( event )  
 if event.phase == "release" then  
 director:changeScene( "e", "fade" )  
 end  
end  
  
-- This button has individual press and release functions  
-- (The label font defaults to native.systemFontBold if no font is specified)  
  
local button1 = widget.newButton{  
 default = "buttonRed.png",  
 over = "buttonRedOver.png",  
 onPress = button1Press,  
 onRelease = button1Release,  
 label = "A",  
 emboss = true  
}  
-- These other four buttons share a single event handler function, identifying themselves by "id"  
-- Note that if a general "onEvent" handler is assigned, it overrides the "onPress" and "onRelease" handling  
  
-- Also, some label fonts may appear vertically offset in the Simulator, but not on device, due to  
-- different device font rendering. The button object has an optional "offset" property for minor  
-- vertical adjustment to the label position, if necessary (example: offset = -2)  
  
local C = widget.newButton{  
 default = "buttonYellow.png",  
 over = "buttonYellowOver.png",  
 onEvent = buttonC,  
 id = "c",  
 label = "C",  
 font = "Trebuchet-BoldItalic",  
 labelColor = { default = { 51, 51, 51, 255 } },  
 fontSize = 22,  
 emboss = true  
}  

[import]uid: 88495 topic_id: 35021 reply_id: 139287[/import]

The code you just posted is Director code, not storyboard code. [import]uid: 199310 topic_id: 35021 reply_id: 139329[/import]

Could I put buttonOn, buttonRelease inside a screen to view another screen having a scroll text screen through storyboard?
I really like the ButtonOn, ButtonOff functions and I’d like to use that as a menu to view some pdf’s, scroll text and such, along with a tabbar that can show maybe a map and a contact us scene for web integration.

Is this all possible with storyboard? Can storyboard transition with a menu or is that a Director feature?Thanks. [import]uid: 88495 topic_id: 35021 reply_id: 139331[/import]

Storyboard can do pretty much whatever you want it to, it’s just a convenient way of moving between distinct sections of your app and keeping things neat and tidy in terms of memory handling etc.

You could have a storyboard scene with all your menu buttons, and then each button triggers the loading of a different storyboard scene. If you wanted the menu to still stay visible underneath the new scene, you can use storyboard overlays, which loads a scene on top of the existing one.

For something like a simple ‘contact us’ page, rather than have a separate scene for that, I might create a separate display group containing that stuff within the same scene, and initially give that display group an X value of say 600, hiding it off the side of the screen.

When the ‘contact us’ button is clicked, simply transition the display group to X = 0, and slide it out again when a back button or close button is pressed. [import]uid: 93133 topic_id: 35021 reply_id: 139336[/import]

I’m having trouble resizing the widget demo to 640x1136, any clue how to get the widget resized?Thanks. [import]uid: 88495 topic_id: 35021 reply_id: 139347[/import]

If I get this error storyboard.gotoScene("scene1",options) does that mean the programming error is in Scene1?

[code]
display.setStatusBar( display.HiddenStatusBar )

local storyboard = require “storyboard”
local widget = require( “widget” )

– load first scene
storyboard.gotoScene( “scene1”, “slideLeft”, 400 )
[/code] [import]uid: 88495 topic_id: 35021 reply_id: 139352[/import]

storyboard.gotoScene(“scene1”,options) doesn’t sound like an error to me unless there is other text to go with it saying what the error is and where.

As to the resizing widgets, if you took sample code from the docs, all most all of that is sized based on a canvas of 320x480. You are using a canvas that is twice the size, so you need to double all your numbers (width, height, top, left, etc.) to represent the larger scale. So if you previously had a 120x48 button that’s too small using your scale, simply make it 240x96.

[import]uid: 199310 topic_id: 35021 reply_id: 139412[/import]

I’m currently developing an app with tabbars, tableviews and listviews all in storyboard.

I don’t have an issue with them showing how I want them, ie tabbar covering listview.

By the sounds of it you just need to make sure you add your tabbar to the top group.

For example

[lua]local listgroup = display.newGroup()
local tabgroup = display.newGroup()

– create and add your listView to your listgroup
– create and add your tabBar to your tabgroup
– then
group:insert(listgroup)
group:insert(tabgroup)[/lua]

By adding the tabgroup last to the main group everything in that group will be above the rest of your display objects. [import]uid: 179960 topic_id: 35021 reply_id: 139228[/import]

I guess I got ahead of myself, I can’t even get the tabbar to display on top.

My main loads the intro. Should these be in the main?I apologize, I need to see code visual, most of the time.Thanks.

intro.lua

[code]
module(…, package.seeall)
local widget = require( “widget” )
local ui = require ( “ui” )

local viewController = require(“viewController”)

local roundedRect = display.newRoundedRect( 360, 225, 300, 40, 8 )
roundedRect:setFillColor( 0, 0, 0, 170 )

local t = display.newText( “Waiting for button event…”, 0, 0, “AmericanTypewriter-Bold”, 18 )
t.x, t.y = display.contentCenterX, 240

local mainView, tabView, currentScreen, tabBar

local mainView = display.newGroup()
local tabView = display.newGroup()
function new()
local localGroup = display.newGroup();


– Create 5 buttons, using different optional attributes

local function init()

local function loadScreen(newScreen)
if currentScreen then
currentScreen:cleanUp()
end
currentScreen = require(newScreen).new()
tabView:insert(currentScreen)

return true
end

local function showScreen(event)
local t = event.target
local phase = event.phase

if phase == “ended” then
if t.id == 1 then
loadScreen(“screen1”)
elseif t.id == 2 then
loadScreen(“screen2”)
elseif t.id == 3 then
loadScreen(“screen3”)
end
tabBar.selected(t)
end

return true
end

–Create a group that contains the entire screen and tab bar

–Create a group that contains the screens beneath the tab bar

mainView:insert(tabView)

loadScreen(“screen1”)

tabBar = viewController.newTabBar{
background = “tabBar.png”, --tab bar background
tabs = {“Play”, “News”, “About”}, --names to appear under each tab icon
onRelease = showScreen --function to execute when pressed
}
mainView:insert(tabBar)

tabBar.selected()

return true
end

– These are the functions triggered by the buttons

local button1Press = function( event )
if event.phase == “release” then
director:changeScene( “concoctions”, “fade” )
end
end

local button1Release = function( event )
if event.phase == “release” then
director:changeScene( “concoctions”, “fade” )
end
end
– These other four buttons share a single event handler function, identifying themselves by “id”
– Note that if a general “onEvent” handler is assigned, it overrides the “onPress” and “onRelease” handling

– Also, some label fonts may appear vertically offset in the Simulator, but not on device, due to
– different device font rendering. The button object has an optional “offset” property for minor
– vertical adjustment to the label position, if necessary (example: offset = -2)

local button2 = widget.newButton{
default = “buttonYellow.png”,
over = “buttonYellowOver.png”,
onEvent = buttonHandler,
id = “button2”,
label = “Condos”,
font = “Trebuchet-BoldItalic”,
labelColor = { default = { 51, 51, 51, 255 } },
fontSize = 22,
emboss = true
}

local button3 = widget.newButton{
default = “buttonGray.png”,
over = “buttonBlue.png”,
onEvent = buttonHandler,
id = “button3”,
label = “Amenities”,
font = “MarkerFelt-Thin”,
fontSize = 28,
emboss = true
}

----------------more buttons-------------

return localGroup;
end

[/code] [import]uid: 88495 topic_id: 35021 reply_id: 139240[/import]

Should line 71 not be

[lua]tabBar = widget.newTabBar{[/lua]
[import]uid: 179960 topic_id: 35021 reply_id: 139244[/import]

That did not create error nor change any elements. [import]uid: 88495 topic_id: 35021 reply_id: 139248[/import]

With Storyboard, things you DO NOT put into a storyboard view/group always stays on top. Typically you would create your tabBar in main.lua and do not manage it with storyboard and it will always be there on top.

[import]uid: 199310 topic_id: 35021 reply_id: 139263[/import]

I copied directly tabbar sample into my main file but retured a error for UI.lua of line 143. This lists a error for…, ‘newButton’? viRuntime error. Attempt to index local ‘button’ viewController.lu

Heres a link to the visual of the error…Thanks.

http://stephendrotar.com/apps/ui/ [import]uid: 88495 topic_id: 35021 reply_id: 139281[/import]