Trying to Make a Button That Hides When Clicked On.

[sulmaxcp]

What I am attempting to do is to make a button which allows a OnPress event that hides itself and also opens a new scene as at the moment the button will go to a new scene but the button still appears on the screen.

I thought this might work to make the button hide when clicked on but it didn’t.

[LUA]

local composer = require( “composer” )

local scene = composer.newScene()

local widget = require “widget”

function scene:create( event )

local sceneGroup = self.view

buttonForm = widget.newButton{ 

        defaultFile=“FormImage.png”, 

        onRelease = hideImage    

    }

    buttonForm.x = 100 

    buttonForm.y = 100 

local function hideImage()

        buttonForm.isVisible = false

end

end

scene:addEventListener( “create”, scene )

return scene

[/LUA]

But then the other issue would be how to then make the button also go to a different scene.

Thanks again,

Matt.

[James_Sherburne]

Matt,

When you use Composer, you need to insert all of your display objects into the sceneGroup. When you transition to a new scene, composer will take care of removing display objects. After you declare “buttonForm”, do this.

sceneGroup:insert(buttonForm)

For a new scene, simply declare new buttons, rather than trying to move buttons between scenes.

[sulmaxcp]

I gave it a go and I keep getting errors, how would the code be displayed as I’m writing it like this…

[lua]

local composer = require( “composer” )

local scene = composer.newScene()

local widget = require( “widget” )

local function onThirdView( event )

    composer.gotoScene( “settings” )

end

function scene:create( event )

local sceneGroup = self.view

local formButton1 = widget.newButton

    formButton1.width = 75,

    formButton1.height = 75,

    formButton1.defaultFile = “FormImage.png”,

    formButton1.onPress = onThirdView,

    formButton1.top = 50,

    formButton1.left = 100

    

sceneGroup:insert( formButton1 )

end

scene:addEventListener( “create”, scene )

return scene

[/lua]

Thanks,

Matt.

[James_Sherburne]

What errors are you getting? 

Your button needs the braces, could that be it?

local formButton1 = widget.newButton{ formButton1.width = 75, formButton1.height = 75, formButton1.defaultFile = "FormImage.png", formButton1.onPress = onThirdView, formButton1.top = 50, formButton1.left = 100 }

[sulmaxcp]

I tried adding the braces as advised but the error didn’t change at all but for the mean time i’ve left them in.

The error i’m getting is

[C]: in function ‘error’

?: in function ‘gotoScene’

c:\users\matt\documents\corona projects\tab bar\main.lua:19: in function ‘_onPress’

?: in function <?:789>

?: in function <?:221>

[James_Sherburne]

Try this. Look at how this is different than what you had before.

local formButton1 = widget.newButton{ width = 75, height = 75, defaultFile = "FormImage.png", onPress = onThirdView, top = 50, left = 100 }

[sulmaxcp]

I’ve given this a try and the button is appearing on screen with know error codes, however when I attempt to change scene the button stays on the screen even know a different page has loaded .

Example =

Page Forms - has the button on - when it is clicked it goes to settings page 

If the page forms has been opened (with the button on) then the button doesn’t disappear when Home page is opened or settings page. How can I make it so that the button is hidden when the next scene is loaded? Previously you said try adding it to the [lua]sceneGroup:insert(buttonForm)[/lua] which I tried but this simply makes the button not appear on any of the scenes. How can I fix this?

Thanks,

Matt.

[James_Sherburne]

You need to be following Corona’s Composer scenetemplate.lua file when you create your scenes. The file you posted only includes a scene:create method. Where are the other composer methods? Without them, Composer will not handle scene transitions correctly. This is likely your problem.

 Here’s the scenetemplate.lua file. Copy it and save it for future use. Any time you need a new scene, it should be based off this.

---------------------------------------------------------------------------------- -- -- scenetemplate.lua -- ---------------------------------------------------------------------------------- local composer = require( "composer" ) local scene = composer.newScene() --------------------------------------------------------------------------------- function scene:create( event ) local sceneGroup = self.view -- Called when the scene's view does not exist. -- -- INSERT code here to initialize the scene -- e.g. add display objects to 'sceneGroup', add touch listeners, etc. end function scene:show( event ) local sceneGroup = self.view local phase = event.phase if phase == "will" then -- Called when the scene is still off screen and is about to move on screen elseif phase == "did" then -- Called when the scene is now on screen -- -- INSERT code here to make the scene come alive -- e.g. start timers, begin animation, play audio, etc. end end function scene:hide( event ) local sceneGroup = self.view local phase = event.phase if event.phase == "will" then -- Called when the scene is on screen and is about to move off screen -- -- INSERT code here to pause the scene -- e.g. stop timers, stop animation, unload sounds, etc.) elseif phase == "did" then -- Called when the scene is now off screen end end function scene:destroy( event ) local sceneGroup = self.view -- Called prior to the removal of scene's "view" (sceneGroup) -- -- INSERT code here to cleanup the scene -- e.g. remove display objects, remove touch listeners, save state, etc. end --------------------------------------------------------------------------------- -- Listener setup scene:addEventListener( "create", scene ) scene:addEventListener( "show", scene ) scene:addEventListener( "hide", scene ) scene:addEventListener( "destroy", scene ) --------------------------------------------------------------------------------- return scene

[sulmaxcp]

I didn’t realise I needed it as there was no code in them. However I have now included the template code and implemented my code but I am still having no button appear on the forms scene. My code now looks like this… Any ideas?

[lua]

---

–

– forms.lua

–

---

local composer = require( “composer” )

local scene = composer.newScene()

local widget = require( “widget” )

local function onThirdView( event )

    composer.gotoScene( “settings” )

end

function scene:create( event )

local sceneGroup = self.view

– Called when the scene’s view does not exist.

– 

– INSERT code here to initialize the scene

– e.g. add display objects to ‘sceneGroup’, add touch listeners, etc.

– create a white background to fill screen

local bg = display.newRect( 0, 0, display.contentWidth, display.contentHeight )

bg.anchorX = 0

bg.anchorY = 0

bg:setFillColor( 1 ) – white

– create some text

local title = display.newText( “Forms”, 0, 0, native.systemFont, 32 )

title:setFillColor( 0 ) – black

title.x = display.contentWidth * 0.5

title.y = -10

– create a button 

local formButton1 = widget.newButton{

    width = 75,

    height = 75,

    defaultFile = “FormImage.png”,

    onPress = onThirdView,

      Top = 50,

      Left = 100

}

sceneGroup:insert(formButton1)

sceneGroup:insert( bg )

sceneGroup:insert( title )

end

function scene:show( event )

local sceneGroup = self.view

local phase = event.phase

if phase == “will” then

– Called when the scene is still off screen and is about to move on screen

elseif phase == “did” then

– Called when the scene is now on screen

– 

– INSERT code here to make the scene come alive

– e.g. start timers, begin animation, play audio, etc.

end

end

function scene:hide( event )

local sceneGroup = self.view

local phase = event.phase

if event.phase == “will” then

– Called when the scene is on screen and is about to move off screen

–

– INSERT code here to pause the scene

– e.g. stop timers, stop animation, unload sounds, etc.)

elseif phase == “did” then

– Called when the scene is now off screen

end

end

function scene:destroy( event )

local sceneGroup = self.view

– Called prior to the removal of scene’s “view” (sceneGroup)

– 

– INSERT code here to cleanup the scene

– e.g. remove display objects, remove touch listeners, save state, etc.

end

---

– Listener setup

scene:addEventListener( “create”, scene )

scene:addEventListener( “show”, scene )

scene:addEventListener( “hide”, scene )

scene:addEventListener( “destroy”, scene )

---

return scene
[/lua]

[sulmaxcp]

Finally worked out the issue the scene groups where in the wrong order as it was

[lua]

sceneGroup:insert( formButton1 )

sceneGroup:insert( bg )

sceneGroup:insert( title )

[/lua]

and it should have been

[lua]

sceneGroup:insert( bg )

sceneGroup:insert( title )

sceneGroup:insert( formButton1 )

[/lua]

[James_Sherburne]

Matt,

When you use Composer, you need to insert all of your display objects into the sceneGroup. When you transition to a new scene, composer will take care of removing display objects. After you declare “buttonForm”, do this.

sceneGroup:insert(buttonForm)

For a new scene, simply declare new buttons, rather than trying to move buttons between scenes.

[sulmaxcp]

I gave it a go and I keep getting errors, how would the code be displayed as I’m writing it like this…

[lua]

local composer = require( “composer” )

local scene = composer.newScene()

local widget = require( “widget” )

local function onThirdView( event )

    composer.gotoScene( “settings” )

end

function scene:create( event )

local sceneGroup = self.view

local formButton1 = widget.newButton

    formButton1.width = 75,

    formButton1.height = 75,

    formButton1.defaultFile = “FormImage.png”,

    formButton1.onPress = onThirdView,

    formButton1.top = 50,

    formButton1.left = 100

    

sceneGroup:insert( formButton1 )

end

scene:addEventListener( “create”, scene )

return scene

[/lua]

Thanks,

Matt.

[James_Sherburne]

What errors are you getting? 

Your button needs the braces, could that be it?

local formButton1 = widget.newButton{ formButton1.width = 75, formButton1.height = 75, formButton1.defaultFile = "FormImage.png", formButton1.onPress = onThirdView, formButton1.top = 50, formButton1.left = 100 }

[sulmaxcp]

I tried adding the braces as advised but the error didn’t change at all but for the mean time i’ve left them in.

The error i’m getting is

[C]: in function ‘error’

?: in function ‘gotoScene’

c:\users\matt\documents\corona projects\tab bar\main.lua:19: in function ‘_onPress’

?: in function <?:789>

?: in function <?:221>

[James_Sherburne]

Try this. Look at how this is different than what you had before.

local formButton1 = widget.newButton{ width = 75, height = 75, defaultFile = "FormImage.png", onPress = onThirdView, top = 50, left = 100 }

[sulmaxcp]

I’ve given this a try and the button is appearing on screen with know error codes, however when I attempt to change scene the button stays on the screen even know a different page has loaded .

Example =

Page Forms - has the button on - when it is clicked it goes to settings page 

If the page forms has been opened (with the button on) then the button doesn’t disappear when Home page is opened or settings page. How can I make it so that the button is hidden when the next scene is loaded? Previously you said try adding it to the [lua]sceneGroup:insert(buttonForm)[/lua] which I tried but this simply makes the button not appear on any of the scenes. How can I fix this?

Thanks,

Matt.

[James_Sherburne]

You need to be following Corona’s Composer scenetemplate.lua file when you create your scenes. The file you posted only includes a scene:create method. Where are the other composer methods? Without them, Composer will not handle scene transitions correctly. This is likely your problem.

 Here’s the scenetemplate.lua file. Copy it and save it for future use. Any time you need a new scene, it should be based off this.

---------------------------------------------------------------------------------- -- -- scenetemplate.lua -- ---------------------------------------------------------------------------------- local composer = require( "composer" ) local scene = composer.newScene() --------------------------------------------------------------------------------- function scene:create( event ) local sceneGroup = self.view -- Called when the scene's view does not exist. -- -- INSERT code here to initialize the scene -- e.g. add display objects to 'sceneGroup', add touch listeners, etc. end function scene:show( event ) local sceneGroup = self.view local phase = event.phase if phase == "will" then -- Called when the scene is still off screen and is about to move on screen elseif phase == "did" then -- Called when the scene is now on screen -- -- INSERT code here to make the scene come alive -- e.g. start timers, begin animation, play audio, etc. end end function scene:hide( event ) local sceneGroup = self.view local phase = event.phase if event.phase == "will" then -- Called when the scene is on screen and is about to move off screen -- -- INSERT code here to pause the scene -- e.g. stop timers, stop animation, unload sounds, etc.) elseif phase == "did" then -- Called when the scene is now off screen end end function scene:destroy( event ) local sceneGroup = self.view -- Called prior to the removal of scene's "view" (sceneGroup) -- -- INSERT code here to cleanup the scene -- e.g. remove display objects, remove touch listeners, save state, etc. end --------------------------------------------------------------------------------- -- Listener setup scene:addEventListener( "create", scene ) scene:addEventListener( "show", scene ) scene:addEventListener( "hide", scene ) scene:addEventListener( "destroy", scene ) --------------------------------------------------------------------------------- return scene

[sulmaxcp]

I didn’t realise I needed it as there was no code in them. However I have now included the template code and implemented my code but I am still having no button appear on the forms scene. My code now looks like this… Any ideas?

[lua]

---

–

– forms.lua

–

---

local composer = require( “composer” )

local scene = composer.newScene()

local widget = require( “widget” )

local function onThirdView( event )

    composer.gotoScene( “settings” )

end

function scene:create( event )

local sceneGroup = self.view

– Called when the scene’s view does not exist.

– 

– INSERT code here to initialize the scene

– e.g. add display objects to ‘sceneGroup’, add touch listeners, etc.

– create a white background to fill screen

local bg = display.newRect( 0, 0, display.contentWidth, display.contentHeight )

bg.anchorX = 0

bg.anchorY = 0

bg:setFillColor( 1 ) – white

– create some text

local title = display.newText( “Forms”, 0, 0, native.systemFont, 32 )

title:setFillColor( 0 ) – black

title.x = display.contentWidth * 0.5

title.y = -10

– create a button 

local formButton1 = widget.newButton{

    width = 75,

    height = 75,

    defaultFile = “FormImage.png”,

    onPress = onThirdView,

      Top = 50,

      Left = 100

}

sceneGroup:insert(formButton1)

sceneGroup:insert( bg )

sceneGroup:insert( title )

end

function scene:show( event )

local sceneGroup = self.view

local phase = event.phase

if phase == “will” then

– Called when the scene is still off screen and is about to move on screen

elseif phase == “did” then

– Called when the scene is now on screen

– 

– INSERT code here to make the scene come alive

– e.g. start timers, begin animation, play audio, etc.

end

end

function scene:hide( event )

local sceneGroup = self.view

local phase = event.phase

if event.phase == “will” then

– Called when the scene is on screen and is about to move off screen

–

– INSERT code here to pause the scene

– e.g. stop timers, stop animation, unload sounds, etc.)

elseif phase == “did” then

– Called when the scene is now off screen

end

end

function scene:destroy( event )

local sceneGroup = self.view

– Called prior to the removal of scene’s “view” (sceneGroup)

– 

– INSERT code here to cleanup the scene

– e.g. remove display objects, remove touch listeners, save state, etc.

end

---

– Listener setup

scene:addEventListener( “create”, scene )

scene:addEventListener( “show”, scene )

scene:addEventListener( “hide”, scene )

scene:addEventListener( “destroy”, scene )

---

return scene
[/lua]

[sulmaxcp]

Finally worked out the issue the scene groups where in the wrong order as it was

[lua]

sceneGroup:insert( formButton1 )

sceneGroup:insert( bg )

sceneGroup:insert( title )

[/lua]

and it should have been

[lua]

sceneGroup:insert( bg )

sceneGroup:insert( title )

sceneGroup:insert( formButton1 )

[/lua]