1. O documento descreve as arquiteturas das APIs Gráficas do JavaDTV, LWUIT e DTV-UI.
2. LWUIT é uma biblioteca baseada no Swing que permite criar interfaces gráficas atraentes em dispositivos móveis e JavaME. DTV-UI fornece funcionalidades específicas para interfaces em TV digital.
3. As APIs permitem acesso aos planos gráficos da plataforma para exibição de conteúdo e fornecem componentes visuais, gerenciamento de eventos e layout
Arquitetura De Ap Is GráFicas Do Java Dtv Lwuit E Dtv Ui
1. 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
2. Objetivo
Expor a arquitetura de APIs Gráficas do JavaDTV: LWUIT e DTV-UI.
Organize with Sections
Imagens de telas
confeccionadas com o
LWUIT rodando em
dispositivos móveis.
3. Roteiro de Apresentação
APIs Gráficas A API Gráfica A API Gráfica
do JavaDTV LWUIT DTV-UI
Arquitetura de APIs Gráficas do JavaDTV: LWUIT e DTV-UI
4. APIs Gráficas do JavaDTV
Descrição arquitetural das APIs Gráficas do JavaDTV
7. Cenário A do Ginga-J
Inicialmente, pensou-se em adotar o GEM, especificação
européia composta pelas APIs JavaTV, DAVIC, HAVi e DVB.
Arquitetura do Ginga-J
8. Cenário B do Ginga-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.
Arquitetura do Ginga-J
11. Extensões do Ginga-J
Arquitetura do Ginga-J
Os pacotes do JavaDTV
permitem acesso genérico aos
planos (exceto o plano de
subtítulos) oferecidos pela
plataforma para exibir conteúdo.
12. A API Gráfica LWUIT
Descrição arquitetural da API Gráfica LWUIT, parte integrante do JavaDTV
14. Introdução ao LWUIT
LWUIT é uma biblioteca
LWUIT oferece, entre outros
baseada no Swing que
recursos: suporte a Touch
permite criar GUIs bastante
Screen, animações, botões,
atraentes em dispositivos que
fontes, transições de telas,
rodam as seguintes
temas, layouts, abas, caixas
plataformas: JavaME (CLDC
de diálogo, integração 3D,
1.1, MIDP 2.0 / CDC, FP e
etc.
PBP) ou JavaSE.
15. Introdução ao LWUIT
Cada componente visual do
LWUIT possui uma série de
Além disso, cada
propriedades, tais como:
componente visual do
focusable, navigable e able to
LWUIT está associado a dois
receive user inputs.
componentes: um
relacionado a presentation
(look) e outro relacionado a
behavior (feel). Dessa forma,
separa-se funcionalidade de
visão.
16. LWUIT e a Arquitetura MVC
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.
18. Container
Container é um Component
responsável por armazenar vários
componentes através do método
addComponent(…).
Cada Container tem o seu próprio
layout.
19. Form
Form é um Container que serve como
raiz para a interface do usuário.
O Form é composto por Title,
ContentPane e MenuBar.
20. Dialog
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)
Tipos de Dialog Dialog.show(…);
// Criar um novo objeto
ALARM; CONFIRMATION; Dialog d = new Dialog();
ERROR; INFO; WARNING. d.show();
23. TabbedPane
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.
25. Label
Um Label pode conter:
• Texto;
• Imagem;
• Texto e Imagem;
• Alinhamento Horizontal;
• Alinhamento Vertical.
26. Button
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.
27. RadioButton
Características de um RadioButton:
• Herda de Button;
• Possui um estado booleano;
• Não faz muito por si só, deve
ser agrupado com
ButtonGroup.
28. CheckBox
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().
29. TextArea
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.
31. List
• 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.
32. ListModel
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.
35. ComboBox
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.
38. 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).
3. O tema pode ser substituído em tempo real.
41. A API Gráfica DTV-UI
Descrição arquitetural da API Gráfica DTV-UI, parte integrante do JavaDTV
42. Introdução a DTV-UI
DTV-UI oferece acesso a
DTV-UI, representada
tela e configurações,
pelo pacote
dispositivos específicos
com.sun.dtv.ui, como o
de entrada do usuário e
próprio nome diz, traz
o TextLayout Manager.
funcionalidades
Além disso, suporta os
específicas para
diversos planos de tela
interfaces em TV Digital.
do dispositivo.
43. 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.
44. 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).
51. CONFIGURAÇÕES DE TELA
DTV-UI provê caminhos para controlar qualquer camada da sua
apresentação visual. Para cada camada, é possível obter: aspect ratio, pixel
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.
52. TRATAMENTO GERAL DE EVENTOS
DTV-UI provê acesso a eventos de entradas do usuário antes
deles serem processados pelo mecanismo de alto nível de tratamento
de eventos do Java. Os eventos de entradas do usuário são
agrupados pelo tipo: numerical keys, arrow keys, colored keys. Essas
classes definem funcionalidades para o layout dos textos e sua
renderização na tela.
55. LAYOUT MANAGERS
Similar ao Swing. Seis
gerenciadores de
layout são suportados
DTV-UI possui a interface TextLayoutManager e (com.sun.dtv.lwuit.layouts):
duas implementações de layout: • BorderLayout;
DefaultTextLayoutManager e • BoxLayout;
SophisticatedTextLayoutManager. Essas classes definem • FlowLayout;
funcionalidades para o layout dos textos e sua renderização • GridLayout;
na tela. • CoordinateLayout;
• GroupLayout.