05/11/2008

Java Avançado

Interface Gráfica
Prof. Jucimar Souza
jucibs@gmail.com

Objetivos

Entender como utilizar as interface gráficas do Java

Swing

AWT

Criação de formulário e inserir componentes visuais nos
mesmos

Programação de Eventos

Gerenciamento básico de Layout

Uso do NetBeans com a Interface Gráfica

1
 05/11/2008

01 – Interfaces Gráficas no Java

Atualmente Java suporta duas bibliotecas gráficas

GUI – Graphical Unit Interface

AWT (Abstract Window Toolkit)

Precursor do Swing

Declarado no pacote java.awt

Swing

Componentes feitos em Java

São chamados de componentes leves

Usam os eventos da AWT

São bibliotecas oficiais inclusas na JRE e/ou JDK

Existem bibliotecas desenvolvidas por terceiros
como a SWT desenvolvida pela IBM

02 - Portabilidade

As APIs de interface gráfica favorecem a

portabilidade

O look-and-feel do Swing é único em todas
as plataformas onde roda. A interface a
mesma em qualquer sistema operacional.

Com Swing, não importa qual sistema
operacional, qual resolução de tela, ou qual
profundidade de cores: sua aplicação se
comportará da mesma forma em todos os
ambientes.

2
 05/11/2008

03 – Começando com a Biblioteca Swing

A classe JOptionPane contém caixa de

diálogos de entrada e mensagens. São elas:

showInputDialog(“Mensagem”) que é um
método estático que retorna uma string.

Ex:

String resp=JOptionPane.showInputDialog(“Nome “);

showMessageDialog(classePai,
Mensagem,Titulo,Icone);

Ex:

JOptionPane.showMessageDialog(null,”O nome digitado foi
“+resp,”Mostra Nome”, JOptionPane.PLAN_MESSAGE)

03 – Começando com a Biblioteca Swing (cont)

Javadoc da classe JOptionPane referente aos métodos showInputDialog

3
 05/11/2008

03 – Começando com a Biblioteca Swing (cont)

Prompt para o
usuário Campo de texto em que
o usuário digita um
Quando o usuário
valor
clica em OK,
showInputDialog
retorna ao programa o
nome digitado pelo
usuário como uma
String.
String

barra de
título

Quando o usuário clique em

OK, o diálogo de
mensagem é fechado (é
removido da tela)

03 – Começando com a Biblioteca Swing (cont)

Javadoc da classe JOptionPane referente aos métodos showMessageDialog

4
 05/11/2008

03 – Começando com a Biblioteca Swing (cont)

Tipo de diálogo de Ícone Descrição

mensagem
ERROR_MESSAGE Um diálogo que indica um erro para o usuário.

INFORMATION_MESSAGE Um diálogo com uma mensagem informativa

para o usuário.
WARNING_MESSAGE
WARNING_MESSAGE Um diálogo que adverte o usuário de um
problema potencial.
QUESTION_MESSAGE Um diálogo que impõe uma pergunta ao
usuário. ormalmente, esse diálogo exige uma
resposta, como clicar em um botão Yes ou No.
No
PLAIN_MESSAGE
enhum Um diálogo que contém uma mensagem, mas
ícone nenhum ícone..

Constantes JOptionPane static para diálogos de mensagem.

04 – Criando um formulário

Para criar uma formulário podemos fazer

conforme o código abaixo:

JFrame meuForm = new JFrame(“ titulo do
formulario”);

O método setSize(largura,altura) indica o tamanho do
formulário.

O método setVisible(true) indica que o formulario ficará
visivel para o usuário

O método setDefaultCloseOperation(JFrame.
EXIT_ON_CLOSE) fecha o formulário quando o usuário
clica para fechar o formulário.

Vejamos o programa ExForm1.java

5
 05/11/2008

04 – Criando um formulario com Herança

Você pode criar um classe que é um

formalário através de herança conforme
codigo do programa ExFormHer01.java.

05 – Uma visão geral dos componentes Swing

Componentes Swing GUI:

Declarado no pacote javax.swing.
javax.swing

A maioria dos componentes Swing são

componentes Java puros — escritos,

manipulados e exibidos em Java.

Fazem parte das Java Foundation Classes

(JFC) — bibliotecas do Java para

desenvolvimento de GUI para múltiplas
plataformas.

6
 05/11/2008

05 – Uma visão geral dos componentes Swing

Componente Descrição
JLabel Exibe texto não-editável ou ícones.
JTextField Permite ao usuário inserir dados do teclado. Também pode ser
utilizado para exibir texto editável ou não editável.
JButton
Desencadeia um evento quando o usuário clicar nele com o
mouse.
JCheckBox Especifica uma opção que pode ser ou não selecionada.
JComboBox Fornece uma lista drop-down de itens a partir da qual o
usuário pode fazer uma seleção clicando em um item ou
possivelmente digitando na caixa.
JList Fornece uma lista de itens a partir da qual o usuário pode
fazer uma seleção clicando em qualquer item na lista.
Múltiplos elementos podem ser selecionados.
JPanel Fornece uma área em que os componentes podem ser
colocados e organizados. Também pode ser utilizado como
uma área de desenho para imagens gráficas.

06 – Adicionando componentes no formulário

Declarando e instanciando uma etiqueta (JLabel)

JLabel meuLabel = new JLabel(“texto do Label”);

Declarando e instanciando um Campo de Texto

(JTextField) de tamanho 20.

JTextField meuJText = new JTextField(20);

Declarando e instanciando um botão (JButton)

JButton meuBtn = new JButton(“Texto do Botao”);

Um formulario precisa de um organizador de layout.

Vamos usar o método setLayout para defini-lo

meuForm.setLayout(new FlowLayout());

Vejamos o código ExForm02.java

7
 05/11/2008

07 – Para criar uma GUI é simples

1. Crie uma moldura (um objeto JFrame)

JFrame meuFrame = new JFrame();
2. Crie os elementos gráficos (botão, campo de
texto, etc )
3. Configure o Layout do Formulario

setLayout( padrão do Layout);
4. Adicione os elementos na moldura

meuForme.add(botao1);
5. Exiba o Form (forneça o tamanho e torne-o
visível)

meuForm.setSize(larg,alt);

meuForm.setVisible(true);

08 – Superclasses dos componetes leves GUI

Classe Component (pacote java.awt

java awt):
awt

Subclasse de Object.
Object

Declara muitos comportamentos e atributos comuns a
componentes GUI.

Classe Container (pacote java.awt
java awt):
awt

Subclasse de Component.
Component

Organiza Components.
Component

Classe JComponent (pacote javax.swing):
javax.swing

Subclasse de Container.
Container

Superclasse de todos os componentes Swing leves.

8
 05/11/2008

08 – Superclasses dos componetes leves GUI

09 – Controle de Eventos

GUIs são baseadas em evento:

Uma interação com o usuário cria um

evento.

Eventos comuns são clicar em um botão, digitar em
um campo de texto, selecionar um item em um
menu, fechar uma janela e mover o mouse.

O evento causa uma chamada a um
método que chama (invoca) um tratador
de evento.

9
 05/11/2008

10 – Configurando um botão

Para configurar um botão precisamos:

1. Um método a ser chamado quando o usuário
clicar no botão
2. Uma maneira de saber quando acionar esse
método.

Vamos alterar o programa anterior para ao
clicar mostrar uma janela com um
JOptionPane para mostrar o conteúdo do
JTextField.

10 – Configurando um botão (cont)

Para capturar um evento de um botão

(ActionEvent)
1. Implemente a interface ActionListener
2. Registre o botão (isto indica que você
quer escutar o evento do botão)
3. Defina o método de manipulação dos
eventos (implemente o método
actionPerformed() da interface
ActionListener)

10
 05/11/2008

10 – Configurando um botão (cont)

import javax.swing.JFrame;
import javax.swing.JLabel;
import javax.swing.JTextField;
import javax.swing.JButton;
import javax.swing.JOptionPane;
import java.awt.FlowLayout; Neste pacote estão localizadas as
interfaces de tratamento de eventos
import java.awt.event.*; ActionListener e ActionEvent

class Formulario extends JFrame implements ActionListener{

private JTextField txtFldNome;

private JLabel lblNome;
private JButton btnExibir;
A implementação da interface
indica que a classe Formulario
fornecerá métodos para tratar
eventos do botão

10 – Configurando um botão (cont)

Formulario() {
super("Meu primeiro formulario em Java");

lblNome = new JLabel("Nome: ");

txtFldNome = new JTextField(20);
btnExibir = new JButton("Exibir ");
Registra que este botão fara parte
btnExibir.addActionListener(this); dos ouvinte da inteface
ActionListener
// Adiciona os objetos no Formulário
setLayout(new FlowLayout());
add(lblNome);
add(txtFldNome);
add(btnExibir);

//setSize(400,200);
pack();
setVisible(true);
setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);

11
 05/11/2008

10 – Configurando um botão (cont)

public void actionPerformed(ActionEvent evento){

JOptionPane.showMessageDialog(this,"O nome digitado
foi"+txtFldNome.getText());
}
} Este deve ser implementado para
tratar os evcntos da action listener

public class ExForm2Button {

public static void main(String args[]){

Formulario meuForm = new Formulario();

}
}

Execute o programa ExForm2Button.java

11 – Um pouco mais de Eventos

JTextField e JPasswordField:
JPasswordField

Pressionar Enter dentro de um desses campos causa

um ActionEvent.
ActionEvent

Processado pelos objetos que implementam a interface
ActionListener.
ActionListener

O método actionPerformed é acionado todo vez que

um ActionEvent acontece.

A fonte do evento pode ser determinada pelo método
getSource

O texto em um JTextField pode ser adquirido
utilizando getActionCommand

O texto em um JPasswordField pode ser adquirido
utilizando getPassword.
getPassword

12
 05/11/2008

12 – Tratantando eventos de vários objetos

Quando existe varios objetos que geram o

mesmo tipo de evento você pode usar o
método para verificar isto.

Um exemplo disto pode ser visto no

programa : TextFieldFrame.java e
TestaTextFieldFrame.java

Vamos analisar o código

13 –Gerenciador de Layout

É um objeto que está associado a um componente

de plano de fundo (container)

Controla os componentes que se encontram

dentro dele.

Objetos da classe JFrame e JPanel são conteiner.

E os componentes são adicionados nestes objetos
através do método add.

Pode existir painéis dentro de painéis.

13
 05/11/2008

13.1 – Gerenciador BorderLayout

Divide um componente de plano de fundo

em cinco regiões.

Só permite adicionar um componente por
região e um plano de fundo controlado por
um gerenciador de BorderLayout.

BorderLayout é o gerenciador de layout
padrão para uma moldura (JFrame)

Veja o exemplo JFrameLayoutUm.java e
TestaLayoutUm.java

13.2 – Gerenciador FlowLayout

Cada componente recebe o tamanho que

deseja, e eles são disposto da esquerda
para direita e conforme preenche a largura
do conteiner os objetos são colocados na
linha de baixo.

O FlowLayout é o layout padrão para um
panel.

Veja o exemplo do programa
JFrameLayoutDois.java e
TestaLayoutDois.java

14
 05/11/2008

13.3 – Gerenciador GridLayout

Divide o contêiner em uma grade.

Todos os componentes têm a mesma

largura e altura.

Vejamos os programas

JFrameLayoutTres.java e
TestaLayoutTres.java

13.4 – Gerenciador BoxLayout

Organiza componentes GUI horizontalmente

ao longo de um eixo x ou verticalmente ao
longo do eixo y do contêiner.

Veja o exemplo JFrameLayoutQuatro.java e

TestaLayoutQuatro.java

Você pode fazer combinações veja os

exemplos JFrameLayoutMix.java,

15
 05/11/2008

Exercicio com Layout

Faça uma classe que tenha a interface

conforme a figura abaixo:

Obs: Não precisa implementar os botões

14 – Botões que mantem estado

Botões de estado:

O Swing contém três tipos de botões de

estado:

JToggleButton,
JToggleButton JCheckBox e
JRadioButton.
JRadioButton

JCheckBox e JRadioButton são

subclasses de JToggleButton

16
 05/11/2008

14.1 - JCheckBox

JCheckBox:
JCheckBox

Contém um rótulo de caixa de seleção
que aparece à direita da caixa de seleção
por padrão.

Gera um ItemEvent quando é clicado.

ItemEvents
ItemEvent são tratados por um ItemListener.
ItemListener

Passado para o método itemStateChanged.
itemStateChanged

O método isSelected retorna se uma
true)
true
caixa de seleção está selecionada (true
false).
false
ou não (false

14.2 - JRadioButton

JRadioButton:
JRadioButton:

Tem dois estados – selecionado e não
selecionado.

Normalmente aparece em um grupo no qual
somente um botão de opção pode ser
selecionado de cada vez.

Grupo mantido por um objeto ButtonGroup.
ButtonGroup

Declara o método add para adicionar um JRadioButton
ao grupo.

Normalmente, representa opções mutuamente
exclusivas.

Verificar exemplo TestaCheckRadio.java

17
 05/11/2008

15- JComboBox

Caixa de combinação:

Às vezes, também chamada lista drop-down.

Implementada pela classe JComboBox.

JComboBox

Cada item na lista tem um índice.

setMaximumRowCount configura o número

máximo de linhas mostradas de cada vez.

JComboBox fornece uma barra de rolagem e

setas para cima e para baixo para percorrer a

lista.

16 – Usando uma classe interna anônima

Classe interna anônima:

Forma especial de classe interna.

Declarada sem nome.

Em geral, aparece dentro de uma

chamada de método.

Tem acesso limitado a variáveis locais.

Vejamos o exemplo TestaCombo.java

18
 05/11/2008

17 - JList

Lista:

Exibe uma série de itens dentre os quais
usuário pode selecionar um ou mais.

Implementada pela classe Jlist.
Jlist

Permite listas de seleção única ou listas de
múltipla seleção.

Um ListSelectionEvent ocorre quando um
item é selecionado.

Tratado por um ListSelectionListener e
passado para o método valueChanged.
valueChanged

1 // Fig. 11.23: ListFrame.java

2 // Selecionando
Selecionando cores a partir de uma JList.
3 import java.awt.FlowLayout;
4 import java.awt.Color;
5 import javax.swing.JFrame;
6 import javax.swing.JList;
7 import javax.swing.JScrollPane;
8 javax.swing.event.ListSelectionListener;
import javax.swing.event.ListSelectionListener;
9 import javax.swing.event.ListSelectionEvent;
10 import javax.swing.ListSelectionModel;
11
12 public class ListFrame extends JFrame
13 {
14 private JList colorJList; // lista
lista para exibir cores
15 private
private final String colorNames[] = { "Black",
"Black", "Blue",
"Blue", "Cyan",
"Cyan",
16 "Dark Gray",
Gray", "Gray",
"Gray", "Green",
"Green", "Light Gray",
Gray", "Magenta",
"Magenta" ,
Declara a variável de instância JList
17 "Orange",
"Orange", "Pink",
"Pink", "Red",
"Red", "White",
"White", "Yellow" };
18 private final Color colors[] = { Color.BLACK,
Color.BLACK, Color.BLUE,
Color.BLUE, Color.CYAN
Color.CYAN,
CYAN,
19 Color.DARK_GRAY,
Color.DARK_GRAY Color.GRAY,
, Color.GRAY Color.GREEN,
, Color.GREEN , Color.LIGHT_GRAY,
Color.LIGHT_GRAY,
20 Color.MAGENTA,
Color.MAGENTA Color.ORANGE,
, Color.ORANGE Color.PINK,
, Color.PINK Color.RED,
, Color.RED Color.WHITE,
, Color.WHITE ,
21 Color.YELLOW };
22
23 // construtor ListFrame adiciona JScrollPane que contém JLi
JList
st ao JFrame
24 public ListFrame()
25 {
26 super(
super ( "List Test" );
27 setLayout( new FlowLayout() ); // configura o layout de frame
28

19
 05/11/2008

29 colorJList = new JList( colorNames ); // cria

cria com colorNames
30 colorJList.setVisibleRowCount( 5 ); // Cria
exibe cinco linhas de uma vez
JList
31
32 // não permite múltiplas seleções
33 colorJList.setSelectionMode(
colorJList.setSelectionMode( ListSelectionModel.SINGLE_SELECTION );
34 Configura o modo de seleção da JList
35 // adiciona um JScrollPane que contém JList ao frame
36 add( new JScrollPane( colorJList ) );
37
38 colorJList.addListSelectionListener(
Adiciona JList a ScrollPane
39 new ListSelectionListener() // classe interna anônima
e a adiciona à aplicação
40 {
41 // trata eventos de seleção de lista
42 public void valueChanged( ListSelectionEvent event )
43 {
44 getContentPane().setBackground(
getContentPane().setBackground(
45 colors[ colorJList.getSelectedIndex() ] );
46 } // fim do método valueChanged
Obtém o índice do item selecionado
47 } // fim da classe interna anô
anônima
48 ); // fim da chamada para addListSelectionListener
49 } // fim do construtor ListFrame
50 } // fim da classe ListFrame

18 – JList com multipla seleção

Lista de seleção múltipla:

Permite que usuários selecionem vários

itens.

Seleção de um único intervalo que

permite apenas um intervalo contínuo de

itens.

Seleção de múltiplos intervalos que

permite que qualquer conjunto de

elementos seja selecionado.

20
 05/11/2008

1 // Fig. 11.25: MultipleSelectionFrame.java

2 // Copiando
Copiando iten
itens de uma List para a outra.
outra.
3 import java.awt.FlowLayout;
4 import java.awt.event.ActionListener;
5 import java.awt.event.ActionEvent;
6 import javax.swing.JFrame;
7 import javax.swing.JList;
javax.swing.JList;
8 import javax.swing.JButton;
9 import javax.swing.JScrollPane;
10 import javax.swing.ListSelectionModel;
11
12 public class MultipleSelectionFrame extends JFrame
13 {
14 lista
private JList colorJList; // lista para armazenar nomes
nomes de cores
15 lista
private JList copyJList; // lista para copiar nomes de cores no
16 botão
private JButton copyJButton; // b selecionados
otão para copiar nomes selecionados
17 private final String colorNames[] = { "Black",
"Black", "Blue",
"Blue", "Cyan",
"Cyan",
18 "Dark Gray",
Gray", "Gray",
"Gray", "Green",
"Green", "Light Gray",
Gray", "Magenta",
"Magenta", "Orange",
"Orange",
19 "Pink",
"Pink" "Red",
, "Red", "White",
"White", "Yellow" };
20
21 // construtor MultipleSelectionFrame
22 public MultipleSelectionFrame()
23 {
24 super(
super( "Multiple Selection Lists" );
25 setLayout( new FlowLayout() ); // configura layout do frame
26

27 colorJList = new JList( colorNames ); // armazena nomes de todas as cores

28 colorJList.setVisibleRowCount( 5 ); // mostra cinco linhas
29 colorJList.setSelectionMode(
30 ListSelectionModel.MULTIPLE_INTERVAL_SELECTION
ListSelectionModel.MULTIPLE_INTERVAL _SELECTION
Utiliza uma lista de);seleção de
31 múltiplos
add( new JScrollPane( colorJList ) ); adiintervalos
// adi ciona lista
lista com scrollpane
32
33 copyJButton = new JButton( "Copy >>>" ); // cri
cria botão de cópia
34 copyJButton.addActionListener(
35
36 new ActionListener() // classe interna anônima
37 {
38 // trata evento de botão
39 public void actionPerformed( ActionEvent event )
40 {
41 // coloca valores selecionados na copyJList
42 copyJList.setListData(
copyJList.s etListData( colorJList.getSelectedValues() );
43 } // fim do método actionPerformed Utiliza os métodos setListData
44 } // fim da classe interna anônima e getSelectedValues para
45 copiar valores de uma JList para
); // fim da chamada para addActionListener
46 outra

21
 05/11/2008

47 add( copyJButton ); // adiciona botão de cópia ao JFrame

48
49 copyJList = new JList(); // cria lista p/
p/ armazenar nomes de cor copiados
50
Configura a largura da célula para
copyJList.setVisibleRowCount( 5 ); // mostra 5 linhas
apresentação
51 copyJList.setFixedCellWidth(
copyJList.setFixedCellWidth( 100 ); // configura largura
52 copyJList.setFixedCellHeight( 15 ); // configura altura
Configura a altura da célula para
53 copyJList.setSelectionMode( apresentação
54 ListSelectionModel.SINGLE_INTERVAL_SELECTION );
55 add( new JScrollPane(
JScrollPane( copyJList ) ); // adiciona
adiciona lista com scrollpane
56 } // fim do construtor MultipleSelectionFrame
Configura o modelo de seleção
57 } // fim da classe MultipleSelectionFrame
como seleção de um único intervalo

1 // Fig. 11.26: MultipleSelectionTest.java

2 // Testando
Testando MultipleSelectionFrame.
3 import javax.swing.JFrame;
4
5 public class MultipleSelectionTest
6 {
7 public static void main( String args[] )
8 {
9 MultipleSelectionFrame multipleSelectionFrame =
10 new MultipleSelectionFrame();
11 multipleSelectionFrame.setDefaultCloseOperation(
12 JFrame.EXIT_ON_CLOSE );
13 multipleSelectionFrame.setSize( 350,
350, 140 ); // configura o tamanho do frame
14 multipleSelectionFrame.setVisible( true ); // exibe o frame
15 } // fim de main
16 } // fim da classe MultipleSelectionTest

22
 05/11/2008

Exercício

Faça um formulário para entrada de dados

conforme a classe ContaCorrente
desenvolvida na aula de Arquivos.

Coloque botões para:

Incluir um contato no array (cuidado com o
limite do array)

Salvar os dados no arquivo (pode ser
serialização)

Recuperar dados armazenados no arquivo.

23