Hi there !
I’m using a splash screen (the “Default-568h@2x” png, base at the root of my app) in horizontal view when I launch my app. It works fine and storyboard transitions works fine when it goes to my home screen (with fading).
But everytime I change scene, the splash screen appears for less than a second.
I guess it’s related to the way I use the storyboard API, but I have no clue how to deal with that…
Any idea ?
Are you loading that image in your main.lua or some other scene?
Sorry, I was incorrect in my first post ! It doesn’t occures every time I change scene.
First : i’m loading the splash screen in main.lua.
When I go to an other scene, just by using storyboard.gotoScene(“scene”), it works just fine.
But, in some case, I use some “handmade transitions” : I’ve got a round shape which size grows until it covers all the screen, using “transition.to”. Once it reaches its final size, I finally call the gotoScene function. That’s where there’s that “bug” : for a brief moment, the screen goes black and I can see the splash screen.
From what I understood, I should remove my splash screen once main.lua has been loaded. But then, there’s stlil that blackscreen between scenes, using that handmade transition.
I think i’m gonna try to do it in a new simplified project to see if it happens again or if that’s something else.
So, i’ve uploaded a file with two simplified examples of what I’m trying to explain here 
http://www.visual-music.org/evans/corona/TransitionsStoryboard.zip
In the zip files, there are two folders composed in the same way : a main.lua file (which calls the splash screen), 01_startscreen.lua, 02_menuscreen.lua.
First folder, “BUG” should show the starscreen. When you tap the start screen, a rectangle grows until it fills the screen, and then call “menuscreen”. As you can see, between the two scenes, you can see the splash screen behind and the blackscreen.
In the second folder, “WORKS”, once you tap the startscreen, it directly calls the “menuscreen”. And you can’t see the splashscreen / blackscreen.
I have absolutely no idea on how to deal with this…
And if you don’t wanna download the file, here is the code of the “buggy” version. (For the working fine version, simply call “moveToScene” in the touch event.
"BUGGY VERSION" :
- main.lua
-- Splash screen splashScreen = display.newImage("Default-568h@2x.png") splashScreen.anchorX = 0; splashScreen.anchorY = 0; -- Storyboard local storyboard = require "storyboard" storyboard.purgeOnSceneChange = true storyboard.gotoScene("01\_startscreen")
01_startscreen
local storyboard = require(“storyboard”) storyboard.purgeOnSceneChange = true local scene = storyboard.newScene() – Forward declaration local gameGroup local _W local _H local background local text local rectangleTransition local touchEvent local moveToScene function scene:createScene(event) gameGroup = self.view _W = display.contentWidth*0.5; _H = display.contentHeight*0.5; – Background used in this scene background = display.newRect(0,0, display.contentWidth, display.contentHeight) background.x = _W; background.y = _H; gameGroup:insert(background) – Text showing the name of the scene text = display.newText( “01 START SCREEN”, 100, 200, native.systemFont, 16 ) text.x = _W; text.y = _H; text:setFillColor(0,0,0) gameGroup:insert(text) – Creation of the rectangle that will be used as a transition – By defalut, it’s invisible and set at the center of the scene rectangleTransition = display.newRect(0,0,1,1) rectangleTransition:setFillColor(0,1,0) rectangleTransition.x = _W; rectangleTransition.y = _H; gameGroup:insert(rectangleTransition) end function scene:enterScene(event) gameGroup = self.view – Touch event when background is tapped – Triggers the transition and then calls “moveToScene()” function touchEvent(event) if event.phase == “began” then rectangleTransition.alpha = 1; transition.to(rectangleTransition, {time=200, xScale=display.contentWidth}) transition.to(rectangleTransition, {time=200, yScale=display.contentHeight, onComplete=moveToScene}) end end function moveToScene() storyboard.gotoScene(“02_menuscreen”) end background:addEventListener(“touch”, touchEvent) end function scene:exitScene(event) gameGroup = self.view local name = storyboard.getCurrentSceneName() local scene = storyboard.getScene(name) local group = scene.view – Purge for i=gameGroup.numChildren, 1, -1 do display.remove(gameGroup[i]) gameGroup[i] = nil end gameGroup = nil end scene:addEventListener(“createScene”, scene) scene:addEventListener(“enterScene”, scene) scene:addEventListener(“exitScene”, scene) return scene
02_menuscreen.lua
local storyboard = require(“storyboard”) storyboard.purgeOnSceneChange = true local scene = storyboard.newScene() – Forward declaration local gameGroup local _W local _H local background local text function scene:createScene(event) gameGroup = self.view _W = display.contentWidth*0.5; _H = display.contentHeight*0.5; background = display.newRect(0,0, display.contentWidth, display.contentHeight) background:setFillColor(0,1,0) background.x = _W; background.y = _H; gameGroup:insert(background) text = display.newText( “02 MENU SCREEN”, 100, 200, native.systemFont, 16 ) text.x = _W; text.y = _H; text:setFillColor(0,0,0) gameGroup:insert(text) end function scene:enterScene(event) gameGroup = self.view end function scene:exitScene(event) gameGroup = self.view local name = storyboard.getCurrentSceneName() local scene = storyboard.getScene(name) local group = scene.view – Purge for i=gameGroup.numChildren, 1, -1 do display.remove(gameGroup[i]) gameGroup[i] = nil end gameGroup = nil end scene:addEventListener(“createScene”, scene) scene:addEventListener(“enterScene”, scene) scene:addEventListener(“exitScene”, scene) return scene
Okay, I’ve finally found something… But i’m not sure why it works :
When the “handmade” transition is done, the moveToScene() callback function should be like that :
function moveToScene() local transitionTimer = timer.performWithDelay(500, function() storyboard.gotoScene("02\_menuscreen"); end) end
Adding a delay prevents from having the black screen between scenes. It works, but I’m not sure why. If you’ve got a better idea than that, I’m listenning 
You don’t need to actually reference/load your splash-screen image in any way - in code.
As long as the image name is correct, it will automatically be displayed upon launching the application and remain onscreen until your menu scene (or whatever you have designated as the ‘go-to scene’) has been fully loaded.
Cheers!
-Saer
Default-568h@2x.png should work as a splash screen. No code needed just name the file you want to be your splashscreen that!
Yes, indeed. But that doesn’t fix the initial problem
Like I said, doing a transition on a display object triggering the “gotoScene” seems to insert a “black screen” between these scenes.
I don’t know if it’s a bug, but adding a delay before calling the gotoscene seems to do the job
Thanks everybody !
Are you loading that image in your main.lua or some other scene?
Sorry, I was incorrect in my first post ! It doesn’t occures every time I change scene.
First : i’m loading the splash screen in main.lua.
When I go to an other scene, just by using storyboard.gotoScene(“scene”), it works just fine.
But, in some case, I use some “handmade transitions” : I’ve got a round shape which size grows until it covers all the screen, using “transition.to”. Once it reaches its final size, I finally call the gotoScene function. That’s where there’s that “bug” : for a brief moment, the screen goes black and I can see the splash screen.
From what I understood, I should remove my splash screen once main.lua has been loaded. But then, there’s stlil that blackscreen between scenes, using that handmade transition.
I think i’m gonna try to do it in a new simplified project to see if it happens again or if that’s something else.
So, i’ve uploaded a file with two simplified examples of what I’m trying to explain here
http://www.visual-music.org/evans/corona/TransitionsStoryboard.zip
In the zip files, there are two folders composed in the same way : a main.lua file (which calls the splash screen), 01_startscreen.lua, 02_menuscreen.lua.
First folder, “BUG” should show the starscreen. When you tap the start screen, a rectangle grows until it fills the screen, and then call “menuscreen”. As you can see, between the two scenes, you can see the splash screen behind and the blackscreen.
In the second folder, “WORKS”, once you tap the startscreen, it directly calls the “menuscreen”. And you can’t see the splashscreen / blackscreen.
I have absolutely no idea on how to deal with this…
And if you don’t wanna download the file, here is the code of the “buggy” version. (For the working fine version, simply call “moveToScene” in the touch event.
"BUGGY VERSION" :
- main.lua
-- Splash screen splashScreen = display.newImage("Default-568h@2x.png") splashScreen.anchorX = 0; splashScreen.anchorY = 0; -- Storyboard local storyboard = require "storyboard" storyboard.purgeOnSceneChange = true storyboard.gotoScene("01\_startscreen")
01_startscreen
local storyboard = require(“storyboard”) storyboard.purgeOnSceneChange = true local scene = storyboard.newScene() – Forward declaration local gameGroup local _W local _H local background local text local rectangleTransition local touchEvent local moveToScene function scene:createScene(event) gameGroup = self.view _W = display.contentWidth*0.5; _H = display.contentHeight*0.5; – Background used in this scene background = display.newRect(0,0, display.contentWidth, display.contentHeight) background.x = _W; background.y = _H; gameGroup:insert(background) – Text showing the name of the scene text = display.newText( “01 START SCREEN”, 100, 200, native.systemFont, 16 ) text.x = _W; text.y = _H; text:setFillColor(0,0,0) gameGroup:insert(text) – Creation of the rectangle that will be used as a transition – By defalut, it’s invisible and set at the center of the scene rectangleTransition = display.newRect(0,0,1,1) rectangleTransition:setFillColor(0,1,0) rectangleTransition.x = _W; rectangleTransition.y = _H; gameGroup:insert(rectangleTransition) end function scene:enterScene(event) gameGroup = self.view – Touch event when background is tapped – Triggers the transition and then calls “moveToScene()” function touchEvent(event) if event.phase == “began” then rectangleTransition.alpha = 1; transition.to(rectangleTransition, {time=200, xScale=display.contentWidth}) transition.to(rectangleTransition, {time=200, yScale=display.contentHeight, onComplete=moveToScene}) end end function moveToScene() storyboard.gotoScene(“02_menuscreen”) end background:addEventListener(“touch”, touchEvent) end function scene:exitScene(event) gameGroup = self.view local name = storyboard.getCurrentSceneName() local scene = storyboard.getScene(name) local group = scene.view – Purge for i=gameGroup.numChildren, 1, -1 do display.remove(gameGroup[i]) gameGroup[i] = nil end gameGroup = nil end scene:addEventListener(“createScene”, scene) scene:addEventListener(“enterScene”, scene) scene:addEventListener(“exitScene”, scene) return scene
02_menuscreen.lua
local storyboard = require(“storyboard”) storyboard.purgeOnSceneChange = true local scene = storyboard.newScene() – Forward declaration local gameGroup local _W local _H local background local text function scene:createScene(event) gameGroup = self.view _W = display.contentWidth*0.5; _H = display.contentHeight*0.5; background = display.newRect(0,0, display.contentWidth, display.contentHeight) background:setFillColor(0,1,0) background.x = _W; background.y = _H; gameGroup:insert(background) text = display.newText( “02 MENU SCREEN”, 100, 200, native.systemFont, 16 ) text.x = _W; text.y = _H; text:setFillColor(0,0,0) gameGroup:insert(text) end function scene:enterScene(event) gameGroup = self.view end function scene:exitScene(event) gameGroup = self.view local name = storyboard.getCurrentSceneName() local scene = storyboard.getScene(name) local group = scene.view – Purge for i=gameGroup.numChildren, 1, -1 do display.remove(gameGroup[i]) gameGroup[i] = nil end gameGroup = nil end scene:addEventListener(“createScene”, scene) scene:addEventListener(“enterScene”, scene) scene:addEventListener(“exitScene”, scene) return scene
Okay, I’ve finally found something… But i’m not sure why it works :
When the “handmade” transition is done, the moveToScene() callback function should be like that :
function moveToScene() local transitionTimer = timer.performWithDelay(500, function() storyboard.gotoScene("02\_menuscreen"); end) end
Adding a delay prevents from having the black screen between scenes. It works, but I’m not sure why. If you’ve got a better idea than that, I’m listenning
You don’t need to actually reference/load your splash-screen image in any way - in code.
As long as the image name is correct, it will automatically be displayed upon launching the application and remain onscreen until your menu scene (or whatever you have designated as the ‘go-to scene’) has been fully loaded.
Cheers!
-Saer
Default-568h@2x.png should work as a splash screen. No code needed just name the file you want to be your splashscreen that!
Yes, indeed. But that doesn’t fix the initial problem
Like I said, doing a transition on a display object triggering the “gotoScene” seems to insert a “black screen” between these scenes.
I don’t know if it’s a bug, but adding a delay before calling the gotoscene seems to do the job
Thanks everybody !