15
Programação Orientada a Objetos II Profª Tatiana Pereira Filgueiras 1. Tutorial – Window Builder 1.1 Definindo o Projeto Abra o Eclipse e clique na aba File new Java Project. Defina Project Name e Location, e logo em seguida clique em Finish. Clique co o botão direito na pasta src New Package e crie o pacote View.Clique com o botão direito em View New Other.

GUI WindowBuilder

Embed Size (px)

Citation preview

Programação Orientada a Objetos II Profª Tatiana Pereira Filgueiras

1. Tutorial – Window Builder

1.1 Definindo o Projeto

Abra o Eclipse e clique na aba File → new → Java Project. Defina Project Name e

Location, e logo em seguida clique em Finish. Clique co o botão direito na pasta src →

New → Package e crie o pacote View.Clique com o botão direito em View → New →

Other.

Clique em WindowBuilder → Swing Designer → JFrame

Defina o nome da classe. No exemplo definimos como Principal.

1.2 Desenhando a Tela

1.2.1 Tela de Cadastro de Múltiplos Clientes utilizando JTable

Clique em contentPane e em suas propriedades atribua o Layout desejado. No

caso do exemplo, usaremos o AbsoluteLayout.

Insira 2 JPanel e 1 JScrollPane conforme abaixo:

Clique em cada um dos JPanels e atribua o Layout desejado. No caso do exemplo,

atribuiremos o AbsoluteLayout.

Insira 5 JButtons: Inserir, Alterar, Excluir, Salvar no BD e Recuperar do BD.

Selecione o primeiro botão e, segurando a tecla SHIFT selecione os demais. Clique

em “Space equally, horizontally”

Insira as seguintes JLabels: Nome, CPF, Agência, Conta e Cartão. Na frente de

cada JLabel insira um JTextField. Clique em cada JTextField e em suas propriedades

atribua um nome para cada variável.

Para o TextField ‘Titular’, insira como Variable ‘nome’. Para o CPF, Agência,

Cartão e Conta insira estes mesmos nomes (sem utilizar acentuação).

Após isso, insira uma JTable no ViewPoint do JScrollPane

Clique em table e em suas propriedades, selecione model. Insira 5 campos

correspondentes aos JLabels.

Feito isso, nossa tela estará pronta. Agora resta atribuir ações aos botões para que

tudo funcione.

1.3 Atribuindo Ações

1.3.1 Configurando nossa tabela

Antes de começarmos a trabalhar nos botões, precisamos configurar nossa tabela

para que a mesma possa receber, alterar e deletar dados. Para isso será necessário

modificar o código fonte gerado pelo WindowBuilder. Clique em Source e encontre as

linhas correspondentes a table.

Antes de TabelaScroll.setViewportView(table), insira a seguinte linha:

model = (DefaultTableModel) table.getModel();

Sendo que a variável model deverá ser inserida como atributo privado, isto é, no

início da classe.

Pronto, nossa tabela está configurada. Toda e qualquer manipulação dela será

feita utilizando o atributo model.

1.3.2 Definindo ações aos botões

1.3.2.1 Botão Inserir

Retorne ao Design. Clique com o botão direito em cima do botão “Inserir”. Escolha

as opções “Add event handler” →“Action” → “Action Performed”.

Isso remeterá ao código fonte do botão inserir. A função deste botão será capturar

tudo o que o usuário digitar nos TextFields e inserir na tabela. Para capturar um dado

de um TextField utilizamos o método getText(). Para adicionar os dados na tabela, é

necessário inserir todos os TextFields em um único array de objetos, e, após isso,

utilizar o método addRow() do model. Lembrando que a ordem dos itens no array de

objetos deve seguir a ordem das colunas da tabela. Por exemplo: coluna 1 receberá o

valor da variável ‘nome’, portanto deve ser o item 0(zero) do array.

Uma das maneiras de codificar a explicação acima encontra-se a seguir:

Insira estas linhas e rode o programa. Teste atribuindo valores aos campos de

texto e clicando no botão ‘Inserir’. Note que ao clicar, os dados dos campos de texto

irão para a tabela, porém, continuarão nos TextFields. Para apagá-los dos TextFields

assim que forem para a tabela, insira abaixo da linha model.addRow(lista); as

seguintes linhas:

nome.setText(null);

cpf.setText(null);

agencia.setText(null);

conta.setText(null);

cartao.setText(null);

1.3.2.1 Botão Alterar

A função deste botão é resgatar os campos de uma linha selecionada para os

TextFields e atualizar a linha, caso haja alterações. Para resgatar os campos de uma

linha selecionada, clique com o botão direito em table → Add evend handler → Mouse

→ mouseClicked . O WindowBuilder irá abrir o código fonte do programa com um

novo método para checar quando o mouse clica em determinada linha da tabela.

Dentro do método mouseClicked insira as seguintes linhas:

int totalColunas = model.getColumnCount(); //quantas colunas ha na tabela

Object[] linhaCompleta = new Object[5]; //recupera dados da linha(5 colunas)

for(int i=0;i<totalColunas;i++){ //recupera dado coluna por coluna

linhaCompleta[i] = table.getValueAt(table.getSelectedRow(),i);

}

//setando os dados coletados nos textFields

//coluna 0 = nome ; 1=cpf; 2=agencia; 3=conta; 4=cartao

nome.setText((String) linhaCompleta[0]);

cpf.setText((String) linhaCompleta[1]);

agencia.setText((String) linhaCompleta[2]);

conta.setText((String) linhaCompleta[3]);

cartao.setText((String) linhaCompleta[4]);

Feito isso, execute o programa e teste, inserindo uma linha e depois clicando sobre

esta linha.

Agora precisamos determinar a ação do botão Alterar. Clique com o botão direito

do mouse em cima do botão “Alterar”. Escolha as opções “Add event handler”

→“Action” → “Action Performed”. Isso remeterá ao código fonte. Insira as seguintes

linhas:

Execute o programa. Note que, caso não haja linha selecionada o programa não

lançara nenhuma mensagem, pois não há exceção definida.

2. Exercícios de Fixação

1. Complete o programa exemplo inserindo ações para os botões Excluir

(excluirá uma linha selecionada), Salvar no BD (deve enviar os dados da

tabela para o DAO (incluso no model) para que o mesmo os grave no banco

de dados) e Recuperar do BD (deverá entrar em contato com o DAO,

receber os dados da tabela do banco de dados e mostrá-los na tabela da

interface gráfica). Lembre-se de seguir o padrão MVC, ou seja, comunicação

View → Model só através do Controller.

2. Substitua o TextField de Cartão por um JComboBox com os seguintes itens:

Visa, Mastercard, Aura, Hipercard, Diners Club e American Express. A tela

deve continuar funcionando como anteriormente (inserindo, alterando,

excluindo dados...), a única modificação deverá ser que, ao invés de

recuperar o dado do campo “cartao” de um TextField , o dado deverá ser

recuperado deste comboBox.

3. Insira um botão “Atualizar no BD” e defina sua ação para que os dados

atualizados na tabela também sejam atualizados no banco de dados.

Os exercícios podem ser feitos em dupla e entregues à professora via e-mail

([email protected]) no formato .java ou .zip. Estes exercícios complementarão o conceito

final de A2.