Aula 04 (FT3): Construção de GUI em Java e Delphi

Linguagens de Programação Orientadas a Objetos
Pós-Gradução(Lato-Sensu) em Sistemas de Banco de Dados - UFPa
Marco Fagundes
[email protected]
Aula 04 e 5 - Construção de GUI
http://www.ufpa.br/sampaio/bd2003/lpoo
 Marco Fagundes
1 de 33
Roteiro



Introdução
GUI em Delphi
GUI em Java
2 de 33
Introdução

Interface Gráfica com o Usuário (Graphical User Interface - GUI)
• Dá ao programa a característica “look” and “feel”
• Fornece ao usuário um nível básico de familiaridade
• Construída a partir de componentes (e.g., controles)
– O usuário interage com componentes GUI via mouse,
teclado, etc.
3 de 33
GUI
em Delphi
4 de 33
GUI em Delphi

Form Designer
5 de 33
GUI em Delphi
Terminologia
 Design vs Run time; Formulários; Componentes; Propriedades;
Métodos e Eventos
Terminologia (Formulários)
Propriedades:
Name, Caption, Position,
BorderStyle, BorderSingle
Eventos:
OnActivate, OnClose
Métodos
Show, ShowModal
6 de 33
GUI em Delphi
Terminologia (Componentes)
 Alguns componentes básicos
Componente
Descrição
TLabel
Uma área onde texto não editáveis são exibidos
TEdit
Uma área onde o usuário entra com informação. Esta área
pode ser usada para exibir informações
TButton
Uma área que dispara um evento quando clicada
TPanel
Um container no qual componentes podem ser colocados
7 de 33
GUI em Delphi
Terminologia (Componentes)
Propriedades:
Name, Caption, Enabled, Visible, Align
Propriedades:
Name, Text, PasswordChar, Enabled, Visible
Eventos:
OnChange, OnKeyPress
Métodos:
Clear
Propriedades:
Name, Caption
Propriedades:
Name, Caption, Enabled, Visible
Eventos:
OnClique
Terminologia (Propriedades)
8 de 33
GUI em Delphi
Terminologia(Eventos)
9 de 33
GUI em Delphi

Exercício
• Construir uma GUI conforme mostrado na figura abaixo
TLabels
TEdits
TButtons
10 de 33
GUI
em Java
11 de 33
GUI em Java


AWT
• AWT (Abstract Windowing ToolKit) pacote java.awt
• Associados com as capacidades de GUI da plataforma local
• Aparência e, às vezes, interações diferentes executando em
plataformas distintas
Swing GUI components
• Pacote javax.swing
• Componentes originados da AWT (pacote java.awt)
• Contém look and feel
– Aparência e como o usuário interage com o programa
• Componentes leves
– Escritos completamente em Java
12 de 33
GUI em Java

Class Component
• Contém o método paint para desenhar componentes na tela
Class Container

• Coleação de componentes relacionados
• Contém o método add para adicionar componentes
Class JComponent

• Customização de look and feel
• Capacidade de manipulação de eventos
13 de 33
GUI em Java

Superclasses de alguns componentes Swing
java.lang.Object
java.awt.Component
java.awt.Container
javax.swing.JComponent
14 de 33
GUI em Java

Alguns componentes básicos do Swing
Componente
Descrição
JLabel
Uma área onde texto não editáveis são exibidos
JEdit
Uma área onde o usuário entra com informação. Esta área
pode ser usada para exibir informações
JButton
Uma área que dispara um evento quando clicada
JPanel
Um container no qual componentes podem ser colocados
15 de 33
GUI em Java

Componentes Básicos Swing
JLabel
Mostra um texto somente
de leitura
JTextField
Texto que o usuário digita em
uma única linha
JButton
Dispara uma ação específica
quando clicado
JPasswordField
Estende JTextField. Esconde os
caracteres que o usuário digita
16 de 33
GUI em Java
Layout Managers
 Permite organizar componente GUI
 Fornece capacidades básicas de layout
 Processa detalhes de layout
 Programador pode concentrar no básico “look and feel”
 Interface LayoutManager
17 de 33
GUI em Java
Gerenciadores de Layout
Gerenciador
FlowLayout
BorderLayout
GridLayout
Descrição
Default para java.awt.Applet, java.awt.Panel e
javax.swing.Jpanel.
Coloca componente sequencialmente (esquerda ou direita) no
ordem em que eles são adicionados. Também é possível
especificar a ordem dos componentes usando o método add
que recebe como argumentos um Component e um inteiro que
representa sua posição.
Default para o painel de conteúdo JFrame e Japplet.
Distribui os componentes em cinco posições: North, South,
East, West and Center
Organiza os componentes em linhas e colunas
18 de 33
GUI em Java
Gerenciadores de Layout
 O FlowLayout coloca os componentes conforme a ordem em que
são adicionados ao cointainer

O GridLayout exibe os componentes em linhas e colunas (como
uma tabela) deixa-os do mesmo tamanho
19 de 33
GUI em Java
O Gerenciador BorderLayout
 Ele é o gerenciador de layout padrão para todas as janelas (Frames e
Dialogs)
 Distribui os componentes em cinco regiões
• NORTH (topo do container)
• SOUTH (base do container)
• EAST (esquerda do container)
• WEST (direita do container)
• CENTER (centro do container)

A área que tem a maior quantidade de espaço disponível é o centro
20 de 33
GUI em Java





As classes do Swing estão no pacote javax.swing
Cria-se uma Sub-classe de JFrame
Método setTitle() define o nome da janela
Método setSize() define o tamanho da janela
Método setLocation() define a posição da janela na tela
21 de 33
GUI em Java
Exemplo: Construindo uma Janela
import javax.swing.*;
public class Janela extends Jframe {
public Janela()
{
setTitle("Exemplo de Janela");
setSize(300, 200);
}
public static void main(String arguments[])
{
Janela j = new Janela();
j.show();
}
}
22 de 33
GUI em Java





Para centralizarmos uma janela na tela, deve-se saber o tamanho da
tela em pixels
Através da Classe Toolkit é possível obter diversas informações do
sistema
O método getScreenSize() retorna um objeto Dimension contendo o
tamanho da tela
Através da Classe Toolkit também podemos carregar um ícone para
ser usado na aplicação
O método setResizable() pode ser desabilitar o redimensionamento
da janela
Toolkit tk = Toolkit.getDefaultToolkit();
Dimension d = tk.getScreenSize();
int alturaTela = d.height;
int larguraTela = d.width;
setLocation(larguraTela / 4, alturaTela / 4);
setResizable(false);
23 de 33
GUI em Java
Adicionando componentes à Janela
 Deve-se criar uma instância das classes dos componentes
selecionados no projeto da GUI. Por exemplo: JLabel e JTextField.
JLabel lblValor1 = new JLabel("Valor 01:");
JTextField txtValor1 = new JTextField("0");

Em seguida defini-se um instância da classe Container que receberá
os componentes a serem inseridos à Janela.
Container c = getContentPane();

Após a definição do container prossegue-se com a definição do
gerenciador de layout a ser utilizado.
GridLayout gl = new GridLayout(3,2);
c.setLayout(gl);

Finalmente, os componentes podem ser adicionados ao container
através do método add().
c.add(lblValor1);
c.add(txtValor);
24 de 33
GUI em Java
Adicionando componentes à Janela
 O método pack() pode ser utilizado para redimensionamento dos
componentes conforme área disponível na janela
 Um exemplo de GUI é mostrado na figura abaixo
25 de 33
Manipulação de
Eventos em Java
26 de 33
Manipulação de Eventos

GUIs são direcionadas por eventos
• Eventos são gerados quando o usuário interage com a GUI
– e.g., movimento do mouse, pressionamento de botão,
digitação em um textfield, etc.
– Class java.awt.AWTEvent
27 de 33
Manipulação de Eventos

Algumas Classes do pacote java.awt.event
java.lang.Object
java.util.EventObject
java.awt.AWTEvent
ActionEvent
ContainerEvent
AdjustmentEvent
FocusEvent
ItemEvent
PaintEvent
ComponentEvent
WindowEvent
InputEvent
Ke y
Class nam e
Interfa c e nam e
KeyEvent
MouseEvent
28 de 33
Manipulação de Eventos

Modelo de Manipulação de Eventos
• Três partes
– Origem do Evento
– Componente GUI com o qual o usuário interage
– Objeto Evento
– Informação encapsulada sobre o evento ocorrido
– Listener do Evento
– Recebe o objeto evento quando notificado,
respondendo-o
• O Programador deve executar duas tarefas
– Registrar o listener do evento para o fonte do evento
– Implementar um método que trate o evento (event handler)
29 de 33
Manipulação de Eventos

Interfaces Event-listener do pacote java.awt.event
ActionListener
java.util.EventListener
AdjustmentListener
ComponentListener
ContainerListener
FocusListener
ItemListener
KeyListener
MouseListener
MouseMotionListener
Key
C la ss na me
Inte rfa c e na me
TextListener
WindowListener
30 de 33
Manipulação de Eventos

Duas questões em aberto:
• Como o manipulador de eventos é registrado?
– R:
– Através do método do componente addActionListener
• Como o componente sabe chamar actionPerformed?
– R:
– O evento é somente disparado para o listeners do tipo
apropriado
– Cada tipo de evento tem uma interfaace event-listener
correspondente
» Event ID especifica o tipo do evento que ocorreu
31 de 33
Manipulação de Eventos

Registrando um manipulador de evento para um botão
btnSomar.addActionListener
(new ActionListener()
{
public void actionPerformed(ActionEvent e)
{somar();}
}
);

Registrando um manipulador de evento para encerramento da
aplicação
addWindowListener (new WindowAdapter()
{
public void windowClosing(WindowEvent e)
{System.exit(0);}
}
);
32 de 33
Manipulação de Eventos

Exercício para entrega no dia 23/04/2003
• Detalhamento no site - link “exercícios/Projetos”
33 de 33