Corona SDK game scenes - events

Question

I looked in many other questions and tutorials, but sadly, without result.
I am trying to go from scene1 to scene2 with event listener and I am copying the code which was given in the project. The only difference between my button and the working one is that I declare mine in the lua file and it does not exist in the scene1.ccscene
Do I have to put an image as an object in scene1.csscene in order to use it as a button?
the code I try:
local composer = require( "composer" )
local scene = composer.newScene()
-- -----------------------------------------------------------------------------------------------------------------
-- All code outside of the listener functions will only be executed ONCE unless "composer.removeScene()" is called.
-- -----------------------------------------------------------------------------------------------------------------
-- local forward references should go here
local start_button = display.newImage("START.png") --start button
-- -------------------------------------------------------------------------------
-- "scene:create()"
function scene:create( event )
local sceneGroup = self.view
-- Initialize the scene here.
-- Example: add display objects to "sceneGroup", add touch listeners, etc.
start_button.x=200
start_button.y=150
end
-- "scene:show()"
function scene:show( event )
local sceneGroup = self.view
local phase = event.phase
if ( phase == "will" ) then
-- Called when the scene is still off screen (but is about to come on screen).
elseif ( phase == "did" ) then
-- Called when the scene is now on screen.
-- Insert code here to make the scene come alive.
-- Example: start timers, begin animation, play audio, etc.
function nextScene:touch ( event )
local phase = event.phase
if "ended" == phase then
composer.gotoScene( "scene2", { effect = "fade", time = 300 } )
end
end
start_button:addEventListener( "touch", nextScene )
end
end
-- "scene:hide()"
function scene:hide( event )
local sceneGroup = self.view
local phase = event.phase
if ( phase == "will" ) then
-- Called when the scene is on screen (but is about to go off screen).
-- Insert code here to "pause" the scene.
-- Example: stop timers, stop animation, stop audio, etc.
elseif ( phase == "did" ) then
-- Called immediately after scene goes off screen.
if nextSceneButton then
start_button:removeEventListener( "touch", nextScene )
end
end
end
-- "scene:destroy()"
function scene:destroy( event )
local sceneGroup = self.view
-- Called prior to the removal of scene's view ("sceneGroup").
-- Insert code here to clean up the scene.
-- Example: remove display objects, save state, etc.
end
-- -------------------------------------------------------------------------------
-- Listener setup
scene:addEventListener( "create", scene )
scene:addEventListener( "show", scene )
scene:addEventListener( "hide", scene )
scene:addEventListener( "destroy", scene )
-- -------------------------------------------------------------------------------
return scene

Answer 1

The extension of the scene files needs to be ".lua" in Corona. I think "csscene" has something to do with Cocoa.
The code below will work.
Notes:
Make sure that the files ends with .lua (main.lua, scene1.lua, scene2.lua).
start_button is now a rectangle but you can easy change it to an image.
start_button is added into sceneGroup. This is the group that the scene will use i.e. when you change the scene all objects in the sceneGroup will be handled properly.
I add the eventListener in a different way, please read the documentation for more information: https://docs.coronalabs.com/api/event/touch/index.html
main.lua:
local composer = require( "composer" )
composer.gotoScene("scene1")
scene1.lua:
local composer = require( "composer" )
local scene = composer.newScene()
-- VARIABLES
local start_button
-- EVENTS
local function onTouchStartButton( event )
if event.phase == "ended" then
composer.gotoScene( "scene2" )
end
end
function scene:create( event )
local sceneGroup = self.view
-- Create the start_button
start_button = display.newRect( 100, 100, 100, 100 )
-- Make sure you insert the button into the sceneGroup
sceneGroup:insert( start_button )
-- Set position of start_button
start_button.x=200
start_button.y=150
-- Add the event listener in the "create" stage instead of the show state
-- Now the start_button is in the scene_group so there is no need to remove
-- the touch listener under the "destroy" stag
start_button:addEventListener( "touch", onTouchStartButton )
end
-- "scene:show()"
function scene:show( event )
local sceneGroup = self.view
local phase = event.phase
if ( phase == "will" ) then
-- Called when the scene is still off screen (but is about to come on screen).
elseif ( phase == "did" ) then
-- Called when the scene is now on screen.
-- Insert code here to make the scene come alive.
-- Example: start timers, begin animation, play audio, etc.
end
end
-- "scene:hide()"
function scene:hide( event )
local sceneGroup = self.view
local phase = event.phase
if ( phase == "will" ) then
-- Called when the scene is on screen (but is about to go off screen).
-- Insert code here to "pause" the scene.
-- Example: stop timers, stop animation, stop audio, etc.
elseif ( phase == "did" ) then
end
end
-- "scene:destroy()"
function scene:destroy( event )
local sceneGroup = self.view
-- Called prior to the removal of scene's view ("sceneGroup").
-- Insert code here to clean up the scene.
-- Example: remove display objects, save state, etc.
end
-- -------------------------------------------------------------------------------
-- Listener setup
scene:addEventListener( "create", scene )
scene:addEventListener( "show", scene )
scene:addEventListener( "hide", scene )
scene:addEventListener( "destroy", scene )
-- -------------------------------------------------------------------------------
return scene
scene2.lua:
local composer = require( "composer" )
local scene = composer.newScene()
-- -----------------------------------------------------------------------------------------------------------------
-- All code outside of the listener functions will only be executed ONCE unless "composer.removeScene()" is called.
-- -----------------------------------------------------------------------------------------------------------------
-- local forward references should go here
-- -------------------------------------------------------------------------------
-- "scene:create()"
function scene:create( event )
local sceneGroup = self.view
-- Initialize the scene here.
-- Example: add display objects to "sceneGroup", add touch listeners, etc.
end
-- "scene:show()"
function scene:show( event )
local sceneGroup = self.view
local phase = event.phase
if ( phase == "will" ) then
-- Called when the scene is still off screen (but is about to come on screen).
print("Now we are in scene2.lua!")
elseif ( phase == "did" ) then
-- Called when the scene is now on screen.
-- Insert code here to make the scene come alive.
-- Example: start timers, begin animation, play audio, etc.
end
end
-- "scene:hide()"
function scene:hide( event )
local sceneGroup = self.view
local phase = event.phase
if ( phase == "will" ) then
-- Called when the scene is on screen (but is about to go off screen).
-- Insert code here to "pause" the scene.
-- Example: stop timers, stop animation, stop audio, etc.
elseif ( phase == "did" ) then
-- Called immediately after scene goes off screen.
end
end
-- "scene:destroy()"
function scene:destroy( event )
local sceneGroup = self.view
-- Called prior to the removal of scene's view ("sceneGroup").
-- Insert code here to clean up the scene.
-- Example: remove display objects, save state, etc.
end
-- -------------------------------------------------------------------------------
-- Listener setup
scene:addEventListener( "create", scene )
scene:addEventListener( "show", scene )
scene:addEventListener( "hide", scene )
scene:addEventListener( "destroy", scene )
-- -------------------------------------------------------------------------------
return scene