Общие сведения

Во время навигации по мобильному приложению для каждой страницы выполняется ряд этапов — открытие, закрытие, выгрузка, возврат к странице и т. п. Время, прошедшее от загрузки страницы в память мобильного устройства и до ее окончательной выгрузки из памяти, принято называть жизненным циклом страницы.

Для каждого этапа жизненного цикла предусмотрены события страницы. Использование событий дает возможность расширять функциональность. К основным событиям относятся:

• инициализация представления;
• завершение инициализации класса;
• загрузка страницы;
• загрузка данных;
• закрытие страницы.

Понимание этапов выполнения жизненного цикла страницы позволяет качественно и максимально эффективно расширять логику страниц.

Этапы жизненного цикла

ВАЖНО На экране телефона может отображаться только одна страница. На экране планшета — одна страница в портретной ориентации и две в ландшафтной. В связи с этим жизненный цикл страниц имеет отличия для телефона и планшета.

Открытие страницы

При первом открытии страницы выполняется загрузка скриптов, требуемых для ее работы. Далее инициализируется контроллер и создается представление.

События открытия страницы генерируются в следующей последовательности:

1. initializeView — инициализация представления.

2. pageLoadComplete — событие завершения загрузки страницы.

3. launch — инициирует загрузку данных.

Закрытие страницы

Во время закрытия страницы ее представление удаляется из объектной модели документа (Document object model, DOM), а контроллер удаляется из памяти устройства.

Закрытие страницы происходит в следующих случаях:

• Нажата кнопка “Назад”. В таком случае удаляется последняя страница.
• Выполнен переход в другой раздел. В таком случае удаляются все страницы, которые были открыты ранее.

Событие завершения закрытия страницы — pageUnloadComplete.

Выгрузка страницы

Выгрузка страницы происходит в случае, когда выполняется переход к другой странице в том же разделе. При этом текущая страница становится неактивной. Она может оставаться видимой на экране устройства. Например, если на планшете открыть страницу просмотра из реестра, то страница реестра останется видимой. В такой же ситуации на телефоне страница реестра не будет отображаться, но будет оставаться в памяти. Это и отличает выгрузку от закрытия страницы.

Событие выгрузки страницы — pageUnloadComplete (совпадает с событием закрытия страницы).

Возврат к странице

Возврат к выгруженной ранее странице происходит при нажатии на кнопку [Назад].

Событие возврата к странице — pageLoadComplete.

ВАЖНО В приложении может использоваться только один экземпляр страницы. Поэтому, если последовательно открыть две одинаковые страницы, то при возврате к первой из них повторно выполняется обработчик события launch. Это следует учитывать при разработке.

Обработчики событий жизненного цикла

Классы контроллеров страниц наследуются от класса Terrasoft.controller.BaseConfigurationPage, который предоставляет методы обработки событий жизненного цикла.

initializeView(view)

Вызывается после того как было создано (но еще не было отрисовано) представление страницы в DOM. На этом этапе можно подписываться на события классов представления, выполнять дополнительные манипуляции с DOM.

pageLoadComplete(isLaunch)

Предоставляет возможность расширения логики, которая выполняется как при загрузке страницы, так и при возврате. Значение параметра isLaunch равное true указывает на то, что страница загружается первый раз.

launch()

Вызывается только при открытии страницы. Метод инициирует начало загрузки данных. Если требуется загрузка дополнительных данных, то правильно будет делать это в методе launch().

pageUnloadComplete()

Предоставляет возможность расширения логики, которая выполняется как при закрытии страницы, так и при ее выгрузке.

Навигация страниц

Управлением жизненным циклом страниц занимается класс Terrasoft.PageNavigator. Класс предоставляет возможности открытия и закрытия страниц, обновления неактуальных данных, а также хранения истории открытых страниц.

forward(openingPageConfig)

Метод открывает страницу с учетом свойств конфигурационного объекта-параметра openingPageConfig. Основные свойства этого объекта представлены в таблице 1.

Табл. 1. — Свойства объекта openingPageConfig

backward()

Метод закрывает страницу.

markPreviousPagesAsDirty(operationConfig)

Метод отмечает все предыдущие страницы как неактуальные. После возврата к предыдущим страницам для каждой из них вызовется метод refreshDirtyData(), который выполняет повторную загрузку данных или актуализирует данные на основании объекта operationConfig.

refreshPreviousPages(operationConfig, currentPageHistoryItem)

Метод выполняет для всех предыдущих страниц повторную загрузку данных или актуализирует данные на основании operationConfig. Если установлено значение для параметра currentPageHistoryItem, метод выполняет те же действия для предшествующих страниц.

refreshAllPages(operationConfig, excludedPageHistoryItems)

Метод выполняет для всех страниц повторную загрузку данных или актуализирует данные на основании operationConfig. Если установлен параметр excludedPageHistoryItems, метод исключает из актуализации указанные страницы.

Навигация с использованием маршрутов

Маршрутизация

Маршрутизация используется для управления визуальными компонентами: страницами, пикерами и др. Маршрут имеет три состояния:

1. Load — выполняет открытие текущего маршрута.

2. Unload — выполняет закрытие текущего маршрута при возврате.

3. Reload — выполнят восстановление предыдущего маршрута при возврате.

Для маршрутизации используется класс Terrasoft.Router и его основные методы add(), route(), back().

add(name, config)

Добавляет маршрут. Параметры:

• name — уникальное имя маршрута. В случае повторного добавления, последний переопределит предыдущий.

• config — описывает имена функций обработчиков состояний маршрута. В свойстве handlers устанавливаются обработчики состояний маршрута.

Пример использования:

Terrasoft.Router.add("record", {
  handlers: {
     load: "loadPage",
     reload: "reloadPage",
     unload: "unloadLastPage"
  }
});

route(name, scope, args, config)

Выполняет открытие маршрута. Параметры:

• name — имя маршрута.

• scope — контекст функции обработчиков состояний.

• args — параметры функций обработчиков состояний.

• config — дополнительные параметры маршрута.

Пример использования:

var mainPageController = Terrasoft.util.getMainController();
Terrasoft.Router.route("record", mainPageController, [{pageSchemaName: "MobileActivityGridPage"}]);

back()

Выполняет закрытие текущего маршрута и восстановление предыдущего.

Маршрутизация пользовательских страниц типа Custom

В приложении существует четыре типа страниц: Grid, Preview, Edit и Custom. Для первых трех используется базовый маршрут record. Для пользовательской страницы с типом Custom необходимо добавить новый маршрут.

Для этого необходимо создать классы страницы и контроллера:

Ext.define("Terrasoft.configuration.view.MyPage", {
    extend: "Terrasoft.view.BaseConfigurationPage",
    xtype: "mypage",
    config: {
        id: "MyPage",
        pageType: Terrasoft.PageTypes.Custom,
        navigationPanel: {
            backButton: true
        }
    }
});

Ext.define("Terrasoft.configuration.controller.MyPage", {
    extend: "Terrasoft.controller.BaseConfigurationPage",
    config: {
        refs: {
            view: "#MyPage"
        }
    },
    statics: {
        Model: Contact
    },
    initializeView: function() {
        this.callParent(arguments);
        //Инициализация заголовка страницы.
        this.initializeNavigationTitle();
    },
    getTitle: function() {
        return "Моя страница";
    },
    pageLoadComplete: function() {
        this.callParent(arguments);
        var pageHistoryItem = this.getPageHistoryItem();
        var config = pageHistoryItem.getRawConfig();
        var view = this.getView();
        //Отображение пользовательских данных в представлении.
        view.add({
            xtype: "label",
            html: config.customData
        });
    }
});

В методе pageLoadComplete() выполняется получение данных customData из PageHistory. Затем данные отображаются в представлении.

ВАЖНО При разработке мобильного приложения весь код необходимо добавлять в схемы типа "Модуль". При этом никогда не указывается родительская схема и стандартный механизм наследования/замещения не работает. После создания схем их обязательно нужно указать в массиве CustomSchemas манифеста мобильного приложения (см. "Манифест мобильного приложения"). Если необходимо расширить или переопределить существующий класс, то следует использовать базовые механизмы фреймворка Ext.js — extend, override (см. "Basic OOP / Class-Based Programming Concepts").

Далее в маршрутизатор необходимо добавить маршрут пользовательской страницы и указать обработчики состояний маршрута:

Terrasoft.Router.add("myPage", {
    handlers: {
        load: "loadMyPage",
        unload: "unloadMyPage"
    }
});

После этого необходимо создать класс, предоставляющий методы обработки состояний маршрута:

Ext.define("Terrasoft.configuration.MyPageUtils", {
    singleton: true,
    getPageData: function() {
        //Параметры страницы.
        return {
            controllerName: "Terrasoft.configuration.controller.MyPage",
            pageSchemaName: "MyPageSchemaName",
            viewXType: "mypage"
        };
    },

    loadMyPage: function(data) {
        var pageData = this.getPageData();
        // Добавление пользовательских данных.
        pageData.customData = data;
        // Открытие страницы с помощью PageNavigator.
        Terrasoft.PageNavigator.forward(pageData);
    },

    unloadMyPage: function() {
        //Закрытие страницы с помощью PageNavigator.
        Terrasoft.PageNavigator.backward();
    }
});

Затем страницу нужно добавить в кэш:

Terrasoft.PageCache.addItem("MyPageSchemaName",Terrasoft.configuration.MyPageUtils.getPageData());

Теперь маршрут настроен на страницу MyPage. Для открытия маршрута необходимо выполнить соответствующую команду:

Terrasoft.Router.route("myPage", Terrasoft.configuration.MyPageUtils, ["My page data"]);

После выполнения команды будет открыта пользовательская страница (рис. 1).

Рис. 1. — Пользовательская страница

К СВЕДЕНИЮ Наиболее наглядный пример, реализующий описанную функциональность, — это страница постобработки звонка (см. схему MobilePhoneCallLogPage, в которой определены страница контролера и страница представления с тремя полями). А также утилитный класс-singleton, позволяющий ее вызывать (см. схему MobilePhoneCallLogUtils). Пример вызова страницы можно найти в схеме MobileAccountPreviewPage.