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

WebOS позволяет приложениям работать в полноэкранном режиме. Вот об этой возможности мы и узнаем подробнее в этот раз.Итак, у нас задача – сделать приложение, работающее в полноэкранном режиме.

Создаем новый проект и в нем две сцены – main и fullscreen.

app/views/main/main-scene.html

<div class="palm-hasheader">
  <div class="palm-header">FullScreen Test</div>
</div>
<div class="palm-header-spacer"></div>
<div id="FullScreenSceneButton" x-mojo-element="Button"></div>
<div id="ExitButton" x-mojo-element="Button"></div>

app/assistants/main-assistant.js

function MainAssistant() {
}

MainAssistant.prototype.setup = function() {
    this.controller.setupWidget("FullScreenSceneButton", {}, {label: "FullScreen Scene"});
    this.controller.setupWidget("ExitButton", {}, {label: "Exit"});

    Mojo.Event.listen($(FullScreenSceneButton), Mojo.Event.tap, this.onFullScreen.bind(this));
    Mojo.Event.listen($(ExitButton), Mojo.Event.tap, this.onExit.bind(this));
}

MainAssistant.prototype.onFullScreen = function(event) {
    this.controller.stageController.pushScene("fullscreen");
}

MainAssistant.prototype.onExit = function(event) {
    this.controller.stageController.getAppController().closeAllStages();
    window.close();
}

MainAssistant.prototype.cleanup = function(event) {
    Mojo.Event.stopListening($(FullScreenSceneButton), Mojo.Event.tap, this.onFullScreen);
    Mojo.Event.stopListening($(ExitButton), Mojo.Event.tap, this.onExit);
}

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

app/views/fullscreen/fullscreen-scene.html

<div class="palm-group">
  <div class="palm-group-title">Sample Fullscreen Scene</div>
</div>
<div id="PopButton" x-mojo-element="Button"></div>

Для перехода в полноэкранный режим у контроллера сцены есть метод enableFullScreenMode(), который принимает булевый параметр и благодаря которому тот же метод служит и для включения и для выключения полноэкранного режима.

app/assistants/fullscreen-assistant.js

function FullscreenAssistant() {
}

FullscreenAssistant.prototype.setup = function() {
    this.controller.setupWidget("PopButton", {}, {label: "Close"});
    Mojo.Event.listen($(PopButton), Mojo.Event.tap, this.onClose.bind(this));
}

FullscreenAssistant.prototype.activate = function(event) {
    this.controller.enableFullScreenMode(true);
}

FullscreenAssistant.prototype.onClose = function(event) {
    this.controller.stageController.popScene();
}

FullscreenAssistant.prototype.deactivate = function(event) {
    this.controller.enableFullScreenMode(false);
}

FullscreenAssistant.prototype.cleanup = function(event) {
    Mojo.Event.stopListening($(PopButton), Mojo.Event.tap, this.onClose);
}

Активацию полноэкранного режима нужно делать при активации сцены, а выход из полноэкранного режима – при деактивации сцены. Не надо переходить в полноэкранный режим внутри метода setup(). Из-за этого можно получить артефакты отрисовки. По этому поводу можно найти достаточно информации на официальном форуме WebOS-разработчиков. В общем, activate() и deactivate() – это как раз подходящие методы для этого.

После всего получаем такой вот результат (скрин из эмулятора):

WebOS Fullscreen

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

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

Leave a Reply

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

Д.

Доступна вторая глава книги о разработке для Palm webOS

Сегодня в блоге разработчиков Palm webOS была анонсирована вторая глава книги “Palm webOS: Developing Applications in JavaScript using the Palm Mojo™ Framework“.

Вторая глава доступна читателям в Safari Books Online (доступ к этой главе платный, а жаль).

Первую главу книги можно скачать здесь или на Palm Developer Network.

Н.

Немного о Palm webOS

Palm PreСовсем недавно Palm продемонстрировала свою платформу нового поколения под названием Palm webOS. По заявлению самой Palm, новая платформа ориентирована, прежде всего, на многозадачность и простоту работы с сетью.

Средства разработки для Palm webOS называются Mojo и Palm уже опубликовали информацию о том, что SDK уже находится в закрытом тестировании, и скоро будет доступен для бесплатной загрузки на странице Palm Developer Network. Mojo Application Framework базируется на таких стандартах веб-разработки, как HTML5, CSS, JavaScript. Помимо удобной навигации и прокрутки, приложения на Mojo будут поддерживать работу с акселерометром.

Palm Pre — первое устройство на базе новой платформы. Первые версии Palm Pre должны появиться уже в первой половине 2009 года.

Palm заявляют, что Mojo SDK будет включать в себя примеры кода, документацию и среду разработки на базе Eclipse.

Планируется, также, что на устройстве будет каталог приложений для загрузки (аналог AppInst в iPhone).

В новой ОС так же представленна интеллектуальная платформа Palm Synergy™, которая выводит информацию из различных источников (смс, календарь, тп) в объединенном виде. Вам больше не придется беспокоиться об отслеживании нескольких календарей, контактов и обмене сообщениями.

Palm webOS DashboardPalm webOS LauncherPalm webOS Web Sites

Вобще очень интересно было бы посмотреть на это устройство в действии. HTML/JS/CSS открывают огромные возможности для разработки качественного и красивого GUI. Интересно только, как использование HTML скажется на быстродействии, ведь процессоры и графические адаптеры в мобильных устройствах не такие уж и мощные. Также было бы интересно посмотреть на средства разработки и эмулятора Palm webOS.