You are on page 1of 23

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