android back button with sencha touch v2

Question

I am new to developing a sencha touch application. I am converting this application for android. I am trying to use the back button of the android device in my app, but I could not get the proper result. Below are the relevant parts of the app.js file.

launch:function(){
    Ext.fly('appLoadingIndicator').destroy();
    Ext.Viewport.add(Ext.create('Myapp.view.Main'));
    document.addEventListener("backbutton", function(e) {  
        e.preventDefault();  
        alert('the back key is pressed');  
    }, false);  
},

The above code is just for checking if the callback for pressing the back button of the android device is called or not. But unfortunately I can't see the alert message.
Is there any kind of improvement I can apply to the above code?

score 0 · Answer 1 · answered Jan 24 '14 at 14:46

0

You must use phonegap with sencha after that you can listen back button. Look this site http://docs.phonegap.com/en/3.3.0/cordova_events_events.md.html#backbutton

answered Jan 24 '14 at 14:46

LostMan

1
1

i have already reading this page and previously trying that code, but it could not work for me. – Nayan Dabhi Jan 25 '14 at 05:18
i have read from the following page [stackoverflow](http://stackoverflow.com/questions/11790860/how-to-handle-device-back-button-on-sencha-touch-application). – Nayan Dabhi Jan 25 '14 at 05:20
use must insert phonegap script into the index.html file. First load this after that listen the deviceready event. Listen for onload event of the index.html file and write this code inside it document.addEventListener("deviceready", onDeviceReady, false); After that write a method function onDeviceReady(){ document.addEventListener("backbutton", function(e) { e.preventDefault(); alert('the back key is pressed'); }, false)} Because you must first initialize the phonegap script. When the script loaded succesfully it fires deviceready event. After this event you can listen back button – LostMan Feb 05 '14 at 07:24

Andrea Casaccia · Answer 2 · 2014-01-27T08:09:27.800

0

I don't understand the purpose of using Ext.bind to accomplish that. Change your code to:

launch:function(){
    Ext.fly('appLoadingIndicator').destroy();
    Ext.Viewport.add(Ext.create('Myapp.view.Main'));
    document.addEventListener("backbutton", Myapp.app.backKeyDown, false);
    alert("after eventlistener");
},

backKeyDown: function(e){  
    e.preventDefault();
    alert('the back key is pressed');
},

and it should work.

[EDIT]:

Since you are saying it's still not working, my guess is that you could have scope problems with your callback:

Try:

document.addEventListener("backbutton", function(e) {
    e.preventDefault();
    alert('the back key is pressed');
}, false);

edited Jan 27 '14 at 08:09

answered Jan 26 '14 at 23:03

Andrea Casaccia

4,802
4
29
54

i am read from this page [android back button working](http://stackoverflow.com/questions/11790860/how-to-handle-device-back-button-on-sencha-touch-application). Then i implementing these code in my application. – Nayan Dabhi Jan 27 '14 at 06:17
I am also trying your suggetion code in my app.js file, but unfortunately this solution could not work for me. only see the alert('after eventlistener') message. – Nayan Dabhi Jan 27 '14 at 06:20
@Nayan_Dabhi No permissions required. If that is not working try to call your callback statically like: `Myapp.app.backKeyDown` or put a function there directly `function(){ e.preventDefault(); alert('the back key is pressed'); }`. See my edit to the post. – Andrea Casaccia Jan 27 '14 at 08:01
@Aubis Not getting an alert message. I have no idea to where is my mistake or any kind of faults. – Nayan Dabhi Jan 28 '14 at 06:28
Are you looking at the console? Are there any errors? Where are you testing this? – Andrea Casaccia Jan 28 '14 at 08:46
i am converting the sencha touch application into apk file using phonegap, Then check on directly on device. – Nayan Dabhi Jan 28 '14 at 10:06
if you have any link or example for these then please give for reference. – Nayan Dabhi Jan 30 '14 at 10:08

score 0 · Answer 3 · answered Mar 24 '14 at 12:16

You can implement back button functionality of android using cordova. In your index.html write the following code:

 <script type="text/javascript" charset="utf-8">


    document.addEventListener("deviceready", onDeviceReady, false);

    function onDeviceReady() {
        alert("In device");
        document.addEventListener("backbutton", onBackKeyDown, false);
    }
 function onBackKeyDown() {
        alert("hello");
    }

    </script>

android back button with sencha touch v2

3 Answers3