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

Tamanho: px

Começar a partir da página:

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

Ana Sofia Leão Capistrano
8 Há anos
Visualizações:

Saraiva Júnior Laboratório de Aplicações de Vídeo Digital

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 Organize with Sections Objetivo 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.

3 Roteiro de Apresentação APIs Gráficas do JavaDTV A API Gráfica LWUIT A API Gráfica 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

5 Arquitetura da plataforma Java (destacando o JavaME)

6 Arquitetura da plataforma JavaME

7 Arquitetura do Ginga-J 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.

8 Arquitetura do Ginga-J 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.

9 Arquitetura do Ginga-J APIs do JavaDTV

10 Arquitetura do Ginga-J Pacotes do JavaDTV 1.2.1

11 Arquitetura do Ginga-J Extensões 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

13 A API Gráfica LCDUI

14 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.

15 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.

Além disso, cada componente visual do LWUIT está associado a dois componentes: um

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.

construído do zero e não depende do AWT.

17 Pacote com.sun.dtv.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: Tipos de Dialog ALARM; CONFIRMATION; ERROR; INFO; WARNING. // Fábrica (método estático) Dialog.show( ); // Criar um novo objeto Dialog d = new Dialog(); d.show();

criado de duas formas: Tipos de Dialog ALARM; CONFIRMATION; ERROR; INFO; WARNING.

21 Dialog (Exemplo)

22 Dialog (Exemplo)

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.

24 Pacote com.sun.dtv.lwuit

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, ADDR, INITIAL_CAPS_SENTENCE, INITIAL_CAPS_WORD, NON_PREDICTIVE, NUMERIC, PASSWORD, PHONENUMBER, SENSITIVE, UNEDITABLE, URL.

30 TextField Características de um TextField: Herda de TextArea; Representa um campo de texto (uma única linha).

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.

33 ListCellRenderer Interface responsável por exibir os dados do modelo. List tem um modelo padrão, o DefaultListCellRenderer.

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

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.

36 List (Exemplo)

37 List (Exemplo)

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.

39 Classes do pacote com.sun.dtv.lwuit

40 Pacotes e classes de LWUIT

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, 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.

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).

45 Modelo Gráfico do JavaDTV

46 Hierarquia de Componentes JavaDTV

47 Exemplo com DTV-UI (Parte 1/4)

48 Exemplo com DTV-UI (Parte 2/4)

49 Exemplo com DTV-UI (Parte 3/4)

50 Exemplo com DTV-UI (Parte 4/4)

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.

53 Classes do pacote com.sun.dtv.ui.event

54 Classes do pacote com.sun.dtv.ui.event

55 LAYOUT MANAGERS DTV-UI possui a interface TextLayoutManager e duas implementações de layout: DefaultTextLayoutManager e SophisticatedTextLayoutManager. Essas classes definem funcionalidades para o layout dos textos e sua renderização na tela. Similar ao Swing. Seis gerenciadores de layout são suportados (com.sun.dtv.lwuit.layouts): BorderLayout; BoxLayout; FlowLayout; GridLayout; CoordinateLayout; GroupLayout.

56 Exemplo de uso de Layout Managers

58 Classes do pacote com.sun.dtv.ui

59 Pacote com.sun.dtv.ui

60 Pacote com.sun.dtv.ui

61 Pacote com.sun.dtv.ui

62 Pacotes e classes de DTV-UI

63 Referências

64 ? Dúvidas? Questionamentos sobre LWUIT e DTV-UI

65 What s Your Message? OBRIGADO!

Documentos relacionados

Programação Orientada a Objetos II

Programação Orientada a Objetos II Interfaces Márcio Alves de Macêdo Baseado no material de: ime.usp Cronograma Pacotes gráficos da linguagem Java Container AWT Component AWT Pacotes gráficos A linguagem