Hello,
I wrote an app that loads a website in a webview which works fine. After I navigate to a couple pages and then click the back button on my phone it exits the app. I read about trapping the back button to go back to a previous screen in an app but how can I do it with the web control?
Thanks,
Warren
Hi Warren,
If you know how to trap the back button, you can use that approach, and in your event listener call the :back() method on the webView (http://docs.coronalabs.com/api/type/WebView/back.html) to go back one page. You can also use the .canGoBack property to determine if there is a page to go back to in the history, or if not, take some other action.
In general on Android, if you don’t handle the back button, then the app will immediately exit. So it’s a good practice to handle back button presses on every scene. The Key Processing section in this blog post has some good suggestions on how to do that with Storyboard very easily: http://www.coronalabs.com/blog/2013/03/26/androidizing-your-mobile-app/.
Thanks Andrew. I just found another posting on handling this although it was just to prevent from quitting the app. So where it catches the back key event I put webView:back() which works. But if I go two web pages into the site and then click back it goes back to the home page rather than one single page. Ever heard of this. Here is the code I used. Thanks!
local webView local function onKeyEvent( event ) print("onKeyEvent", event.keyName, event.phase ) if event.keyName == "back" then webView:back() return true end return false end webView = native.newWebView( 0, 0, 320, 480 ) webView:request( "http://www.website.com/index.html" ) Runtime:addEventListener( "key", onKeyEventAlso, how do I exit the app if I am using the code above? Do I check with the .canGoBack you mentioned and exit if none? Or any other way from a website to exit?
Hi Warren,
In your listener, you’ll probably want to use event.keyPhase=“up”. Otherwise :back() will be called twice, once when the key is pressed down, and again when the key is lifted (which would explain the behavior you mentioned where the webView went back two steps instead of one).
Yes, I’d suggest you call :back() only if .canGoBack is true. If it’s false, then you can just return false, which allows the key press to propagate to any other touch listeners and, ultimately, let your app exit if no other listener handles it.
Actually I like the idea I just had. lol
Thanks! I’ll change the keyPhase which should fix my problem now. When the .canGoBack is false how can I allow the user to exit the app by code? Meaning if I catch the back button being pressed and .canGoBack is false, how do I continue to let the user exit the app? I would love to show a confirmation box asking if the user does want to exit.
Warren
Hi Warren,
If you catch the back button press and canGoBack is false, you can simply return false, in which case the app should immediately exit. Alternatively, you can show a native alert or some interface asking for confirmation, and if they say yes, use native.requestExit() to force the app to close.
Hi Warren,
If you know how to trap the back button, you can use that approach, and in your event listener call the :back() method on the webView (http://docs.coronalabs.com/api/type/WebView/back.html) to go back one page. You can also use the .canGoBack property to determine if there is a page to go back to in the history, or if not, take some other action.
In general on Android, if you don’t handle the back button, then the app will immediately exit. So it’s a good practice to handle back button presses on every scene. The Key Processing section in this blog post has some good suggestions on how to do that with Storyboard very easily: http://www.coronalabs.com/blog/2013/03/26/androidizing-your-mobile-app/.
Thanks Andrew. I just found another posting on handling this although it was just to prevent from quitting the app. So where it catches the back key event I put webView:back() which works. But if I go two web pages into the site and then click back it goes back to the home page rather than one single page. Ever heard of this. Here is the code I used. Thanks!
local webView local function onKeyEvent( event ) print("onKeyEvent", event.keyName, event.phase ) if event.keyName == "back" then webView:back() return true end return false end webView = native.newWebView( 0, 0, 320, 480 ) webView:request( "http://www.website.com/index.html" ) Runtime:addEventListener( "key", onKeyEventAlso, how do I exit the app if I am using the code above? Do I check with the .canGoBack you mentioned and exit if none? Or any other way from a website to exit?
Hi Warren,
In your listener, you’ll probably want to use event.keyPhase=“up”. Otherwise :back() will be called twice, once when the key is pressed down, and again when the key is lifted (which would explain the behavior you mentioned where the webView went back two steps instead of one).
Yes, I’d suggest you call :back() only if .canGoBack is true. If it’s false, then you can just return false, which allows the key press to propagate to any other touch listeners and, ultimately, let your app exit if no other listener handles it.
Actually I like the idea I just had. lol
Thanks! I’ll change the keyPhase which should fix my problem now. When the .canGoBack is false how can I allow the user to exit the app by code? Meaning if I catch the back button being pressed and .canGoBack is false, how do I continue to let the user exit the app? I would love to show a confirmation box asking if the user does want to exit.
Warren
Hi Warren,
If you catch the back button press and canGoBack is false, you can simply return false, in which case the app should immediately exit. Alternatively, you can show a native alert or some interface asking for confirmation, and if they say yes, use native.requestExit() to force the app to close.