Е. Буткевич Пишем программы и игры


Глава 3 Пользовательский интерфейс высокого уровня



страница3/15
Дата22.06.2019
Размер2.79 Mb.
ТипКраткое содержание
1   2   3   4   5   6   7   8   9   ...   15
Глава 3

Пользовательский интерфейс высокого уровня

После того как мы познакомились с основной структурой мидлета, будем посте­пенно продвигаться в наших познаниях. Java — язык объектно-ориентирован­ный, поэтому, изучив все его объекты, мы сможем конструировать из них, как из кубиков, большие многофункциональные приложения. Первым делом разберем­ся с тем, как выводить информацию на экран телефона, чтобы демонстрировать результат работы наших приложений. Выводимая информация может быть раз­нообразной: текст, картинки, средства общения (интеракции) с пользователем.

Все объекты, которые можно отобразить на экране, наследуются из общего клас­са, название которого говорит само за себя — javax.microedition.1cdui .Displayable. Дальнейшая эволюция классов, наследуемых из класса Displayable, идет в двух направлениях:





Alert




Form




List




TextBox

Рис. 3.1. Иерархия отображаемых объектов J2ME


  1. Класс Canvas предоставляет пользователю интерфейс низкого уровня, органи­
    зует непосредственный доступ к прорисовке экрана. Подробнее на этом классе
    мы остановимся в следующей главе.

  2. Класс Screen является родителем для классов пользовательского интерфейса
    высокого уровня. Это четыре класса: Alert, Form, Li st, TextBox, объекты которых
    являются стандартными средствами связи с пользователем. Внешний вид та­
    ких объектов зависит от конкретной модели телефона. Свобода действий над
    этими объектами, изменение их вида, свойств и поведения ограничены функ­
    циями реализации J2ME. Иерархию отображаемых объектов можно предста­
    вить следующей схемой (рис. 3.1).

Класс Form 33

Класс Form

В этой главе мы рассмотрим работу с формой (объектом класса Form) на примере программы фотоальбома. Форма является определенного рода контейнером, ко­торый может содержать различные визуальные элементы, такие как текстовые строки, поля символьного ввода, картинки, меню выбора, шкалы.

С точки зрения объектов, элементы, которые можно добавить в форму, должны быть порождены одним из следующих классов: String, Image или Item. Элемент класса String представляет собой статическую строку, автоматически отформа­тированную согласно размерам экрана конкретного аппарата. Элемент класса Image представляет собой картинку. Фактически, оба этих элемента дублируются объек­тами классов, порожденных из класса Item.

Класс Item является базовым для целой группы элементов, которые могут быть добавлены в форму: Choi ceGroup (меню выбора), DateField (поле ввода даты и вре­мени), Gauge (шкала), Imageltem (изображение), Stringltem (статическая строка), TextField (поле ввода).

Внутренняя реализация формы скрыта от программиста, мы можем контролиро­вать лишь порядок отображения элементов. Расположение элементов на экране, навигация между элементами, вертикальная прокрутка экрана при необходимости контролируются внутренней реализацией и зависят от конкретной модели аппара­та. Работа с формой осуществляется с помощью следующих методов класса Form:


  • Form(String title) — конструктор; создает пустую форму с заголовком title;

  • FormCString title. Item[] items) — конструктор; создает форму с заголовком
    title, содержащую элементы массива items;

  • int append(Image img) — добавляет объект изображения img в форму, возвраща­
    ет индекс, присвоенный формой элементу;

  • int append(String str) — добавляет статическую строку str в форму, возвраща­
    ет индекс, присвоенный формой элементу;

  • int appendd tem item) — добавляет элемент item в форму, возвращает индекс,
    присвоенный формой элементу. Следует отметить, что один экземпляр эле­
    мента может быть добавлен лишь единожды и только в одну форму;

  • void delete(int itemNum) —удаляет из формы элемент с индексом itemNum. Ну­
    мерация элементов начинается с нуля;

  • Item get(int itemNum) — возвращает элемент формы с индексом itemNum, сама
    форма при этом остается неизменной;

  • void insertdnt itemNum. Item item) — вставляет в форму элемент item в пози­
    цию, заданную переменной itemNum;

  • void set(int itemNum. Item item) —заменяет в форме элемент с индексом itemNum
    на элемент item;

  • void setltemStateListenerdtemStateListener iListener) —задает блок прослуши­
    вания элемента 1 Li stener. Поскольку реализация элементов скрыта от нас, блок
    прослушивания элемента — это единственное средство контроля непосредствен­
    но во время ввода информации. Как только данные элемента изменяются пользо­
    вателем, который выбирает новый пункт меню или вводит очередной символ,

34 Глава 3. Пользовательский интерфейс высокого уровня

автоматически вызывается функция блока прослушивания itemStateChangecK Item item). Следует отметить, что функция вызовется только при изменении элемен­та пользователем. Если изменение происходит программно, то вызова не про­изойдет;

■ int size() — возвращает количество элементов в форме.

Все объекты иерархии класса Screen, в том числе и форма, обладают необязатель­ными заголовком и бегущей строкой. При создании формы в конструкторе мож­но указать заголовок отображаемого объекта, а можно оставить заголовок пус­тым, передав аргумент null. В процессе работы с формой можно получить ее заголовок с помощью метода String getTitle() и установить новый заголовок, ис­пользуя метод void setTitleCString s).

Бегущая строка представлена объектом класса Ticker. Текст бегущей строки пе­редается в конструкторе объекту класса. Поместить бегущую строку в отобража­емый объект можно с помощью метода void setTickerdicker ticker), получить объект бегущей строки — используя метод Ticker getTickerO . Программное ре­дактирование бегущей строки осуществляется с помощью методов класса Ticker:


  • void setStringCString str) —изменить текст бегущей строки;

  • String getStringO — получить текст бегущей строки.

Класс Display

Остановимся на вопросе, каким образом рассмотренные объекты отображаются на экране. Этим процессом руководит менеджер дисплея — объект класса Display. Он создается автоматически реализацией МШР при запуске мидлета и сохраняется до вызова функции destroyApp( ). Самим такой объект создать нельзя, зато можно получить ссылку на него с помощью метода getDi spl ay(MIDIet), который принимает в качестве аргумента ссылку на текущий мидлет. В языке Java, как и в C++, ссылка на текущий объект обозначается ключевым словом this.

Когда мы получили ссылку на Display, любой объект, наследованный из класса Di spl ауаЫ e, может быть выведен на экран с помощью метода setCurrent(Di spl ayabl e). Ввиду ограниченности ресурсов мобильных аппаратов одновременно на экране может быть отображен только один объект, перекрытие и наложение окон не под­держивается. Таким образом, любое приложение может быть рассмотрено как за­данная последовательность отображаемых объектов.

Во время отображения формы через менеджер дисплея обновление экрана про­исходит автоматически. Это значит, что при изменении содержания формы или ее элементов нет необходимости вызывать какие-либо дополнительные функции, так как изменения сразу будут отображены на экране. Это относится ко всем объек­там, порожденным классом Screen.



Отображаем картинку

Приведенной информации вполне достаточно, чтобы написать программу, ото­бражающую картинку на экране телефона. Заметим, что не все картинки одина-



Отображаем картинку 35

ково полезны. Во-первых, изображение должно быть в формате PNG (Portable Network Graphics). Во-вторых, размер картинки не должен превышать размера дисплея вашего аппарата. Если для работы над мидлетом выбран WTK (Wireless Toolkit), то после создания нового проекта картинка должна быть помещена в папку ресурсов приложения /res.

Структуру мидлетамы рассмотрели в прошлой главе. Помним, что основной класс мидлета должен быть наследован из абстрактного класса MIDI et. He забываем так­же о его функциях, обязательных к реализации.

Для того чтобы вывести картинку на экран, нам потребуется несколько объектов, которые будут объявлены как члены класса. Предварительно импортируем необ­ходимые библиотеки: import javax.microedition.lcdui.Form; import javax.microedition.lcdui. Image; import javax.microedition.lcdui. Display;

private Form form: // форма, отображаемая на экране

private Image image; // картинка для отображения

private Display display: // менеджер дисплея

Далее в функции startApp() реализуем следующие действия:



  • получим ссылку на менеджер дисплея;
    а создадим объект картинки;

  • создадим новую форму;

  • добавим картинку в форму;

  • отобразим форму на экране через менеджер дисплея.
    Код функции будет выглядеть следующим образом:

public void startAppO {

// получить ссылку на менеджер дисплея

display = Display.getDisplay(this): try {

// создать картинку из файла flower.png

image = Image.createlmage("/flower.png");

}

catch (IOException ioe) {



// обработать исключительную ситуацию.

// если файл не может быть открыт

System.out.println(ioe.getMessageC));

}

// создать новую форму



form - new FonnC'SlideShow"):

// добавить картинку в форму

form.append(image) ;

// вывести форму на экран

di splay. setCurrent(form):

36

Глава 3. Пользовательский интерфейс высокого у ровня




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

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



Класс Command

Итак, сейчас мы работаем с формой, относящейся к иерархии класса Displayable, который является ба­зовым для всех отображаемых объектов. Кроме стан­дартных визуальных средств интеракции, объекты, по­рожденные этим классом, поддерживают обработку событий, возникающих в результате действий пользо­вателя. К отображаемому объекту, в том числе и к фор­ме, могут быть привязаны различные команды, вызов которых приведет к некоторым действиям.



Рис. 3.2. Вывод картинки на экран телефона

Команды представлены объектами класса Command из пакета javax.microedition.lcdui. Создается коман­да с помощью конструктора: Command(String label ,int commandType.int priority), где:

  • 1abel — название команды для отображения ее на экране;

  • commandType — тип команды;

  • priority — приоритет команды.

Поскольку команды относятся к пользовательскому интерфейсу высокого уров­ня, то при создании команды мы не можем заранее связать ее с какой-то опреде­ленной клавишей телефона. Порядок вызова команды определит за нас реализа­ция MIDP, мы лишь можем высказать свои пожелания с помощью параметров типа команды и ее приоритета.

Тип команды задает внутреннее представление намеченного использования ко­манды. MIDP предусматривает следующие типы команд, определяемые констан­тами класса Command:



  • BACK — возврат к логически предыдущему экрану;

  • CANCEL — выбор отрицательного ответа в диалоге, реализуемом текущим экра­
    ном;

  • EXIT — выход из приложения;

  • HELP — вызов помощи или подсказки;

  • ITEM — команда имеет отношение к определенному элементу экрана;

Класс Command 37

  • OK — выбор положительного ответа в диалоге, реализуемом текущим экраном;

  • SCREEN — команда имеет отношение к отображаемому в настоящее время экрану;

  • STOP — остановка выполняемой в настоящее время операции.

Заметим, что константы задают лишь тип команды. Они не предписывают ни­каких действий. Смена экрана, выход из приложения и прочие действия не вы­полняются автоматически, они должны быть реализованы в соответствующем месте. Тип лишь ориентирует реализацию MI DP, как разместить команды на экране и организовать их вызов в соответствии с общим стилем меню и функци­ональными клавишами конкретной модели телефона.

Приоритет задает преимущество перед другими командами. Это влияет на поря­док отображения команд при объединении их в группу.' Приоритет задается це­лым числом. Наименьшее число означает наивысший приоритет.

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

После создания объекта команды необходимо добавить его в форму, которую мы собираемся отображать на экране. Методы добавления и удаления команд реали­зует класс Di splayable, то есть команды могут быть добавлены к любому отобра­жаемому объекту:



  • void addCommand(Command and) — добавляет команду and к отображаемому объек­
    ту. Будет ли команда привязана к функциональной клавише или объединена
    с другими командами в меню, зависит от реализации MIDP конкретного аппа­
    рата. Команда может быть добавлена в объект не более одного раза, но может
    быть включена одновременно в несколько объектов;

  • void removeCommand(Command and) —удаляет команду and из отображаемого объекта.

Для примера проведем эксперимент на эмуляторе Nokia. Добавим в форму четы­ре однотипных команды с разным приоритетом: Command cl = new CommandC'Commandr , Command.OK. 4): form.addCommand(cl):

Command c2 = new Command("Command2", Command.OK. 3); form.addCommand (c2):

Command c3 = new CommandСCommand3". Command.OK. 2); form.addCommand(c3);

Command c4 = new Command( "Command4" . Command.OK. 1); form.addCommand(c4): display.setCurrent(form);

В результате все команды объединились в меню Options, привязанное к левой функ­циональной клавише телефона, при нажатии на которую появился список наших команд. Это аппаратно реализованный список, позволяющий выбрать одну из команд клавишей Select или вернуться к предыдущему экрану клавишей Back (рис. 3.3).

38

Глава 3. Пользовательский интерфейс высокого уровня
















Yj zj]

HL

: ■ i'. ^Hl

i. M




I |Camniand4

I Commands 1 commandz

1 Command 2

■select Back!








. %n#




Рис. 3.3. Аппаратно реализованный список команд

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



Интерфейс CommandListener

Как уже было замечено, сам объект команды не предписывает программе выполнение каких-либо действий, он является лишь связующим зве­ном между исполнителем команды и формой. Приемником и исполнителем команды может яв­ляться любой объект, реализующий интерфейс CommandListener, который имеет всего лишь один метод: void commandAction(Command с. Displayable d). Этот метод нам нужно написать самим и реа­лизовать там связанные с командами действия. Метод corrmandActi on вызовется автоматически при выборе пользователем одной из команд, которая и будет передана в метод в качестве аргумента.

В нашем случае удобно сделать так, чтобы ос­новной класс мидлета содержал блок прослуши­вания команд в себе самом. В общем случае блок может содержаться в любом объекте. Таким об­разом, основной класс мидлета будет расширять класс MIDIet и одновременно реализовывать ин­терфейс CommandListener:


public class SlideShow extends MIDlet implements CommandListener

Приемник команд, как и сами команды, должен быть привязан к объекту типа Displayable, в нашем случае это форма. В каждый момент времени отобража­емый объект может иметь только один приемник. Связь приемника команд с отображаемым объектом осуществляется с помощью метода класса Di splayable: void setCommandListener(CommandListener I ). В нашем случае, когда основной класс мидлета реализует блок прослушивания команд, в качестве аргумента переда­ется ссылка на главный объект. Так же как и в случае с менеджером дисплея, мы опять воспользуемся ключевым словом this.

Теперь у нас есть все необходимые средства для реализации полноценного фото­альбома. Подготовим картинки для фотоальбома, учитывая размер экрана и мак­симальный объем приложения вашей модели телефона. Назовем картинки, кото­рые мы хотим демонстрировать, так: l.png, 2.png и т. д. — и разместим их в папке / res. Заодно добавим два члена класса SlideShow: int slideNum и int maxSlideNum,


Интерфейс CommandListener 39

которые будут содержать текущий номер картинки и общее количество картинок соответственно.

Далее реализуем обработку команд и добавим логику для смены картинок на эк­ране при нажатии клавиш. В конечном итоге программа полноценного фотоаль­бома будет выглядеть следующим образом:

import javax.microedit ion. midlet.MIDl et:

import javax.microedition.lcdui.Display;

import javax.microedition.lcdui.Form:

import javax.microedition.lcdui .Command;

import javax.microedit ion. lcdui.CommandListener;

import javax.microedition.lcdui.Displayable:

import javax.microedition.lcdui. Image;

import javax.mi croedit ion, kdui .Ticker;

import java.io.IOException:

public class SlideShow extends MIDlet implements CommandListener

{

private Display display: // менеджер дисплея



private Form form; // отображаемая форма

private Command next: // команда перехода к следующей картинке

private Coircnand back; // команда перехода к предыдущей картинке

private Image image: // объект картинки

private 1nt 5l1deNum-l; // номер текущей картинки

private int maxSTideNum-5: // общее количество картинок

public void startAppO

{ // получить ссылку на менеджер дисплея

display - Display. getDisplay(this):

// создать новую форму без заголовка

form = new Form(null );

// установить приемник команд для формы

form.setCommandListener(this):

// создать команду перехода к следующей картинке

next = new Command("Next". Command.OK, 1);

il добавить команду в форму

form.addCommandСnext) :

// создать команду возврата к предыдущей картинке

back • new CommandC 'Back", Command.BACK. 1):

// добавить команду в форму

form.addCommand(back):

// создать объект бегущей строки

Ticker t • new TickerC'My Photoalbum"):

// добавить бегущую строку в форму

form.setTicker(t);

// добавить в форму первую картинку

setlmageC'/l.png"):



40 Глава 3. Пользовательский интерфейс высокого уровня

// отобразить форму на экране di splay.setCurrent(form);

}

// метод обработки команд // реализует действия, предписанные командами public void commandAction(Command c. Displayable d) { // команда перехода к следующей картинке. // если текущая картинка не последняя if (с ~ next && sIideNum

// команда возврата к предыдущей картинке. // если текущая картинка не первая if (с — back &a slideNunpl)

// увеличить номер текущей картинки slideNimi--:

// удалить из формы текущую картинку form.delete(O):

// получить имя файла картинки из ее номера // и добавить полученную картинку в форму setImage("/"+Integer.toString(s1ideNum)+".png"):

// функция setlmage принимает имя файла картинки, // создает объект картинки и добавляет в форму public void setImage(String path)

I

try {



// создать картинку из файла, переданного в аргументе image = Image.createlmage(path);

}

// обработать исключительную ситуацию, // если файл не может быть открыт catch (IOException ioe) {



System.out.println(ioe.getMessage()):

}

// добавить картинку в форму form.append(image):



Отметим, что для смены изображения на экране мы лишь помещаем новую кар­тинку в отображаемую на экране форму, после чего картинка сразу появляется на экране (рис. 3.4). Заметим, что в данном эмуляторе изображение не поместилось на экране, поэтому реализация организовала вертикальную прокрутку экрана,

Интерфейс CommandListener

41







обозначенную стрелочкой вниз. Горизонтальная про­крутка экрана в реализациях, как правило, отсутствует.

Поздравляю! Если вы не поленились оторваться от книжки и реализовать вышеописанное, то загрузите по­лучившийся мидлет в телефон, и вы будете всегда иметь под рукой маленький фотоальбом. Можно пойти даль­ше и добавить нехитрую логику перехода к первой кар­тинке после демонстрации последней и наоборот.

К сожалению, стандартная реализация J2ME не под­держивает доступ к внутренним параметрам телефона, к записной книжке или экранной заставке, поэтому, в общем случае, установить отображаемую картинку в качестве фона-заставки телефона программно мы не можем. Но не стоит отчаиваться, потому что подобная функция может быть реализована производителем ап­парата в специализированном пакете функций API. На некоторых таких пакетах подробнее мы остановимся в одной из заключительных глав.


Рис. 3.4. Окончательный вид фотоальбома

С картинками нужно быть аккуратными, ведь многие модели телефонов накладывают серьезные ограниче­ния на размер приложения, а картинки в этом плане очень ресурсоемки. Здесь придется искать оптималь­ное соотношение параметров цена и качество: платим в данном случае мы объемом памяти, занимаемым кар­тинкой. Именно поэтому оптимизацию мидлетов на­чинают с оптимизации картинок, различными средства­ми стараясь уменьшить занимаемый ими объем памяти.

На сегодняшний день существует масса различных средств для обработки карти­нок, от классического PhotoShop до специализированных ImageOptimizer, кото­рые порой дают лучшие результаты в плане оптимизации, чем монстры дизайна. Часто производители телефонов предлагают свои средства для редактирования и оптимизации изображений. Например, Nokia PC Suite содержит свой замеча­тельный Nokia Image Converter.

• • *

Итак, основа проектирования любого приложения — создание структуры демон­стрирования различных отображаемых объектов и реализация логики перехо­дов между этими объектами. Логику переходов можно организовать с помощью пользовательского интерфейса высокого уровня, который мы рассмотрели в этой главе. Для этого нужно спроектировать отображаемые объекты, добавить к ним требуемые команды и реализовать интерфейс прослушивания и исполнения ко­манд. Приложения, организованные таким образом, более транспортабельны и могут быть перенесены на различные модели телефонов. Пользовательский интерфейс низкого уровня мы рассмотрим в следующей главе.




Каталог: Техника -> Информационные%20технологии
Информационные%20технологии -> Методические рекомендации по построению систем защиты узлов интернет 1 требования к системе защиты узла интернет 2
Техника -> Учебная программа для специальности: 1-23 01 73 Средства массовой информации
Техника -> Ремонт китайских телефонов
Техника -> Для профилактики и лечения насморка Зачем промывать нос во время насморка?
Техника -> Учебная программа для специальности: 1-23 01 73 Средства массовой информации


Поделитесь с Вашими друзьями:
1   2   3   4   5   6   7   8   9   ...   15


База данных защищена авторским правом ©vossta.ru 2019
обратиться к администрации

    Главная страница