Sencha touch でナビゲーション ビューを使用すると、戻るボタンを取得できます。これで結構です。
しかし、ユーザーがデバイスの戻るボタンを押したらどうなるでしょうか? アプリケーションを直接終了します。私の要件では、前の画面に戻る必要があるアプリケーションを終了しないでください。これを行うにはどうすればよいですか?
2 に答える
これを行おうとするときに役立つ履歴サポート ページの手順が見つかりませんでした。とにかく、いつでも大量のビューをスタックできるナビゲーションビューを扱うときに、ルートを使用することがわかりませんでした。
戻るボタンだけを機能させたい場合は、popstate
およびpushstate
関数を使用できます (リファレンスについては、 https://developer.mozilla.org/en-US/docs/DOM/Manipulating_the_browser_historyを参照してください)。アイデアはpush
、ビューを追加すると状態になり、ビューをpop
削除するとオフになるということです。Android フォンの物理的な戻るボタン、またはデスクトップ ブラウザーの戻るボタンは、実質的に を呼び出しhistory.back()
ます。したがって、タイトルバーの [戻る] ボタンを押しても同じことが行われるようにするだけでよく、それによってナビゲーション ビューがポップされます。
Sencha Touch で動作させるために、メインコントローラーに以下を追加します。
refs には、main
ビュー (のインスタンスExt.navigation.View
) とそのタイトルバーへの参照があり、そこから戻るボタンのイベントにフックできます。
refs: {
main: 'mainview',
mainTitleBar: 'mainview titlebar',
}...
control
config オブジェクトを介して次の関数をアタッチします。
control: {
main: {
push: 'onMainPush'
},
mainTitleBar: {
back: 'onBack'
},
...
これらは次のように定義されています。
onMainPush: function(view, item) {
//do what ever logic you need then..
history.pushState();
},
onBack: function() {
history.back(); //will cause the onpopstate event to fire on window..
//prevent back button popping main view directly..
return false;
},
次に、init 関数を介して状態がポップされたときに実行する関数をアタッチします。
init: function() {
/* pop a view when the back button is pressed
note: if it's already at the root it's a noop */
var that = this;
window.addEventListener('popstate', function() {
that.getMain().pop();
}, false);
},
ここで、タイトルバーを押すと が実行されhistory.back()
、これによりpopstate
イベントが発生し、メイン ビューがポップします。
これが実際のアプリケーションで機能することを確認したい場合は、この手法を使用した (v. 基本!) プロパティ ファインダー アプリが github hereにあります。