Aula 04 (FT3): Construção de GUI em Java e Delphi
Propaganda
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
