Arquitetura de APIs Gráficas do JavaDTV LWUIT e DTV-UI

Erisvaldo Gadelha Saraiva Júnior

Arquitetura de APIs Gráficas do JavaDTV

LWUIT e DTV-UI

Erisvaldo Gadelha Saraiva Júnior Laboratório de Aplicações de Vídeo Digital Departamento de Informática - UFPB Contato: erisvaldojunior@gmail.com

Or

ganiz

e

wi

th S

ect

io

ns

Expor a arquitetura de APIs Gráficas do JavaDTV: LWUIT e DTV-UI.

Imagens de telas confeccionadas com o LWUIT rodando em dispositivos móveis.

Roteiro

de Apresentação

Arquitetura de APIs Gráficas do JavaDTV: LWUIT e DTV-UI

APIs Gráficas do JavaDTV A API Gráfica LWUIT A API Gráfica DTV-UI

APIs Gráficas do

JavaDTV

Ar

quit

etur

a

do

Ging

a-J

Inicialmente, pensou-se em adotar o GEM, especificação européia composta pelas APIs JavaTV, DAVIC, HAVi e DVB.

Ar

quit

etur

a

do

Ging

a-J

Posteriormente, substituiu-se o GEM pelo JavaDTV, especificação da Sun (em parceria com o Fórum brasileiro de TV Digital) composta pelas APIs JavaTV, Transport, LWUIT e App.

Ar

quit

etur

a

do

Ging

a-J

Ar

quit

etur

a

do

Ging

a-J

Ar

quit

etur

a

do

Ging

a-J

permitem acesso genérico aos planos (exceto o plano de subtítulos) oferecidos pela plataforma para exibir conteúdo.

A API Gráfica

LWUIT

Introdução ao

LWUIT

LWUIT é uma biblioteca

baseada no Swing que

permite criar GUIs bastante atraentes em dispositivos que

rodam as seguintes

plataformas: JavaME (CLDC 1.1, MIDP 2.0 / CDC, FP e PBP) ou JavaSE.

LWUIT oferece, entre outros recursos: suporte a Touch Screen, animações, botões, fontes, transições de telas, temas, layouts, abas, caixas de diálogo, integração 3D, etc.

Introdução ao

LWUIT

Cada componente visual do LWUIT possui uma série de

propriedades, tais como:

focusable, navigable e able to receive user inputs.

Além disso, cada

componente visual do

LWUIT está associado a dois

componentes: um

relacionado a presentation

(look) e outro relacionado a behavior (feel). Dessa forma,

separa-se funcionalidade de visão.

LWUIT tem uma clara

separação entre model,

view e controller;

Por ser inspirado no Swing, é fácil de aprender e adotar;

LWUIT foi construído “do

zero” e não depende do AWT.

No LWUIT, tudo é customizável e extensível. Caso não exista um recurso ou componente, pode-se criá-lo e facilmente integrá-lo ao LWUIT.

Container é um Component

responsável por armazenar vários componentes através do método

addComponent(…).

Cada Container tem o seu próprio layout.

Form é um Container que serve como

raiz para a interface do usuário.

O Form é composto por Title,

ContentPane e MenuBar.

ALARM; CONFIRMATION; ERROR; INFO; WARNING.

Dialog é um Form que ocupa

uma parte da tela; Dialog é, também, um “Top Component”;

Um Dialog pode ser modal ou

modeless;

Possui os métodos show() e

dispose();

Pode ser criado de duas formas: // Fábrica (método estático) Dialog.show(…);

// Criar um novo objeto

Dialog d = new Dialog(); d.show();

Tipos de Dialog

TabbedPane é um container de abas

com títulos. Imagens também pode ser usadas como abas.

As abas podem ser dispostas em qualquer lado: cabeçalho, rodapé, esquerda ou direita.

Passa-se um componente para o método addTab() e especifica-se o título da aba ou imagem.

Um Label pode conter: • Texto; • Imagem; • Texto e Imagem; • Alinhamento Horizontal; • Alinhamento Vertical.

Label

Características de um Button:

• Herda de Label;

• Pode receber foco (focusable); • Usa-se a tecla de seleção ou

ponteiro para clicá-lo;

• Usa-se um ActionListener para descobrir quando o botão foi clicado.

Características de um RadioButton:

• Herda de Button;

• Possui um estado booleano; • Não faz muito por si só, deve

ser agrupado com

ButtonGroup.

Características de um CheckBox:

• Herda de Button;

• Possui um estado booleano; • Verifica-se a seleção do

mesmo através do método

isSelected().

Características de um TextArea:

• Especifica linhas e colunas; • Mostra o texto na tela;

• TextArea de múltiplas linhas podem aumentar de tamanho caso seja necessário;

• Constraints: ANY, DECIMAL, EMAILADDR,

INITIAL_CAPS_SENTENCE, INITIAL_CAPS_WORD,

NON_PREDICTIVE, NUMERIC, PASSWORD, PHONENUMBER, SENSITIVE, UNEDITABLE, URL.

TextArea

Características de um TextField:

• Herda de TextArea;

• Representa um campo de texto (uma única linha).

TextField

• Crucial para aplicações interativas;

• Modelo de separação MVC

(ListModel, ListCellRenderer e

ListEvents, respectivamente);

• Repleto de modos úteis: • FIXED_NONE; • FIXED_NONE_CYCLIC; • FIXED_NONE_ONE_ELEM_ MARGIN_FROM_EDGE; • FIXED_LEAD; • FIXED_TRAIL; • FIXED_CENTER.

List

Representa a estrutura de dados de um

List.

• Crie a sua própria classe de modelo implementando a interface ListModel;

• Lance eventos de mudança de dados para a visão;

• O modelo permite que a lista

mostre uma quantidade

ilimitada de dados;

• List tem um modelo padrão, o

DefaultModel.

Interface responsável por exibir os dados do modelo.

• List tem um modelo padrão, o

DefaultListCellRenderer.

Quanto aos EVENTOS de List, podem ser de três tipos: • Action Events; • Selection Events; • Data Events.

ListEvents

Características de um ComboBox:

• É um tipo de List • Tem um model;

• Pode usar um cell renderer

customizado.

• Mostra a seleção atual; • Abre uma lista de opções.

ComboBox

1. Coleção de atributos de estilo; 2. Declaros no arquivo .RES:

1. Temas; 2. Fontes; 3. Imagens; 4. Animações;

5. Localização (L10N).

A API Gráfica

DTV-UI

Introdução a

DTV-UI

DTV-UI, representada

pelo pacote

com.sun.dtv.ui, como o

próprio nome diz, traz funcionalidades

específicas para

interfaces em TV Digital.

DTV-UI oferece acesso a

tela e configurações, dispositivos específicos de entrada do usuário e o TextLayout Manager. Além disso, suporta os diversos planos de tela do dispositivo.

Graphic Plane Support API

DTV-UI (com.sun.dtv.ui) permite acesso genérico aos planos (br.org.sbtvd.ui), oferecidos pela plataforma para exibição de conteúdo.

Cinco planos: Video,

StillPicture,

Switching Plane,

Text and Graphics Plane, Subtitle Plane.

Graphic Plane Support API

A Graphic Plane Support API define três classes adicionais para as APIs de Interface do JavaDTV: ColorCoding, StillPicture e SwitchArea.

» ColorCoding possui constantes para enumerar os possíveis modelos de

codificação para cada plano;

» StillPicture permite que imagens JPEG sejam inseridas no plano estático de

imagens;

» SwitchArea é um componente que define uma área retangular para o plano

de seleção de vídeo/imagem. Cada retângulo pode ser adicionado através do método addComponent(…) de com.sun.dtv.lwuit.Component, no qual o plano de imagens estáticas aparecerá sobre o plano de vídeo ou vice-versa, dependendo do estilo (cor) do componente (preto mostra o vídeo e branco mostra a imagem estática).

DTV-UI

aspect ratio, screen resolution e screen area. Suporta diferentes ratios e screen sizes, bem como alpha blending e alternância de camadas entre vídeo e

imagem.

Recomenda-se que a configuração seja obtida como um ScarceResource, sendo usado por uma única aplicação por vez.

DTV-UI

agrupados pelo tipo: numerical keys, arrow keys, colored keys. Essas classes definem funcionalidades para o layout dos textos e sua

renderização na tela.

DTV-UI

DefaultTextLayoutManager e

SophisticatedTextLayoutManager. Essas classes definem

funcionalidades para o layout dos textos e sua renderização na tela.

LAYOUT MANAGERS

Similar ao Swing. Seis gerenciadores de

layout são suportados

(com.sun.dtv.lwuit.layouts): • BorderLayout; • BoxLayout; • FlowLayout; • GridLayout; • CoordinateLayout; • GroupLayout.

Exemplo de uso de

Referências http://java.sun.com/javame/technology/lwuit/ http://java.sun.com/javame/technology/javatv/ http://www.forumsbtvd.org.br http://www.ginga.org.br http://javatv-developers.dev.java.net/ http://www.interactivetvweb.org/ http://gingacdn.lavid.ufpb.br/

?

Dúvidas

?

What’s Your Message?

OBRIGADO!