web-dev-qa-db-fra.com

PhoneGap - Exit Android sur le bouton de retour

J'essaie de programmer un lecteur RSS avec jquery mobile et cordova. Mon lecteur RSS est composé de 3 pages (dans le même document HTML: page1, page2, page3). J'essaie de remplacer le comportement du bouton de commande (matériel) afin qu'il quitte le programme. Pour vérifier que je ne fais pas d'erreur dans la configuration du projet, j'ai utilisé l'exemple de projet PhoneGap et l'ai chargé dans Eclipse. Chaque fonction exemple fonctionnant, j'ai donc déplacé mes répertoires index.html et res dans l'exemple phonegap. Dans mon index.html, j'importe les scripts suivants:

<script src="res/jquery-1.7.1.min.js"></script>
<script src="res/jquery.mobile-1.1.1.min.js"></script>
<script type="text/javascript" charset="utf-8" src="cordova-2.0.0.js"></script>
<script type="text/javascript" charset="utf-8" src="main.js"></script>

et mon fichier main.js ressemble à ceci:

document.addEventListener("backbutton", function(e){
if($.mobile.activePage.is('#homepage')){
    e.preventDefault();
    navigator.app.exitApp();
}
else {
    navigator.app.backHistory()
}
}, false);

Vous pouvez vérifier la version de mes scripts dans le premier exemple de code. Avez-vous des idées sur la manière de faire fonctionner le code pour qu'il quitte simplement l'application lorsque j'appuie sur le bouton Précédent de mon Xperia Arc? Je peux télécharger mon code complet si nécessaire.

EDIT: J'ai testé la fonction bip de phonegap (cordova) sur mon téléphone Android et cela fonctionne donc si le script n'a pas été implémenté correctement Il doit y avoir quelque chose dans le fichier main.js. Peut-être un problème de compatibilité avec les fonctions des boutons de retour jquerymobile et la fonction des boutons de retour d’écart téléphonique.

cordovaback-button
39
horin

Vous devez attendre que le périphérique soit prêt à ajouter l'écouteur d'événements:

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

function onDeviceReady(){
    document.addEventListener("backbutton", function(e){
       if($.mobile.activePage.is('#homepage')){
           e.preventDefault();
           navigator.app.exitApp();
       }
       else {
           navigator.app.backHistory();
       }
    }, false);
}
82
mornaner

Si vous ne souhaitez utiliser aucune bibliothèque, vous pouvez utiliser window.location.hash pour obtenir le "panneau" sur lequel votre application se trouve . Exemple:

function onDeviceReady(){
    document.addEventListener("backbutton", function(e){
        if(window.location.hash=='#home'){
            e.preventDefault();
            navigator.app.exitApp();
        } else {
            navigator.app.backHistory()
        }
    }, false);
}
document.addEventListener("deviceready", onDeviceReady, false);
12
EtienneWan

Si vous ne souhaitez pas utiliser Jquery Mobile, remplacez $ .mobile.activePage.is ('# homepage') par document.getElementById ('# homepage') sur @mornaner answer, comme dans le code suivant:

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

function onDeviceReady(){
    document.addEventListener("backbutton", function(e){
       if(document.getElementById('#homepage')){
           e.preventDefault();
           navigator.app.exitApp();
       }
       else {
           navigator.app.backHistory()
       }
    }, false);
}

De cette manière, vous n'avez pas besoin de télécharger le charabia Jquery Mobile uniquement à cette fin. En outre, activePage est obsolète à partir de JQuery mobile 1.4.0 et sera supprimé de 1.5.0. ( Utilisez la méthode getActivePage () du widget pagecontainer à la place )

6
shabang
function onLoad() {
        document.addEventListener("deviceready", onDeviceReady, false);
    }

    //enter code here enter code heredevice APIs are available
    //enter code here
    function onDeviceReady() {
        // Register the event listener
        document.addEventListener("backbutton", onBackKeyDown, false);
    }

    // Handle the back button
    //
    function onBackKeyDown() {
    }
0
dev

Pour désactiver le comportement par défaut du bouton Précédent sur les appareils Android, il vous suffit d'enregistrer un gestionnaire d'événements pour le bouton Précédent. Cela empêcherait le bouton Précédent de fermer l'application.

Le code ci-dessous est spécifiquement destiné à Framework7

$(document).on('page:beforeinit', function (e) {
if( $.fn.hyellaIMenu.mainView.history && $.fn.hyellaIMenu.mainView.history.length > 1 ){
    document.addEventListener( "backbutton", disableBackButton, false );
}
});

function disableBackButton( e ){
    if( $.fn.hyellaIMenu.mainView.history && $.fn.hyellaIMenu.mainView.history.length < 3 ){
        document.removeEventListener("backbutton", disableBackButton );
    }

if( $.fn.hyellaIMenu.mainView.history && $.fn.hyellaIMenu.mainView.history.length > 1 ){
    $.fn.hyellaIMenu.mainView.router.back();
}
};

Pour remplacer le comportement du bouton Précédent par défaut, enregistrez un écouteur d'événement pour l'événement Bouton Précédent. 

REMARQUE: il n'est plus nécessaire d'appeler une autre méthode pour remplacer le comportement du bouton Précédent.

https://cordova.Apache.org/docs/fr/latest/cordova/events/events.html#backbutton

0
Patrick Ogbuitepu