Android hardware back button

Hello!

Can anyone tell me if is it possible to use the android hardware back button on a
Storyboard based application???

Thanks [import]uid: 185094 topic_id: 33583 reply_id: 333583[/import]

Hi bvagdas!

Not sure what you mean by using “back” button with storyboard but I think key events have nothing to do with what you use them with. Of course you need to add an event listener and remove it when changing scene. So basically you could do something like:

[code]

function scene:createScene( event )
local group = self.view

– Key listener
function onKeyEvent( event )

local phase = event.phase
local keyName = event.keyName

if phase == “up” and keyName == “back” then
storyboard.gotoScene( “yourScene”, “slideLeft”, 400 )
– we handled the event, so return true.
return true
end

– for default behavior, return false.
return false
end
end

function scene:enterScene( event )
local group = self.view

Runtime:addEventListener( “key”, onKeyEvent )
end

function scene:exitScene( event )
local group = self.view

Runtime:removeEventListener( “key”, onKeyEvent )
end

[/code] [import]uid: 55867 topic_id: 33583 reply_id: 133514[/import]

hello hytka81 !!

With “back button” i mean that key which all androids have for going back!! Is the bottom first key with an arrow us its image.

i want to use that key for going back on my storyboard based application.

I will try to add your code to my application and then i’ll let you know what happend!

anyway thanks for your help!! [import]uid: 185094 topic_id: 33583 reply_id: 133640[/import]

it doesn’t work… :frowning: when i press the back key the program ends, it doesn’t change scene for some reason… i can’t understand how to make that working… [import]uid: 185094 topic_id: 33583 reply_id: 133643[/import]

Hi again!

Can you please share your code here so that it’s easier to help with the problem?

If you add an event listener for key events and handle them like in my code example the application should not exit when you press “Back” button.

Br,

Kalle [import]uid: 55867 topic_id: 33583 reply_id: 133656[/import]

this is the “hotel” scene’s code … i want pressing the back key to go back on my “menu” scene…

[lua]----------------------------------------------------------------------------------

– scenetemplate.lua


local slideView = require(“slideView”)
local storyboard = require( “storyboard” )
local widget = require “widget”
local scene = storyboard.newScene()



– NOTE:

– Code outside of listener functions (below) will only be executed once,
– unless storyboard.removeScene() is called.



– BEGINNING OF YOUR IMPLEMENTATION

– Called when the scene’s view does not exist:
function scene:createScene( event )
local group = self.view

function onKeyEvent( event )

local phase = event.phase
local keyName = event.keyName

if phase == “up” and keyName == “back” then
storyboard.gotoScene(“menu”)
– we handled the event, so return true.
return true
end

– for default behavior, return false.
return false
end

bg = display.newImageRect(“bg.png”,320,480)
bg.x = display.contentWidth/2
bg.y = display.contentHeight/2

Group1 = display.newGroup();

local nav = display.newImageRect(“navbar.png”,320,50)
nav:setReferencePoint(display.TopLeftReferencePoint)
nav.x=0
nav.y=0

Group1:insert(nav);

local home = display.newImageRect(“home.png”,35,35)
home:setReferencePoint(display.CenterReferencePoint)
home.x=25
home.y=nav.height/2
function home:touch(e)
if (e.phase==“began”) then
display.getCurrentStage():setFocus(e.target,e.id);
elseif(e.phase==“moved”) then
print(“moved”);
elseif(e.phase==“ended”) then
display.getCurrentStage():setFocus(e.target,nil);
storyboard.gotoScene(“menu”);
end

end
home:addEventListener( “touch”, home )
Group1:insert(home);
group:insert(bg);
group:insert(Group1);

local scrollView = widget.newScrollView{
top = 50,
width = 320,
height = 430,
scrollWidth = 320,
scrollHeight = 670,
hideBackground=true,
maskFile=“mask1.png”

}
scrollView.content.verticalScrollDisabled = false
scrollView.content.horizontalScrollDisabled= true
scrollView.isHitTestMasked = true;

local myImages = {
“images/hotel/HOTEL1.JPG”,
“images/hotel/HOTEL2.JPG”,
“images/hotel/HOTEL3.JPG”,
“images/hotel/HOTEL4.JPG”
}

scrollView:insert( slideView.new( myImages, “transp_bg.png”, 0, 200 ) )
local text1="?? ???"
local text1obj= display.newText( text1, 0, 0, 280, 0, “Helvetica”, 20)
text1obj:setTextColor( 0 )
text1obj:setReferencePoint( display.TopCenterReferencePoint )
text1obj.y=215
text1obj.x=display.contentWidth/2
scrollView:insert( text1obj )

local text2=“500 ??? ??? ?? ??? ??? ??? ??? ?? ??? ??? ???, ??? ??? ??? ?? ??? ??? ??? ??? ?? ??? ??? ???.”
local text2obj= display.newText( text2, 0, 0, 280, 0, “Helvetica”, 15)
text2obj:setTextColor( 0 )
text2obj:setReferencePoint( display.TopCenterReferencePoint )
text2obj.y=245
text2obj.x=display.contentWidth/2
scrollView:insert( text2obj )

local text3="?? ??? ??? ??? ??? ??? ?? ??? ??? ??? ?? ??? ??? ???. ??? ??? ??? ?? ??? ??? ??? ??? B.B.Q., ??? ??? ??? ??? ??? ??? ??? ?? ??? ??? ???."
local text3obj= display.newText( text3, 0, 0, 280, 0, “Helvetica”, 15)
text3obj:setTextColor( 0 )
text3obj:setReferencePoint( display.TopCenterReferencePoint )
text3obj.y=362
text3obj.x=display.contentWidth/2
scrollView:insert( text3obj )

local text4="?? ??? ??? ??? ?? ??? ?? ??? ??? ?? buffet ??? ??? ??? ???. ??? ??? ??? ??? ?? ??? ??? ??? ??? ??? ??? ???."
local text4obj= display.newText( text4, 0, 0, 280, 0, “Helvetica”, 15)
text4obj:setTextColor( 0 )
text4obj:setReferencePoint( display.TopCenterReferencePoint )
text4obj.y=512
text4obj.x=display.contentWidth/2
scrollView:insert( text4obj )

group:insert(scrollView)

– CREATE display objects and add them to ‘group’ here.
– Example use-case: Restore ‘group’ from previously saved state.


end
– Called immediately after scene has moved onscreen:
function scene:enterScene( event )
local group = self.view
Runtime:addEventListener( “key”, onKeyEvent )

– INSERT code here (e.g. start timers, load audio, start listeners, etc.)


end
– Called when scene is about to move offscreen:
function scene:exitScene( event )
local group = self.view
Runtime:removeEventListener( “key”, onKeyEvent )
storyboard.removeScene( “hotel” )

– INSERT code here (e.g. stop timers, remove listeners, unload sounds, etc.)


end
– Called prior to the removal of scene’s “view” (display group)
function scene:destroyScene( event )
local group = self.view


– INSERT code here (e.g. remove listeners, widgets, save state, etc.)


end

– END OF YOUR IMPLEMENTATION

– “createScene” event is dispatched if scene’s view does not exist
scene:addEventListener( “createScene”, scene )

– “enterScene” event is dispatched whenever scene transition has finished
scene:addEventListener( “enterScene”, scene )

– “exitScene” event is dispatched before next scene’s transition begins
scene:addEventListener( “exitScene”, scene )

– “destroyScene” event is dispatched before view is unloaded, which can be
– automatically unloaded in low memory situations, or explicitly via a call to
– storyboard.purgeScene() or storyboard.removeScene().
scene:addEventListener( “destroyScene”, scene )


return scene [import]uid: 185094 topic_id: 33583 reply_id: 133661[/import]

Hmm, Sorry but I can’t seem to find anything wrong with that “back” button handling. I’m using same kind of code in my own project and it is working nicely. You are adding an event listener and you have listener function created so… unless there’s a typo somewhere I’m out of ideas :frowning:

Maybe someone more experienced could tell what might be the problem.

Br,

Kalle [import]uid: 55867 topic_id: 33583 reply_id: 133693[/import]

Not sure if it is the issue, but my code is slightly different:

 if( (keyName == "back") and (phase == "down") ) then   
 -- blah blah handler...  
 end  

In my case, the apps back button code is executed on the down press of the back button, and my app behaves well.

In your case, it is not handled on the down/initial event for the back press, and your code returns false when the down event occurs. (which tells the device to handle the back button, and the device closes the app… and your app never gets the up event)

Been a while since I wrote my back code, but I’d guess that’s what is happening. [import]uid: 79933 topic_id: 33583 reply_id: 133695[/import]

Hi!

For some reason my app works fine with “up” phase but I do also return false at the end of the event listener function so I wonder why my implementation works. O_o

@bvagdas: You could change

 -- for default behavior, return false.  
 return false   

To

 return true   

That way the default behaviour should not occur and you must handle key events yourself. Or you can change the event phase to “down” as mpappas said. [import]uid: 55867 topic_id: 33583 reply_id: 133702[/import]

Hi bvagdas!

Not sure what you mean by using “back” button with storyboard but I think key events have nothing to do with what you use them with. Of course you need to add an event listener and remove it when changing scene. So basically you could do something like:

[code]

function scene:createScene( event )
local group = self.view

– Key listener
function onKeyEvent( event )

local phase = event.phase
local keyName = event.keyName

if phase == “up” and keyName == “back” then
storyboard.gotoScene( “yourScene”, “slideLeft”, 400 )
– we handled the event, so return true.
return true
end

– for default behavior, return false.
return false
end
end

function scene:enterScene( event )
local group = self.view

Runtime:addEventListener( “key”, onKeyEvent )
end

function scene:exitScene( event )
local group = self.view

Runtime:removeEventListener( “key”, onKeyEvent )
end

[/code] [import]uid: 55867 topic_id: 33583 reply_id: 133514[/import]

nothing works to me… it keeps exiting… :frowning: i cant understand why… maybe is the devices or androids fault… i am testing the app on two devices … 1) samsung galaxy tab 2 android 4.0.3
2) sony xperia sole android 4.0.4

last time i used this code
[lua] function onKeyEvent( event )

local phase = event.phase
local keyName = event.keyName

if( (keyName == “back”) and (phase == “down”) ) then
storyboard.gotoScene(“menu”)
– we handled the event, so return true.
return true
end

– for default behavior, return false.
return false
end [import]uid: 185094 topic_id: 33583 reply_id: 133815[/import]

after some testing i figured out that the problem is this line->> storyboard.gotoScene(“menu”)

i changed that line with this ->> local drive_me= display.newImageRect(“drive_me.png”,60,40)

the listener worked well then… Something is going wrong with storyboard… [import]uid: 185094 topic_id: 33583 reply_id: 133819[/import]

hello hytka81 !!

With “back button” i mean that key which all androids have for going back!! Is the bottom first key with an arrow us its image.

i want to use that key for going back on my storyboard based application.

I will try to add your code to my application and then i’ll let you know what happend!

anyway thanks for your help!! [import]uid: 185094 topic_id: 33583 reply_id: 133640[/import]

it doesn’t work… :frowning: when i press the back key the program ends, it doesn’t change scene for some reason… i can’t understand how to make that working… [import]uid: 185094 topic_id: 33583 reply_id: 133643[/import]

Hi again!

Can you please share your code here so that it’s easier to help with the problem?

If you add an event listener for key events and handle them like in my code example the application should not exit when you press “Back” button.

Br,

Kalle [import]uid: 55867 topic_id: 33583 reply_id: 133656[/import]

this is the “hotel” scene’s code … i want pressing the back key to go back on my “menu” scene…

[lua]----------------------------------------------------------------------------------

– scenetemplate.lua


local slideView = require(“slideView”)
local storyboard = require( “storyboard” )
local widget = require “widget”
local scene = storyboard.newScene()



– NOTE:

– Code outside of listener functions (below) will only be executed once,
– unless storyboard.removeScene() is called.



– BEGINNING OF YOUR IMPLEMENTATION

– Called when the scene’s view does not exist:
function scene:createScene( event )
local group = self.view

function onKeyEvent( event )

local phase = event.phase
local keyName = event.keyName

if phase == “up” and keyName == “back” then
storyboard.gotoScene(“menu”)
– we handled the event, so return true.
return true
end

– for default behavior, return false.
return false
end

bg = display.newImageRect(“bg.png”,320,480)
bg.x = display.contentWidth/2
bg.y = display.contentHeight/2

Group1 = display.newGroup();

local nav = display.newImageRect(“navbar.png”,320,50)
nav:setReferencePoint(display.TopLeftReferencePoint)
nav.x=0
nav.y=0

Group1:insert(nav);

local home = display.newImageRect(“home.png”,35,35)
home:setReferencePoint(display.CenterReferencePoint)
home.x=25
home.y=nav.height/2
function home:touch(e)
if (e.phase==“began”) then
display.getCurrentStage():setFocus(e.target,e.id);
elseif(e.phase==“moved”) then
print(“moved”);
elseif(e.phase==“ended”) then
display.getCurrentStage():setFocus(e.target,nil);
storyboard.gotoScene(“menu”);
end

end
home:addEventListener( “touch”, home )
Group1:insert(home);
group:insert(bg);
group:insert(Group1);

local scrollView = widget.newScrollView{
top = 50,
width = 320,
height = 430,
scrollWidth = 320,
scrollHeight = 670,
hideBackground=true,
maskFile=“mask1.png”

}
scrollView.content.verticalScrollDisabled = false
scrollView.content.horizontalScrollDisabled= true
scrollView.isHitTestMasked = true;

local myImages = {
“images/hotel/HOTEL1.JPG”,
“images/hotel/HOTEL2.JPG”,
“images/hotel/HOTEL3.JPG”,
“images/hotel/HOTEL4.JPG”
}

scrollView:insert( slideView.new( myImages, “transp_bg.png”, 0, 200 ) )
local text1="?? ???"
local text1obj= display.newText( text1, 0, 0, 280, 0, “Helvetica”, 20)
text1obj:setTextColor( 0 )
text1obj:setReferencePoint( display.TopCenterReferencePoint )
text1obj.y=215
text1obj.x=display.contentWidth/2
scrollView:insert( text1obj )

local text2=“500 ??? ??? ?? ??? ??? ??? ??? ?? ??? ??? ???, ??? ??? ??? ?? ??? ??? ??? ??? ?? ??? ??? ???.”
local text2obj= display.newText( text2, 0, 0, 280, 0, “Helvetica”, 15)
text2obj:setTextColor( 0 )
text2obj:setReferencePoint( display.TopCenterReferencePoint )
text2obj.y=245
text2obj.x=display.contentWidth/2
scrollView:insert( text2obj )

local text3="?? ??? ??? ??? ??? ??? ?? ??? ??? ??? ?? ??? ??? ???. ??? ??? ??? ?? ??? ??? ??? ??? B.B.Q., ??? ??? ??? ??? ??? ??? ??? ?? ??? ??? ???."
local text3obj= display.newText( text3, 0, 0, 280, 0, “Helvetica”, 15)
text3obj:setTextColor( 0 )
text3obj:setReferencePoint( display.TopCenterReferencePoint )
text3obj.y=362
text3obj.x=display.contentWidth/2
scrollView:insert( text3obj )

local text4="?? ??? ??? ??? ?? ??? ?? ??? ??? ?? buffet ??? ??? ??? ???. ??? ??? ??? ??? ?? ??? ??? ??? ??? ??? ??? ???."
local text4obj= display.newText( text4, 0, 0, 280, 0, “Helvetica”, 15)
text4obj:setTextColor( 0 )
text4obj:setReferencePoint( display.TopCenterReferencePoint )
text4obj.y=512
text4obj.x=display.contentWidth/2
scrollView:insert( text4obj )

group:insert(scrollView)

– CREATE display objects and add them to ‘group’ here.
– Example use-case: Restore ‘group’ from previously saved state.


end
– Called immediately after scene has moved onscreen:
function scene:enterScene( event )
local group = self.view
Runtime:addEventListener( “key”, onKeyEvent )

– INSERT code here (e.g. start timers, load audio, start listeners, etc.)


end
– Called when scene is about to move offscreen:
function scene:exitScene( event )
local group = self.view
Runtime:removeEventListener( “key”, onKeyEvent )
storyboard.removeScene( “hotel” )

– INSERT code here (e.g. stop timers, remove listeners, unload sounds, etc.)


end
– Called prior to the removal of scene’s “view” (display group)
function scene:destroyScene( event )
local group = self.view


– INSERT code here (e.g. remove listeners, widgets, save state, etc.)


end

– END OF YOUR IMPLEMENTATION

– “createScene” event is dispatched if scene’s view does not exist
scene:addEventListener( “createScene”, scene )

– “enterScene” event is dispatched whenever scene transition has finished
scene:addEventListener( “enterScene”, scene )

– “exitScene” event is dispatched before next scene’s transition begins
scene:addEventListener( “exitScene”, scene )

– “destroyScene” event is dispatched before view is unloaded, which can be
– automatically unloaded in low memory situations, or explicitly via a call to
– storyboard.purgeScene() or storyboard.removeScene().
scene:addEventListener( “destroyScene”, scene )


return scene [import]uid: 185094 topic_id: 33583 reply_id: 133661[/import]

Hmm, Sorry but I can’t seem to find anything wrong with that “back” button handling. I’m using same kind of code in my own project and it is working nicely. You are adding an event listener and you have listener function created so… unless there’s a typo somewhere I’m out of ideas :frowning:

Maybe someone more experienced could tell what might be the problem.

Br,

Kalle [import]uid: 55867 topic_id: 33583 reply_id: 133693[/import]

Not sure if it is the issue, but my code is slightly different:

 if( (keyName == "back") and (phase == "down") ) then   
 -- blah blah handler...  
 end  

In my case, the apps back button code is executed on the down press of the back button, and my app behaves well.

In your case, it is not handled on the down/initial event for the back press, and your code returns false when the down event occurs. (which tells the device to handle the back button, and the device closes the app… and your app never gets the up event)

Been a while since I wrote my back code, but I’d guess that’s what is happening. [import]uid: 79933 topic_id: 33583 reply_id: 133695[/import]

Hi!

For some reason my app works fine with “up” phase but I do also return false at the end of the event listener function so I wonder why my implementation works. O_o

@bvagdas: You could change

 -- for default behavior, return false.  
 return false   

To

 return true   

That way the default behaviour should not occur and you must handle key events yourself. Or you can change the event phase to “down” as mpappas said. [import]uid: 55867 topic_id: 33583 reply_id: 133702[/import]

nothing works to me… it keeps exiting… :frowning: i cant understand why… maybe is the devices or androids fault… i am testing the app on two devices … 1) samsung galaxy tab 2 android 4.0.3
2) sony xperia sole android 4.0.4

last time i used this code
[lua] function onKeyEvent( event )

local phase = event.phase
local keyName = event.keyName

if( (keyName == “back”) and (phase == “down”) ) then
storyboard.gotoScene(“menu”)
– we handled the event, so return true.
return true
end

– for default behavior, return false.
return false
end [import]uid: 185094 topic_id: 33583 reply_id: 133815[/import]