Главная » Статьи » Visual Studio 2012 » Создание с помощью JavaScript

Часть 2. Управление жизненным циклом и состоянием приложения

В Windows 8 можно запускать несколько приложений и переключаться между ними, не беспокоясь о замедлении работы системы или разрядке аккумулятора. Это связано с тем, что система автоматически приостанавливает (а иногда завершает) выполнение приложений, работающих в фоновом режиме. Если сохранять состояние приложения перед его приостановкой или завершением и восстанавливать это состояние при повторном запуске приложения, это будет выглядеть так, будто приложение никогда не завершало своей работы.

Далее вы научитесь:

  • Сохранять состояние с помощью различных типов перемещаемого хранилища
  • Восстанавливать состояние вашего приложения при последующем его запуске

Перед началом обучения

Сведения о жизненном цикле приложения

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

В любой момент времени приложение либо не работает, либо работает, либо приостановлено.

Жизненный цикл приложения

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

Однако Windows может в любое время завершить работу приостановленного приложения, чтобы освободить память для других программ или для экономии энергии. Если приложение завершается, оно останавливает свою работу и выгружается из памяти.

Когда пользователь закрывает приложение нажатием сочетания клавиш Alt+F4 или жестом закрытия, приложение приостанавливается на 10 секунд и затем завершает работу.

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

Для успешного взаимодействия с пользователем необходимо восстанавливать первоначальный вид приложения, который был до приостановки. Это означает, что приложение должно сохранять любые введенные пользователем данные, измененные им параметры и т. д. Состояние приложения должно сохраняться при приостановке приложения на случай, если Windows завершит его. Только при таких условиях впоследствии можно восстановить состояние приложения.

В общем случае в приложении имеется два типа данных, которыми нужно управлять: данные приложения и данные сеанса.

Далее вы узнаете, как обновить приложение, чтобы сохранить эти типы данных. Какое состояние следует сохранять? На данный момент пользователь может изменить только свое имя и оценку. Пользователь также может нажать кнопку Say "Hello", чтобы создать персональное приветствие.

Шаг 1. Сохранение данных приложения

Данные приложения не изменяются от сеанса к сеансу и должны быть всегда доступны пользователю. В нашем приложении значение value поля ввода nameInput input представляет собой данные приложения — параметр, который должен появляться в приложении при каждом его запуске пользователем. Поскольку код в обработчике события приостановки может выполняться в приложении не более пяти секунд, убедитесь, что к моменту приостановки все важные данные сохранены в постоянном хранилище. Для этого рекомендуется выполнять добавочное сохранение данных приложения при их изменении.

Windows предоставляет объект Windows.Storage.ApplicationData, позволяющий управлять данными приложения. Этот объект содержит свойство roamingSettings, которое возвращает контейнер ApplicationDataContainer. Перемещаемый контейнер ApplicationDataContainer используется для сохранения данных пользователя, которые не изменяются от сеанса к сеансу. Сохраните имя пользователя и оценку в перемещаемом контейнере ApplicationDataContainer, после того как пользователь их введет.

Примечание  Этот учебник объясняет, как использовать roamingSettings. С помощью контейнера параметров перемещения данных приложения удобно хранить данные — они доступны пользователям на разных компьютерах. Как правило, данные загружаются в облако в фоновом режиме. Вы также можете использовать контейнер локальных параметров данных приложения (localSettings), но только если вы хотите сохранить сведения, касающиеся компьютера.

Здесь мы начнем с кода из Часть 1. Создание приложения Hello, World!.

Hh986966.wedge(ru-ru,WIN.10).gifПорядок сохранения данных приложения

  1. В файле default.js создайте обработчик события для события change поля ввода nameInput input. Имя обработчика события nameInputChanged. Вставьте этот код сразу после кода buttonClickHandler, который был создан в разделе Часть 1.

     function nameInputChanged(eventInfo) {
    
     }
    
    
  2. Воспользуйтесь свойством srcElement объекта eventInfo для доступа к элементу управления nameInput. (Свойство srcElement извлекает элемент, который запустил событие.)

     function nameInputChanged(eventInfo) {
     var nameInput = eventInfo.srcElement;
    
     }
    
    
  3. Сохраните имя пользователя в контейнере ApplicationDataContainer для перемещаемых параметров:

    1. Вызовите свойство Windows.Storage.ApplicationData.current, чтобы получить объект ApplicationData приложения.
    2. Затем вызовите свойство roamingSettings объекта ApplicationData, чтобы получить контейнер ApplicationDataContainer для перемещаемых параметров.

    Теперь можно сохранить имя пользователя с помощью любого ключа. Сохраним имя пользователя как "userName".

     function nameInputChanged(eventInfo) {
     var nameInput = eventInfo.srcElement;
    
     // Store the user's name for multiple sessions.
     var appData = Windows.Storage.ApplicationData.current;
     var roamingSettings = appData.roamingSettings;
     roamingSettings.values["userName"] = nameInput.value;
     }
    
    
  4. В разделе Часть 1. Создание приложения Hello, world использовался обработчик события onactivated для регистрации обработчиков событий. Теперь следует создать дополнительный код для регистрации обработчика событий nameInputChanged с помощью элемента управления nameInput.

     app.onactivated = function (args) {
     if (args.detail.kind === activation.ActivationKind.launch) {
     if (args.detail.previousExecutionState !== activation.ApplicationExecutionState.terminated) {
     // TODO: This application has been newly launched. Initialize
     // your application here.
     } else {
     // TODO: This application has been reactivated from suspension.
     // Restore application state here.
     }
     args.setPromise(WinJS.UI.processAll().then(function completed() {
    
     // Retrieve the div that hosts the Rating control.
     var ratingControlDiv = document.getElementById("ratingControlDiv");
    
     // Retrieve the actual Rating control.
     var ratingControl = ratingControlDiv.winControl;
    
     // Register the event handler. 
     ratingControl.addEventListener("change", ratingChanged, false);
    
     // Retrieve the button and register our event handler. 
     var helloButton = document.getElementById("helloButton");
     helloButton.addEventListener("click", buttonClickHandler, false);
    
     // Retrieve the input element and register our
     // event handler.
     var nameInput = document.getElementById("nameInput");
     nameInput.addEventListener("change", nameInputChanged);
    
     }));
    
     }
     };
    
    
  5. Теперь сохраним измененное состояние элемента управления оценкой. Для этого нам всего лишь нужно обновить обработчик событий, который мы создали в разделе Часть 1, чтобы сохранить значение в контейнер приложения roamingSettings. Сохраним оценку как greetingRating

     function ratingChanged(eventInfo) {
    
     var ratingOutput = document.getElementById("ratingOutput");
     ratingOutput.innerText = eventInfo.detail.tentativeRating;
    
     // Store the rating for multiple sessions.
     var appData = Windows.Storage.ApplicationData.current;
     var roamingSettings = appData.roamingSettings;
     roamingSettings.values["greetingRating"] = eventInfo.detail.tentativeRating;
     }
    
    

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

Шаг 2. Сохранение данных сеанса

Данные сеанса являются временными и относятся к текущему сеансу пользователя вашего приложения. Сеанс заканчивается, когда пользователь закрывает приложение жестом закрытия или нажатием клавиш Alt + F4, перезагружает компьютер или завершает сеанс. В приложении элемент innerText объекта greetingOutput div считается данными сеанса. Эти данные восстанавливаются только в том случае, если приложение было приостановлено или завершено системой Windows. Чтобы сохранить данные сеанса, используйте объект WinJS.Application.sessionState.

Когда необходимо сохранять данные сеанса? В файле default.js содержится код используемого нами обработчика события oncheckpoint. Обработчик вызывается, когда операционная система Windows почти готова к приостановлению приложения. Однако рекомендуется выполнять добавочное сохранение данных сеанса по мере их изменения (так же, как мы это делали с данными приложения). Данные сеанса будут сохраняться при каждом нажатии пользователем кнопки "Say Hello" (Сказать "Hello").

Hh986966.wedge(ru-ru,WIN.10).gifСохранение данных сеанса

  • В default.js обновите функцию buttonClickHandler, которую вы создали в разделе Часть 1. Создание приложения Hello, World!, чтобы в ней сохранялось персональное приветствие.

    Так как персональное приветствие следует сохранять только для определенного сеанса, сохраните его в объекте WinJS.Application.sessionState. Чтобы использовать объект sessionState, добавьте к нему свойство и установите значение свойства. Вызовите свойство greetingOutput.

     function buttonClickHandler(eventInfo) {
    
     var userName = document.getElementById("nameInput").value;
     var greetingString = "Hello, " + userName + "!";
     document.getElementById("greetingOutput").innerText = greetingString;
    
     // Save the session data. 
     WinJS.Application.sessionState.greetingOutput = greetingString;
     }
    
    

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

Шаг 3. Восстановление состояния приложения

Рассмотрим код обработчика события onactivated, который обрабатывает активацию приложения.

Первое, что делает код, — получает ссылку на наше приложение и сохраняет ее в переменной app. Затем он создает переменную activation, которая ссылается на пространство имен Windows.ApplicationModel.Activation. Обе эти операции абсолютно необязательны и предназначены только для того, чтобы уменьшить объем вводимого текста при создании ссылки на ваше приложение или пространство имен Windows.ApplicationModel.Activation.

 var app = WinJS.Application;
 var activation = Windows.ApplicationModel.Activation;


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

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

 app.onactivated = function (args) {
 if (args.detail.kind === activation.ActivationKind.launch) {
 

Далее обработчик проверяет состояние предыдущего выполнения, чтобы определить, каким образом произошло завершение работы приложения в последний раз.

 if (args.detail.previousExecutionState !== activation.ApplicationExecutionState.terminated) {
 // TODO: This application has been newly launched. Initialize
 // your application here.
 } else {
 // TODO: This application has been reactivated from suspension.
 // Restore application state here.
 }


Если состояние предыдущего выполнения отмечено как terminated, это означает, что во время последнего запуска операционная система Windows успешно приостановила приложение, а затем завершила его работу. Если приложение не было завершено, обработчик рассматривает его как приложение, запускаемое в первый раз.

И, наконец, обработчик вызывает метод WinJS.UI.processAll и код, добавленный для регистрации обработчиков событий. Он вызывает этот код при каждом запуске приложения, несмотря на состояние предыдущего выполнения.

 if (args.detail.previousExecutionState !== activation.ApplicationExecutionState.terminated) {
 // TODO: This application has been newly launched. Initialize
 // your application here.
 } else {
 // TODO: This application has been reactivated from suspension.
 // Restore application state here.
 }
 args.setPromise(WinJS.UI.processAll().then(function completed() {

 // Retrieve the div that hosts the Rating control.
 var ratingControlDiv = document.getElementById("ratingControlDiv");

 // Retrieve the actual Rating control.
 var ratingControl = ratingControlDiv.winControl;

 // Register the event handler. 
 ratingControl.addEventListener("change", ratingChanged, false);

 // Retrieve the button and register our event handler. 
 var helloButton = document.getElementById("helloButton");
 helloButton.addEventListener("click", buttonClickHandler, false);

 // Retrieve the input element and register our
 // event handler.
 var nameInput = document.getElementById("nameInput");
 nameInput.addEventListener("change", nameInputChanged);

 }));

 }
 };

Теперь функции обработчика события onactivated понятны, будем использовать его для восстановления состояния приложения.

Hh986966.wedge(ru-ru,WIN.10).gifЧтобы восстановить состояние приложения:

  1. Если состояние предыдущего выполнения previousExecutionState отмечено как terminated, загрузите наше персональное приветствие.

    В операторе else, где в комментариях говорится о необходимости восстановления состояния приложения, проверьте, имеет ли значение объект WinJS.Application.sessionState.greetingOutput. Если этот объект имеет значение, извлеките div-элемент greetingOutput, а затем используйте его для отображения приветствия.

     app.onactivated = function (args) {
     if (args.detail.kind === activation.ActivationKind.launch) {
     if (args.detail.previousExecutionState !== activation.ApplicationExecutionState.terminated) {
     // TODO: This application has been newly launched. Initialize
     // your application here.
     } else {
     // TODO: This application has been reactivated from suspension.
     // Restore application state here.
    
     // Retrieve our greetingOutput session state info, 
     // if it exists. 
     var outputValue = WinJS.Application.sessionState.greetingOutput;
     if (outputValue) {
     var greetingOutput = document.getElementById("greetingOutput");
     greetingOutput.innerText = outputValue;
     }
     }
     args.setPromise(WinJS.UI.processAll().then(function completed() {
    
     // Retrieve the div that hosts the Rating control.
     var ratingControlDiv = document.getElementById("ratingControlDiv");
    
     // Retrieve the actual Rating control.
     var ratingControl = ratingControlDiv.winControl;
    
     // Register the event handler. 
     ratingControl.addEventListener("change", ratingChanged, false);
    
     // Retrieve the button and register our event handler. 
     var helloButton = document.getElementById("helloButton");
     helloButton.addEventListener("click", buttonClickHandler, false);
    
     // Retrieve the input element and register our
     // event handler.
     var nameInput = document.getElementById("nameInput");
     nameInput.addEventListener("change", nameInputChanged);
    
     }));
    
     }
     };
    
    
  2. Теперь загрузим имя пользователя и оценку. Так как мы хотим, чтобы данные об имени пользователя и оценке не изменялись на протяжении многих сеансов, мы сохранили их в контейнере данных приложения roamingSettings. Добавьте код для получения контейнера данных приложения и отобразите имя пользователя и оценку, если они существуют.

    Этот код должен выполняться независимо от того, как приложение завершило работу при последнем запуске (нам нужно только проверить предыдущее состояние выполнения для данных сеанса). Поэтому мы добавляем его снаружи предложения if, которое проверяет предыдущее состояние выполнения приложения. Добавим его внутрь обработчика then для WinJS.UI.processAll, где мы выполняем регистрацию для событий.

     app.onactivated = function (args) {
     if (args.detail.kind === activation.ActivationKind.launch) {
     if (args.detail.previousExecutionState !== activation.ApplicationExecutionState.terminated) {
     // TODO: This application has been newly launched. Initialize
     // your application here.
     } else {
     // TODO: This application has been reactivated from suspension.
     // Restore application state here.
    
     // Retrieve our greetingOutput session state info, 
     // if it exists. 
     var outputValue = WinJS.Application.sessionState.greetingOutput;
     if (outputValue) {
     var greetingOutput = document.getElementById("greetingOutput");
     greetingOutput.innerText = outputValue;
     }
     }
     args.setPromise(WinJS.UI.processAll().then(function completed() {
    
     // Retrieve the div that hosts the Rating control.
     var ratingControlDiv = document.getElementById("ratingControlDiv");
    
     // Retrieve the actual Rating control.
     var ratingControl = ratingControlDiv.winControl;
    
     // Register the event handler. 
     ratingControl.addEventListener("change", ratingChanged, false);
    
     // Retrieve the button and register our event handler. 
     var helloButton = document.getElementById("helloButton");
     helloButton.addEventListener("click", buttonClickHandler, false);
    
     // Retrieve the input element and register our
     // event handler.
     var nameInput = document.getElementById("nameInput");
     nameInput.addEventListener("change", nameInputChanged);
    
     // Restore app data. 
     var roamingSettings = Windows.Storage.ApplicationData.current.roamingSettings;
    
     // Restore the user name.
     var userName =
     Windows.Storage.ApplicationData.current.roamingSettings.values["userName"];
     if (userName) {
     nameInput.value = userName;
     }
    
     // Restore the rating. 
     var greetingRating = roamingSettings.values["greetingRating"];
     if (greetingRating) {
     ratingControl.userRating = greetingRating;
     var ratingOutput = document.getElementById("ratingOutput");
     ratingOutput.innerText = greetingRating;
     }
    
     }));
    
     }
     };
    
    

Теперь можно построить и запустить приложение или посмотреть, как сохранилось и восстановилось состояние сеанса. До сих пор наше приложение тестировалось в режиме отладки, а завершалось при выборе пункта меню Stop Debugging (Остановить отладку) в Microsoft Visual Studio. Однако это приводит к нормальному завершению работы без возникновения события Suspending. К счастью, Visual Studio позволяет имитировать приостановку, завершение и восстановление приложения.

Hh986966.wedge(ru-ru,WIN.10).gifДля имитации этих операций в Visual Studio:

  1. Нажмите кнопку F5, чтобы выполнить приложение в режиме отладки.
  2. Введите ваше имя в поле ввода и нажмите на кнопку "Say "Hello"" (Сказать "Hello"). Появится приветствие.
  3. Чтобы вернуться в Visual Studio, нажмите клавиши Alt+Tab.
  4. Откройте раскрывающееся меню рядом с кнопкой Suspend (Приостановить) на панели инструментов Debug Location (Место отладки).

    При запуске отладчика по умолчанию появится панель инструментов Debug (Отладка). Если панель не появилась, выберите пункты меню View (Вид) > Toolbars (Панели инструментов) > Debug Location (Место отладки).

    Кнопка

  5. Нажмите кнопку Приостановить и завершить работу.

    Visual Studio имитирует приостановку и завершение работы приложения, в результате чего возникает событие Suspending и выполняется код управления состоянием.

  6. Чтобы запустить приложение еще раз, снова нажмите клавишу F5. Приложение восстанавливается в свое предыдущее состояние.

Заключение

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

Источник: http://msdn.microsoft.com/ru-ru/library/windows/apps/
Категория: Создание с помощью JavaScript | Добавил: expert1 (19.04.2013)
Просмотров: 1189 | Теги: Web, metro-приложения, Windows | Рейтинг: 0.0/0
Всего комментариев: 0