Composer effects not working

Solar2D Composer
#1

I just have two simple files. Menu and Pause.
In the menu I have:

local composer = require("composer")
local scene = composer.newScene()

local text = display.newText("Main Menu", 40, 40, native.systemFont, 15 )
text:setFillColor(1,1,1)

local options = {
    effect = "slideRight",
    time = 800,
}
composer.gotoScene( "pause", options )

return scene

in the pause I have:

local composer = require("composer")
local scene = composer.newScene()

local rect = display.newRect(40, 40, 200, 200)
--blue
rect:setFillColor(0,0,1)

return scene

All I want is just to go from the menu to pause with the composer transition like “slideRight”. But in my example, it just opens the pause scene right away without transitions at all. What I’m doing wrong?
Thanks.

#2

Are you adding your display objects to the scene via sceneGroup:insert()?

1 Like
#3

@sentryarchlabs is right, please check the documentation for more info:

There you will see that scenes follow a specific structure, follow it and you will get a smooth slideRight transition.

#4

I really appreciate your answer, but I am still confused.

First, let’s follow that documentation link to create an empty project, and create such a simple scene file.
In the scene:create I added print(1). It doesn’t work at all. How is it possible? Something is wrong, but I’m just following the documentation example, and since we have scene:addEventListener it should work. But it doesn’t.

local composer = require( "composer" )
 
local scene = composer.newScene()
 
 
-- -----------------------------------------------------------------------------------
-- Scene event functions
-- -----------------------------------------------------------------------------------
 
-- create()
function scene:create( event )
    
    local sceneGroup = self.view
    print(1)
    -- Code here runs when the scene is first created but has not yet appeared on screen
 
end
 
 
-- show()
function scene:show( event )
 
    local sceneGroup = self.view
    local phase = event.phase
 
    if ( phase == "will" ) then
        -- Code here runs when the scene is still off screen (but is about to come on screen)
 
    elseif ( phase == "did" ) then
        -- Code here runs when the scene is entirely on screen
 
    end
end
 
 
-- hide()
function scene:hide( event )
 
    local sceneGroup = self.view
    local phase = event.phase
 
    if ( phase == "will" ) then
        -- Code here runs when the scene is on screen (but is about to go off screen)
 
    elseif ( phase == "did" ) then
        -- Code here runs immediately after the scene goes entirely off screen
 
    end
end
 
 
-- destroy()
function scene:destroy( event )
 
    local sceneGroup = self.view
    -- Code here runs prior to the removal of scene's view
 
end
 
 
-- -----------------------------------------------------------------------------------
-- Scene event function listeners
-- -----------------------------------------------------------------------------------
scene:addEventListener( "create", scene )
scene:addEventListener( "show", scene )
scene:addEventListener( "hide", scene )
scene:addEventListener( "destroy", scene )
-- -----------------------------------------------------------------------------------
 
return scene
#5

I’m not sure why that doesn’t work, what Solar 2d build are you using?

However, if you add your display objects from your original post to the scene group in the scene:create() event, your transitions should work as expected.

#6

Actually, in your code example above, are you loading that scene using composer.gotoScene() from main.lua?

Because the scene events won’t fire unless composer.gotoScene() is called, I think. Simply putting the template code for scenes in main.lua won’t work.

1 Like
#7

Maybe just maybe, you are assuming that print(1) will show the number 1 on the screen? The function print prints stuff in the console.
You can use display.newText:

local options = 
{
    parent = sceneGroup,
    text = "1",     
    x = 100,
    y = 200,
    width = 128,
    font = native.systemFont,   
    fontSize = 18,
    align = "right"  -- Alignment parameter
}
display.newText(options)

If not I apologise :grin: