Шашков Максим Разработчик ПО SPB Software

Требования Базовые знания Windows Mobile Способность читать и понимать код HTML, JavaScript и CSS

Сегодня мы узнаем… Что такое виджет Для каких целей нужен виджет Как создать виджет Как сделать ваш ваш виджет интересным

Мобильные броузерыМобильные виджеты Зачем нужны виджеты? Уменьшение Веб Оптимизация Веба

Для того, чтобы быть полезными! Зачем нужны виджеты?

Что могут делать вижеты? Обладать таким же видом и поведением, как и родные приложения Иметь ограниченный доступ к информации на устройстве за границей «песочницы» Использовать AJAX и внутренний парсер JSON, работать с элементами ActiveX (Flash) Одинаково работать на всех устройствах с Windows Mobile 6.5

Widget Package Среда выполнения виджетов на базе Internet Explorer Mobile Движок обработки веб- документов ПлагиныПлагины Движок обработки скриптов Расширения JavaScript для устройств Flash MSXML Windows Media Настройки Хранилище …... ШлюзбезопасностиШлюзбезопасности Меню Что же внутри? HTML JavaScript CSS Картинки XML-манифест

Безопасность виджетов Виджеты работают в «Песочнице» Ограниченный доступ к файлам Нет доступа к реестру Навигация запрещена, но... Разрешены переходы к якорям # Разрешены прочие открытия приложений через URI sms: mailto: callto: tel: любой другой:

Безопасность виджетов Да, виджеты имеют cookies, историю и кеш Изолированные для каждого виджета Разрешён кроссдоменный доступ к данным Что очень полезно для mash-up'ов Виджеты для 6.5 не подписываются Могут распространяться только через Windows Marketplace for Mobile

Процесс разработки виджета 123 Создание Подготовка Публикация Проектировка и разработка функционала Публикация его в Windows Marketplace Cоздание XML- манифестаПеренос на устройство и установка Упаковка в Zip, с расширением.widget

И виджеты скажут… Hola! Используйте папки локализаций Также, как в гаджетах сайдбара в Vista Модульность ресурсов на уровне файлов Изображения, CSS, JavaScript Стартовая страница XML-конфигурации виджета Порядок нахождения ресурсов Полная папка локали (en-us) Язык (en) Корневая папка виджета

API для виджетов Место, где творится волшебство: объект Widget Доступ к метаданным Управление меню Постоянное хранилище данных Расширяемая фабрика объектов Объекты-расширения уже имеются: SystemState Предоставляет информацию о состоянии устройства Может уведомлять виджет об изменениях этого состояния

И спросил виджет… Кто я? Получение информации о виджете Имя (widget.name) Локаль (widget.locale) Текущая иконка (widget.currentIcon) Информация об авторе (widget.authorName) И так далее...

API манифеста виджета СвойствоОписание widget.locale Возвращает строку с именем текущей локали, например, "en-us widget.identifierВозвращает текущий ID виджета widget.currentIcon Возвращает иконку, используемую в меню запуска (start menu) widget.authorName Возвращает строку с именем автора виджета widget.author Возвращает адрес эл.почты автора widget.authorURLВозвращает URL автора виджета widget.nameВозвращает название виджета widget.descriptionВозвращает описание виджета widget.versionВозвращает строку с версией виджета widget.widthВозвращает ширину канвы для виджета widget.heightВозвращает высоту канвы для виджета

Управление меню Полный доступ к soft keys Правый softkey может быть кнопкой или меню Поддержка вложенных меню Возможность программного включения / выключения

Управление меню widget.createMenuItem(menuID) Создаёт новый элемент меню Обладает следующими свойствами: text onSelect enabled widget.setSoftKey widget.append widget.clear

Долгосрочная память виджета Сохраняемый словарь Между запусками виджета Между обновлениями версий Имя методаОписание setPreferenceForKeyСохраняет строку под указанным ключом PreferenceForKeyВозвращает строку по ключу (имени)

События виджета Уведомление виджета об изменениях в пользовательском интерфейсе onhide Срабатывает при отправлении виджета в фон Используется для прекращения вызовов повторяющихся операций (обновление данных) onshow Срабатывает при выводе виджета на первый план Используется для восстановления повторяющихся операций

По ту сторону песочницы Доступ к информации о текущем состоянии устройства - SystemState CradlePresent PhoneHomeService PhoneRoaming PhoneSignalStrength PhoneOperatorName DisplayRotation PowerBatteryStrength PowerBatteryState

По ту сторону песочницы Объекты состояния системы предоставляют: Своё текущее состояние пример: PowerBatteryState.value Уведомления при изменении состояния: пример: PowerBatteryState.addEventListener (changed, ваш_код);

Что отличает хороший виджет от великолепного? Внешний вид и поведение «родных» Использование soft keys с умом, левый soft key должен всегда быть действием по умолчанию Собственная иконка, быть обычным неинтересно! Поддерживаются форматы ICO, PNG и JPEG… для WM Professional Хорошая интеграция с текущим скином устройства Используйте системные цвета - Highlight, CaptionText, и т.д.

Что отличает хороший виджет от великолепного? Приятный внешний вид на всех устройствах Определение текущего разрешения и использование подходящего стиля CSS Использование настроек, подходящих для разрешения экрана Минимизация прокрутки Изменение размеров при вращении экрана...которое должно быть быстрым!

Что отличает хороший виджет от великолепного? Загружается быстро, интерактивно Создание динамического содержания происходит ПОСЛЕ окончания загрузки БЫСТРЫЙ отклик на события! Разбитие крупных задач на небольшие участки, выполняющиеся с задержкой Помните… Выполнение скриптов блокирует возможность отклика для вашего интерфейса!

Что отличает хороший виджет от великолепного? Разумное использование Сети Обновление данных с учётом уведомлений о системных и пользовательских событиях Помните, чрезмерный трафик также расходует заряд аккумулятора Локальное хранение часто используемых данн ых дешевле Использование асинхронных сетевых запросов ведь для этого и нужен AJAX

Что необходимо знать о производительности Порядок запроса скриптов -имеет значение Загружайте необходимые библиотеки сразу Но добавляйте только нужный вам сейчас код Добавление элементов DOM дорогая операция Создавайте все элементы до вызова document.appendChild element.innerHTML быстрая операция, используйте её, если сможете

Замеры-замеры-замеры... Новый профайлер скриптов в IE8 - прекрасен Просто помните, что устройства работают медленнее, чем компьютеры, на которых ведётся разработка

Призыв к действию Пройдите по ссылке Получите свежайшую информацию об API для виджетов Загрузите образы эмуляторов WM 6.5 Получите лучшие советы и рекомендации из блога windows mobile Начните создавать классные виджеты! Обеспечьте мобильной версией ваш веб-сервис Напишите классную игру на Flash Будьте креативны, делайте это весело! Загрузите ваши творения в Marketplace Всё это уже доступно для вас!