Как обращаться с кнопкой возврата устройства на сенсорном приложении Sencha

В Sencha touch, если я использую навигацию, я могу вернуться. Это очень хорошо.

Но что, если пользователь нажмет на кнопку устройства? это прямой выход из приложения. В моем требовании он не должен покидать приложение, которое он должен вернуть на предыдущий экран. Как я могу это сделать?

Ответ 1

Вы можете обращаться с кнопкой возврата оборудования следующим образом:

if (Ext.os.is('Android')) {
    document.addEventListener("backbutton", Ext.bind(onBackKeyDown, this), false);

    function onBackKeyDown(eve) {

        eve.preventDefault();

        //do something
        alert('back button pressed');

    }
}

Ответ 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.

 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 already at the root it a noop */
    var that = this;
    window.addEventListener('popstate', function() {
        that.getMain().pop();
    }, false);
},

Теперь, нажимая назад на заголовке, выполняется history.back(), это, в свою очередь, вызывает событие popstate, которое затем вызывает всплытие основного вида.

Если вы хотите, чтобы это работало над реальным приложением, это приложение поиска свойств (v. basic!), используя эту технику в github здесь.