Каким образом можно создать точку останова? Например, если в Лекции 8 в примере, который демонстрирует возможность <canvas> для работы с готовыми изображениями (последний в лекции) в цикле |
Разработка клиентских мобильных виджетов средствами Visual Studio с использованием Apache Cordova
Возможности Apache Cordova для разработки виджетов средствами Visual Studio
Фреймворк Cordova [1] возник как решение проблем работы мобильных приложений, создаваемых на основе HTML5. Например, можно разработать мобильное веб-приложение с JavaScript- и HTML5-контентом, направляя пользователей на URL хостинга. Первой проблемой станет продажа этого приложения через онлайновые магазины. Нельзя отправить в такой магазин URL, по которому размещено ваше веб-приложение, вы не получите за него деньги. Вторая проблема заключается в том, как осуществляется доступ к аппаратному обеспечению мобильного устройства и его графическим возможностям. По части графики в веб-приложениях можно делать только то, что позволяют CSS/HTML/JavaScript. Некоторые функции управления четкостью изображения и пользовательским интерфейсом, доступные в среде операционной системы мобильного устройства, в пространстве браузера недоступны. У браузеров нет широко поддерживаемых API для доступа к телефонным контактам, уведомлениям, камерам, датчикам и прочему. Apache Cordova (далее просто Cordova для краткости) - бесплатная инфраструктура с открытым исходным кодом - решает обе эти проблемы.
Cordova начиналась как PhoneGap, которая была разработана Nitobi. В октябре 2011 года Nitobi была приобретена компанией Adobe Systems вместе с открытым исходным кодом инфраструктуры PhoneGap по лицензии Apache Software Foundation, и название PhoneGap было сменено на Cordova. Переходный период не закончился до сих пор. Cordova предоставляет среду для хостинга разрабатываемого контента HTML5/JavaScript внутри тонкой "родной" оболочки. Для ОС на каждой платформе мобильных устройств она использует родной элемент управления "браузер" для рендеринга контента вашего клиентского приложения, причем ресурсы приложения упаковываются в дистрибутив. В случае Windows Phone ваши HTML5-ресурсы упаковываются в .xap - файл и загружаются в изолированное хранилище, когда запускается ваше Cordova-приложение. Фактически, Cordova-приложение представляет собой мобильный виджет. В период выполнения элемент управления WebBrowser визуализирует контент виджета и исполняет его JavaScript-код.
Cordova позволяет вызывать функции операционной системы с помощью кода JavaScript, размещенного в Web-разметке. Например, фотокамерой управляет следующая простая строка JavaScript: navigator.camera.getPicture(). Cordova также предоставляет набор стандартных API для доступа к функциям, общим для всех мобильных устройств. К некоторым из этих функций относятся хранилище (локальное хранилище и базы данных HTML5), контакты, камера, геопозиционирование, акселерометр. Каждая из этих функций предоставляется как JavaScript API, который используется из необходимого кода на JavaScript. Cordova берет на себя всю черновую работу, связанную с предоставлением необходимой родной реализации, и тем самым гарантирует, что вы будете иметь дело с одинаковыми JavaScript API независимо от ОС мобильного устройства, на котором выполняется ваш код. Тем самым, она позволяет выполнять одно и то же HTML5-приложение в различных мобильных операционных системах:
Этот фреймвок уже стал стандартом де факто для платформ WindowsPhone, iOS, Android и многих других. Его следует воспринимать как надстройку над SDK мобильной платформы, ориентированную на разработку виджетов (клиентской части) гибридных приложений, хотя в ней с успехом можно разрабатывать и офлайновые мобильные виджеты. В 2012 году авторы свободного JavaScript - фреймворка Apache Cordova сообщили о том, что их проект "повысили" до уровня ведущего (top-level projects, TLP) в некоммерческой организации Apache Software Foundation (ASF).
При выполнении JavaScript-кода внутри проекта Cordova мы можем использовать несколько плагинов Cordova. Эти плагины представлены в следующей таблице.
Плагин | Описание |
---|---|
Geolocation | Предоставляет функциональность, сходную с функциональностью W3C Geolocation API. |
Accelerometer | Предоставляет приемники событий для датчика ускорений. |
Camera | Обеспечивает доступ к камере. |
Notification | Обеспечивает доступ к звуку, эффектам вибрации и другим возможностям уведомления. |
Contacts | Позволяет вам управлять списком контактов из расписания пользователя. |
File | Обеспечивает чтение, запись и управление файлами в файловой системе. |
SMS | Позволяет вам отсылать SMS-сообщения. |
Phone | Позволяет вам выполнять телефонные звонки. |
Maps | Позволяет вам открывать карту. |
Audio | Позволяет вам записывать и воспроизводить аудиофайлы. |
Settings | Получает информацию об устройстве. |
HTTP | Выполняет GET-запрос по указанному URL-адресу. |
Например, чтобы сделать фотографию, мы можем использовать плагин "camera" в следующем JavaScript - коде:
function takePicture () { navigator.camera.getPicture(function(image) { // Данная функция вызывается с данными фотографии // в формате base64 document.getElementById("img").src="data:image/base64;" + image; }, null, {quality: 8}); }
Ресурсы Cordova-приложений упаковываются в собственный формат мобильного устройства. Например:
- для Windows Phone, на выходе получается .xap - файл;
- для iOS на выходе формируется .ipa - файл (iPhone Application Archive);
- для Android на выходе - .apk - файл (Android Application Package).
Таким образом, виджеты упаковываются в собственный формат устройства и устанавливаются как любое другое приложение на этом устройстве. Так что - вы пишете виджет на HTML5, и ваш пользователь не имеет ни малейшего представления, что это не родное приложение.