We'll place loading screens when the application launches and before the game level starts. This tells the user that more content or information is on its way.
loadmainmenu.lua
in your project folder.composer.newScene()
function:local composer = require( "composer" ) local scene = composer.newScene()
myTimer
and loadingImage
. Add in the create()
event and a sceneGroup
display group:local myTimer local loadingImage -- Called when the scene's view does not exist: function scene:create( event ) local sceneGroup = self.view print( "\nloadmainmenu: create event" ) end
show()
event and add in a sceneGroup
display group:-- Called immediately after scene has moved onscreen: function scene:show( event ) local sceneGroup = self.view print( "loadmainmenu: show event" )
loadingImage
display object:loadingImage = display.newImageRect( "loading.png", 480, 320) loadingImage.x = 240; loadingImage.y = 160 sceneGroup:insert( loadingImage )
goToMenu()
and call composer.gotoScene( "mainmenu", "zoomOutInFadeRotate", 500 )
to change the scene to "mainmenu"
:local goToMenu = function() composer.gotoScene( "mainmenu", "zoomOutInFadeRotate", 500) end
timer
function and have it call goToMenu()
once every 1,000 milliseconds. Define it with the myTimer
timer ID. Close the show()
event with end
:myTimer = timer.performWithDelay( 1000, goToMenu, 1 ) end
hide()
and destroy()
events. In the hide()
event, cancel myTimer
:-- Called when scene is about to move offscreen: function scene:hide() if myTimer then timer.cancel( myTimer ); end print( "loadmainmenu: hide event" ) end -- Called prior to the removal of scene's "view" (display group) function scene:destroy( event ) print( "destroying loadmainmenu's view" ) end
return scene
. Save and close the file:-- "create" event is dispatched if scene's view does not exist scene:addEventListener( "create", scene ) -- "show" event is dispatched whenever scene transition has finished scene:addEventListener( "show", scene ) -- "hide" event is dispatched before next scene's transition begins scene:addEventListener( "hide", scene ) -- "destroy" event is dispatched before view is unloaded, which can be scene:addEventListener( "destroy", scene ) return scene
loadgame.lua
in your project folder. We'll make another loading screen that occurs right before the game scene, maingame.lua
. Use composer.gotoScene( "maingame", "flipFadeOutIn", 500 )
to transition scenes. Save and close your file:local composer = require( "composer" ) local scene = composer.newScene() local myTimer local loadingImage -- Called when the scene's view does not exist: function scene:create( event ) local sceneGroup = self.view -- completely remove mainmenu composer.removeScene( "mainmenu" ) print( "\nloadgame: create event" ) end -- Called immediately after scene has moved onscreen: function scene:show( event ) local sceneGroup = self.view print( "loadgame: show event" ) loadingImage = display.newImageRect( "loading.png", 480, 320) loadingImage.x = 240; loadingImage.y = 160 sceneGroup:insert( loadingImage ) local changeScene = function() composer.gotoScene( "maingame", "flipFadeOutIn", 500 ) end myTimer = timer.performWithDelay( 1000, changeScene, 1 ) end -- Called when scene is about to move offscreen: function scene:hide() if myTimer then timer.cancel( myTimer ); end print( "loadgame: hide event" ) end -- Called prior to the removal of scene's "view" (display group) function scene:destroy( event ) print( "destroying loadgame's view" ) end -- "create" event is dispatched if scene's view does not exist scene:addEventListener( "create", scene ) -- "show" event is dispatched whenever scene transition has finished scene:addEventListener( "show", scene ) -- "hide" event is dispatched before next scene's transition begins scene:addEventListener( "hide", scene ) -- "destroy" event is dispatched before view is unloaded, which can be scene:addEventListener( "destroy", scene ) return scene
In the loadmainmenu.lua
file, once loadingImage
was added to the screen, we created the goToMenu()
function to change scenes to "mainmenu"
and use the "zoomOutInFadeRotate"
transition that zooms out and rotates the loading screen image as it fades to the background. The myTimer = timer.performWithDelay( 1000, goToMenu, 1 )
statement performs the function in 1,000 milliseconds (one second) and runs it once. This is long enough to view the image and have it fade out.
All display objects enter the scene by function scene:show( event )
. The loadingImage
object is placed in sceneGroup
. To make sure we have no timers running after the scene change, myTime
r stops running with the use of timer.cancel(myTimer)
under function scene:hide()
.
The code for loadgame.lua
is similar to loadmainmenu.lua
. For this file, Composer transitions scenes to maingame.lua
, the game play file.