В этот раз рассмотрим более детально структуру приложения для WebOS. В SDK есть достаточное количество дополнительных утилит, кторые могут помочь сгенерировать приложение или сцену. Но, при использовании автоматических кодогенераторов, понимания того, как же всетаки устроен проект, не прибавляется. Если кодогенератор отработает некорректно по какой-либо причине, без знания структуры проекта вернуть все в рабочее состояние будет непросто.

Для начала сделаем вот что: создадим пустой проект. В Eclipse идем в File -> New -> Other, в диалоговом окне выбираем General -> Project. Далее в мастере указываем имя проекта и путь, где он будет создан.

Создаем файл описания приложения

Создаем пустой файл в проекте, называем его appinfo.json

{
	"id": "com.itdimension.manuallycreatedwebosproject",
	"version": "1.0.0",
	"vendor": "Mobile-Developer.ru",
	"type": "web",
	"main": "index.html",
	"title": "Manually Created Project",
	"icon": "icon.png"
}

В этом файле указаны:

  • id – уникальный идентификатор приложения
  • version – версия приложения
  • vendor – название производителя
  • type – тип проекта
  • main – начальная страница приложения
  • title – название проекта (оно будет использовано для отображения в списке установленных  приложений WebOS)
  • icon – иконка приложения (также будет использоваться при отображении в Launcher’е)

Как видно, файл настроек приложения содержит упоминание двух файлов – файла главной страницы, а также иконки приложения. Узнать больше о параметрах, которые можно указать в appinfo.js можно здесь. Интересным также является тот факт, что кроме web-приложений можно создавать и нативные приложения. Для таких приложений свойство type будет иметь значение native.

Создаем файл главной страницы

В проекте Eclipse создаем новый html-файл, называем его index.html.

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
	"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
	<title>CameraTest</title>
	<script 
		src="/usr/palm/frameworks/mojo/mojo.js" 
		type="text/javascript" x-mojo-version="1" />
	<link
		href="stylesheets/cameratest.css" 
		media="screen" rel="stylesheet" type="text/css" />
</head>
<body>
	<h2>Manually Created Project</h2>
</body>
</html>

Если в приложении будут использоваться нестандартные CSS-стили элементов управления, то они должны быть указаны обязательно ПОСЛЕ ссылки на mojo.js.

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

Для создания пакета в Palm Mojo SDK есть скрипт palm-package. Нам достаточно скормить этому скрипту путь к папке с проектом и на выходе получим .ipk файл с приложением.

palm-package ManuallyCreatedWebOSProject

В результате выполнения этой команды у нас должен получиться файл com.itdimension.manuallycreatedwebosproject_1.0.0_all.ipk
Для того чтобы загрузить пакет на эмулятор необходимо вызвать скрипт palm-install и скормить ему .ipk файл

D:\Projects\Eclipse Projects>palm-install com.itdimension.manuallycreatedwebosproject_1.0.0_all.ipk

После этого в эмуляторе запускаем Launcher и видим в нем наше приложение.
WebOS Manually Created Application in Launcher
После запуска приложения получим вот такой экран:
WebOS Manually Created App
Теперь надо бы сделать так, чтобы в нашем приложении кроме главной страницы было еще что-нибудь.

Создаем сцену

Для начала надо создать структуру каталогов:

  • app
    • assistants – в ней юудут находиться js-файлы, содержащие логику управления сценами
    • views – в ней будут содержаться html-файлы сцен

В WebOS-приложении есть понятие “stage” – окно и “scene” – панель в окне. Для каждой сущности нужен свой assistant-класс с обработчиками событий.

stage-assistant.js

function StageAssistant() {
}

StageAssistant.prototype.setup = function() {
    this.controller.pushScene("main");
}

Как видим, в конструкторе assistant-класса мы отображаем сцену с именем main. Теперь создадим саму сцену:

В папке views создаем папку main и в ней файл main-scene.html

<div id="main" class="palm-hasheader">
    <div class="palm-header">Camera Test</div>
    <div id="MyButton" x-mojo-element="Button"></div>
</div>

В папке assistants создаем main-assistant.js

function MainAssistant() {
}

MainAssistant.prototype.setup = function() {
	this.controller.setupWidget("MyButton", {}, {label:"My Button"});
}

Теперь создадим файл sources.json, в котором будут регистрироваться файлы с assistant-классами.

[
    {"source": "app\/assistants\/stage-assistant.js"},
    {
        "source": "app\/assistants\/main-assistant.js",
        "scenes": "main"
    }
]

В результате после запуска приложения получим такой пользовательский интерфейс:
WebOS Manually Created Scene

Скачать исходный код примера.

Previous ArticleNext Article
Технический директор IT-Dimension, компании-разработчика кросс-платформенного программного обеспечения

Leave a Reply

Your email address will not be published. Required fields are marked *

Н.

Новые инструменты в Palm Mojo SDK 1.2

Вчера стала доступна новая версия Mojo SDK для разработчиков мобильных приложений на базе WebOS. В новой версии доступны несколько новых утилит, которые помогают производить отладку разрабатываемых приложений более эффективно.

Новые утилиты это:

  • palm-log – позволяет выполнять просмотр журнала событий приложения
  • webOS Resource Manager (WORM) – позволяет отследить потребляемые ресурсы

palm-log

Эта утилита позволяет выводить сообщения, которые приложение пишет в журнал с помощью Logging API. Использование утилиты намного удобнее чем попытки прочитать сообщения из /var/log/messages вручную.

Синтаксис вызова
palm-log [опции] [идентификатор-приложения]
Доступные опции
-d, –device=device Указывает используемое устройство:

  • –device=tcp — эмулятор
    Внимание: Эмулятор в этом случая должен быть уже запущен.
  • –device=usb — устройство, подсоединенное с помощью USB
-l, –list Выводит список установленных приложений. Очень удобно если вы не помните идентификатор нужного приложения.
-f, –follow Продолжать выводить сообщения. При указании этой опции palm-log будет выводить сообщения до тех пор, пока вы не нажмете Ctrl+C для остановки.
–version Выводит версию palm-log.
–help Выводит справочную информацию.
Примеры использования

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

palm-log com.example.app

Вывести список приложений:

palm-log -l

Вывести список приложений на устройстве:

palm-log -d usb -l
Пример вывода, который можно получить при использовании palm-log
$ palm-log -f com.palm.app.maps

connecting to device emulator

(96C3BC9CC41E8A2A440C265DEDB8FB048F35B30E:tcp:64640)

following logs for application com.palm.app.maps

[20090813-07:51:06.138630] info: loadRealPage: 452
[20090813-07:51:06.144874] info: palm system: true
[20090813-07:51:06.145419] info: prepare transition
[20090813-07:51:06.270742] info: =========> looking for palmInitFramework191_15

WebOS Resource Manager (WORM)

Эта чудесная утилита позволяет отследить количество HTML-объектов (DOM nodes) в вашем приложении. Это может быть очень удобным при поиске утечек памяти. Если после закрытия сцены или приложения у вас остались неудаленные DOM объекты, значит в приложении имеет место утечка памяти. Очень часто, например, утечки памяти могу возникнуть если не отключать обработчики событий при закрытии сцены.

WebOS Resource Manager GUI

Пример использования
palm-worm [идентификатор-приложения]
  • При закрытии сцен или уведомлений в приложении, количество используемой памяти должно возвратиться на уровень, который оно имело до открытия сцены или уведомления.
  • При закрытии приложения, объем выделенной приложением памяти должен вернуться в ноль.
С.

Средства разработки для Palm webOS можно попробовать уже сейчас

Ну наконец-то Palm дает возможность разработчикам попробовать в работе раннюю версию SDK для разработки под webOS для устройств Palm Pre. Вчера они анонсировали кампанию под названием Palm Mojo SDK early access program, в рамках которой можно получить средства разработки и доступ к порталу разработчиков для Palm webOS.

Для участия в программе необходимо заполнить форму. Я уже заполнил, жду подтверждения. Судя по вебкасту, довольно интересная платформа.