8/2/2019 Interface Grfica do Usurio Aula 8 - Desenvolvimento de Interfaces

1/17

INTERFACE GRFICA DOUSURIO AULA 8

Desenvolvimento de Interfaces

Prof. Jemerson Fernando Maia

04/2012

8/2/2019 Interface Grfica do Usurio Aula 8 - Desenvolvimento de Interfaces

2/17

Introduo

Uma GUI, do ingls Graphical User Interface, ouinterface grfica do usurio, um tipo de interface dousurio que permite a interao com dispositivosdigitais atravs de elementos grficos como cones eoutros indicadores visuais.

Apresenta um mecanismo amigvel ao usurio parainteragir com uma aplicao;

Sendo consistente permite que o usurio sefamiliarize mais rapidamente com ela, e portanto,

possa utiliz-la mais produtivamente; Freqentemente contm barra de ttulo, barra de

menus que contm menus, botes e caixas decombinao;

8/2/2019 Interface Grfica do Usurio Aula 8 - Desenvolvimento de Interfaces

3/17

Introduo

8/2/2019 Interface Grfica do Usurio Aula 8 - Desenvolvimento de Interfaces

4/17

Introduo

A interao feita geralmente atravs de ummouse ou um teclado, com os quais o usurio capaz de selecionar smbolos e manipul-

los de forma a obter algum resultado prtico.Esses smbolos so designados decomponentes grficos.

8/2/2019 Interface Grfica do Usurio Aula 8 - Desenvolvimento de Interfaces

5/17

Componentes Grficos

Componentes grficos podem ser janelas, botes,menus, cones, barras de rolagem, etc.

A "conversa" entre os diversos componentesgrficos usualmente feita de forma indireta.Componentes grficos disparam mensagensindicando as aes executadas sobre ele, e estasmensagens podem ser recebidas pelos outroscomponentes grficos para efetuar as aes

desejadas. Em Java, utiliza o toolkit Java/Swing como

fornecedor de componentes grficos.

8/2/2019 Interface Grfica do Usurio Aula 8 - Desenvolvimento de Interfaces

6/17

8/2/2019 Interface Grfica do Usurio Aula 8 - Desenvolvimento de Interfaces

7/17

Componentes Grficos

Segue uma lista dos principais componentesgrficos utilizados:Containers (componentes que podem conter

outros componentes)Window (janelas)

Modal Window (janela modal) Dialog Box (caixa de dilogo)

8/2/2019 Interface Grfica do Usurio Aula 8 - Desenvolvimento de Interfaces

8/17

Componentes Grficos

Sada Label (texto esttico) Tooltip (dicas)

Status Bar (barra de status) Progress Bar (barra de progresso)

8/2/2019 Interface Grfica do Usurio Aula 8 - Desenvolvimento de Interfaces

9/17

Componentes Grficos

Entrada de texto Text Box (caixa de texto) Combo Box (caixa de seleo)

Text Area (rea de texto)

8/2/2019 Interface Grfica do Usurio Aula 8 - Desenvolvimento de Interfaces

10/17

Componentes Grficos

Seleo Button (botes)

Check Box (caixa de marcao, seleo mltipla) Radio Button (boto de marcao, seleo nica)

List Box (caixa com lista)

8/2/2019 Interface Grfica do Usurio Aula 8 - Desenvolvimento de Interfaces

11/17

Componentes Grficos

SeleoMenu Bar (barra de menu)Menu

Menu Item (item de menu)

Tool Bar (barra de ferramentas)

8/2/2019 Interface Grfica do Usurio Aula 8 - Desenvolvimento de Interfaces

12/17

Componentes Grficos

Seleo e exibio Icon (cone) TreeVview (rvore)

Grid View (tabela)

8/2/2019 Interface Grfica do Usurio Aula 8 - Desenvolvimento de Interfaces

13/17

Componentes Grficos

Navigao Tab Page (guias de pginas) Scroll Bar (barra de rolagem)

8/2/2019 Interface Grfica do Usurio Aula 8 - Desenvolvimento de Interfaces

14/17

Exerccios

Identificar quais componentes grficos compemas interfaces de sistemas abaixo:

8/2/2019 Interface Grfica do Usurio Aula 8 - Desenvolvimento de Interfaces

15/17

Exerccios

8/2/2019 Interface Grfica do Usurio Aula 8 - Desenvolvimento de Interfaces

16/17

Exerccios

8/2/2019 Interface Grfica do Usurio Aula 8 - Desenvolvimento de Interfaces

17/17

Exerccios

Desenhe uma interface sendo composta por: Uma janela;

Uma barra de menu na janela; Um menu com texto Configurar na barra de menu; Um item de menu com texto Impressora no menuConfigurar

Uma barra de ferramentas na janela Um boto com o texto Salvar e um cone de um

disquete na barra de ferramentas Um boto com o texto Enviar e com um cone de

uma carta na barra de ferramentas Um texto esttico com o valor Mensagem: Uma rea de texto

Uma barra de progresso