GUI

(1)

CEA032 – P

ROGRAMAÇÃO DE

C

OMPUTADORES

II

GUI - Graphical User Interface

(2)

A

GENDA

Introdução à Interface Gráfica

JTextField

Eventos

Universidade Federal de Ouro Preto Campus João Monlevade

Instituto de Ciências Exatas e Aplicadas

(3)

I

NTRODUÇÃO

GUI dá ao aplicativo aparência e comportamento distintos.

Interface gráfica é a melhor maneira de fazer com que o

usuário se familiarize com a aplicação (Interfaces

consistentes com o usuário permitem que ele aprenda

mais rápido novos aplicativos)

Elementos de interface gráfica

Botões

Checkbox

Caixas de Texto

Barra de Títulos

Labels

(4)

I

NTRODUÇÃO

Apenas Entrada e Saída com JOptionPane não é suficiente

para construir interfaces gráficas mais elaboradas

.

(5)

I

NTRODUÇÃO

Alguns componentes GUI básicos

(6)

I

NTRODUÇÃO

Dois conjuntos de componentes GUI em Java

AWT segue o padrão dos elementos de interface gráfica

do sistema operacional

Vinculados à plataforma local (pesados)

Swing permite especificar uniformemente a aparência e o

comportamento para o aplicativo em todas as plataformas

A maioria não são vinculados à plataforma local (leves)

Para a maioria dos componentes Swing existem componentes

AWT similares

(7)

I

NTRODUÇÃO

Hierarquia da maioria dos componentes Swing

(8)

I

NTRODUÇÃO

Component (java.awt) – declara muitos atributos e

comportamentos s comuns aos componentes GUI. Maioria

dos componentes GUI estende a classe Component direta

ou indiretamente.

Container (java.awt) – subclasse de Component.

Componentes são adicionados a containers (como

janelas). Utilizados para exibir e organizar os elementos

na tela. Como Container é um componente podem ser

adicionados Containers dentro de Containers em uma

hierarquia.

(9)

I

NTRODUÇÃO

JComponent (javax.swing) – subclasse de Container. É a

superclasse de todos os componentes leves swing e

declara métodos e atributos comuns. Recursos comuns

suportados por JComponent:

1 – Teclas de atalho

2 – Tratamento de Eventos

3 – Suporte a localização

(10)

F

RAMEWORK PARA CONSTRUIR APLICAÇÃO COM

I

NTERFACE

G

RÁFICA

Tela que utiliza Labels (exibe texto somente leitura)

(11)

F

RAMEWORK PARA CONSTRUIR APLICAÇÃO COM

I

NTERFACE

G

RÁFICA

(12)

F

RAMEWORK PARA CONSTRUIR APLICAÇÃO COM

I

NTERFACE

G

RÁFICA

Comentários sobre o código

FlowLayout: os elementos são sempre colocados em um

container da direita para a esquerda na ordem em que são

adicionados ao container. Quando não houver mais espaço

para ajustar componentes da esquerda para a direita para a

esquerda, eles continuam a aparecer da esquerda a parente

na próxima linha. Se o container for redimensionado, um

FlowLayout reorganiza os componentes para se acomodar à

nova largura do container, possivelmente com mais ou

(13)

F

RAMEWORK PARA CONSTRUIR APLICAÇÃO COM

I

NTERFACE

G

RÁFICA

Comentários sobre o código

setLayout : herdado indiretamente da classe Container (Um

objeto que implementa a interface LayoutManager)

setTootTipText: herdado de JComponent – dica

Icon: interface – ImageIcon implementa esta interface

(14)

F

RAMEWORK PARA CONSTRUIR APLICAÇÃO COM

I

NTERFACE

G

RÁFICA

(15)

F

RAMEWORK PARA CONSTRUIR APLICAÇÃO COM

I

NTERFACE

G

RÁFICA

Resultado

(16)

F

RAMEWORK PARA CONSTRUIR APLICAÇÃO COM

I

NTERFACE

G

RÁFICA

SwingConstants

(17)

JT

EXT

F

IELD

Elemento para entrada de dados

Permite a inserção de textos

Uma área de uma única linha em que o usuário pode inserir

texto pelo teclado

Extensão:

JPasswordField: herda JTextField e tem novas funcionalidades de

senha

(18)

JT

EXT

F

IELD

– E

XEMPLO

(19)

JT

EXT

F

IELD

– E

XEMPLO

(20)

JT

EXT

F

IELD

– E

XEMPLO

(21)

JT

EXT

F

IELD

– E

XEMPLO

(22)

JT

EXT

F

IELD

- E

XEMPLO

(23)

E

VENTOS

Como interagir com as aplicações?

As interfaces gráficas são baseadas em eventos

(24)

E

VENTOS

(25)

E

VENTOS

(26)

E

VENTOS

(27)

E

VENTOS

Tratamento de Eventos

O evento ocorreu

Alguém tem que capturar esse evento

Alguma ação deve ser tomada em virtude do recebimento do

(28)

T

RATAMENTO DE

E

VENTOS EM

J

AVA

Passos necessários para tratar eventos em GUI:

1 - Crie uma classe que será o tratador do evento

2 - Implemente nessa classe o listener do evento

3 - Registre esse evento no objeto em que se deseja tratar

(29)

T

RATAMENTO DE

E

VENTOS EM JAVA

Passo 1 – Crie uma classe que será o tratador do evento

(30)

T

RATAMENTO DE

E

VENTOS EM JAVA

Passo 2 – Implemente nessa classe o listener do

evento

No caso o listener é o ActionListener

ActionEvent –

gerado quando

ocorre alguma

ação no objeto

(Botão por

exemplo)

(31)

T

RATAMENTO DE

E

VENTOS EM JAVA

Passo 3 – Registre esse evento no objeto em que

se deseja tratar os eventos

(32)

T

RATAMENTO DE

E

VENTOS EM

J

AVA

buttonOk

(33)

F

UNCIONAMENTO DO

E

VENTO

(34)

F

UNCIONAMENTO DO

E

VENTO

(35)

F

UNCIONAMENTO DO

E

VENTO

Como o botão OK (buttonOk) registrou o tratador de

eventos (ButtonHandler bh) ele tem como receber o

evento gerado

(36)

F

UNCIONAMENTO DO

E

VENTO

Código que será executado ao clicar no

botão OK

(37)

T

IPOS

C

OMUNS DE

E

VENTOS

(38)

Interfaces de Listener