Eclipse - Visual Editor - MySQL

Introdução

Olá! No post de hoje pretendo mostrar como iniciar no desenvolvimento de aplicações gráficas que utilizem banco de dados em Java. Será mostrado como criar um simples banco de dados e fazer a conexão através do programa. Também ensinarei como instalar o Visual Editor que é usado criar a parte gráfica. Então finalmente veremos como inserir dados no banco.
O que me motivou a criar este tutorial é que tenho visto muito material sobre, porém coisas sem pé nem cabeça, códigos que não compilam, trabalho mal feito. Como eu odeio coisas mal feitas, fiz este post bem didático. Vou mostrar desde a instalação e configuração das feramentas até os testes finais. Todos os códigos foram testados pelo autor.

O Ambiente

Primeiramente vamos preparar o ambiente de desenvolvimento. Logo abaixo você encontra as ferramentas necessárias. Recomendo que utilize as ferramentas nas versões citadas.

Eclipse Galileo (3.5)

O Eclipse é uma IDE muito popular no mundo Java, por isto estarei utilizando-a neste exemplo. Nada impede que se utilize outra IDE, algumas coisas mudam mas os códigos são os mesmos.

Como instalar?

Ele não precisa de ser instalado, depois de baixar é só descompactar. No primeiro uso ele vai pedir o caminho do Workspace, que é a pasta padrão para os seus projetos. Escolha uma pasta de sua preferência e marque a caixa Use this as the default... para ele não perguntar novamente. Se futuramente quiser mudar vá em File > Switch Workspace.
Obs.: Versões superiores a esta ainda não são compatíveis com o Visual Editor, que atualmente está na versão 1.4.0 (hoje é 10/8/2010). Não tente instalar essa versão no Eclipse 3.6 ou superior.

Visual Editor 1.4

O Visual Editor é um framework para desenvolver a parte gráfica dos programas. O Eclipse não é como o Visual Basic que você instala e já tem tudo lá prontinho pra você começar a arrastar os botões, labels, textboxs.. No Eclipse você tem que instalar o Visual Editor à parte.

Como instalar?

Existem duas formas de instalar: online e offline. Aqui vou mostrar só online: Vá no Eclipse em Help > Install New Software... > Add... Em Name você coloca Visual Editor. Em Location cole o endereço:
http://download.eclipse.org/tools/ve/updates/1.4/.
Após alguns segundos vai aparecer uma árvore de pacotes com a raiz VE 1.4.0 R200.... Dentro da árvore existem vários pacotes e somente o pacote cujo nome é Visual Editor deverá ser marcado. Se marcar outros poderá causar conflitos. Então clique em Next. Ele vai fazer o download e quando estiver pronto clique em Finish para iniciar a instalação. Depois de alguns minutos você deve ser questionado se confia no certificado do Eclipse.org, pode confiar. Depois ele vai perguntar se deseja reiniciar o Eclipse. Você vai dizer que sim e pronto! Depois de reiniciar, vá em Help > About Eclipse > Installation Details. Na aba Features o Visual Editor deve estar presente. Se tiver dificuldade, veja este vídeo.

MySQL Server

O MySQL é o servidor de banco de dados open source mais popular do mundo (pelo menos de acordo com a definição dos seus desenvolvedores). Faça o download do arquivo: Windows (x86, 32-bit), MSI InstallerEssentials (mysql-essential-5.1.49-win32.msi) ou o 64-bit de acordo com seu sistema. Também faça o download do MySQL Workbench (mysql-workbench-gpl-5.2.26-win32.msi) para ter acesso as ferramentas gráficas SQL Development (antigo MySQL Query Browser) e Database Administration (antigo MySQL Administrator).

Como instalar o MySQL Server?
Next >
Complete > Next >
Install > (Windows Seven pede permissão)
Next > Next > Finish.
Configuração:
Next >
Standart COnfiguration > Next >
Install As Windows Service > Next >
Escolha a senha >
Execute.

Se quiser mudar a configuração posteriormente ou remover a instância execute o MySQL Server Instance Config Wizard que é criado pelo MySQL no Iniciar > Programas > MySQL > MySQL Server 5.1
ATENÇÃO: Quando for escolher a senha tome muito cuidado para não errar ou esquecer porque depois vai dar trabalho remover a instância do MySQL sem saber a senha. Recomendo que coloque a senha root para o usuário root se estiver apenas aprendendo e a segurança não for importante.

Como instalar o Workbench?
Next >
Complete > Next >
Install >
Finish.

Connector/J 5.1.13

MySQL Connector/J é o driver JDBC oficial para o MySQL. Ele permitirá que nosso aplicativo Java se conecte com o MySQL.
JDBC ou Java Database Connectivity é um conjunto de classes e interfaces (API) escritas em Java que fazem o envio de instruções SQL para qualquer banco de dados relacional, neste caso o MySQL.

Como instalar?

Por enquanto você vai apenas descompactar o arquivo. O driver é inserido diretamente nas bibliotecas de cada projeto. Portanto o procedimento será mostrado mais adiante na criação do projeto.

O Projeto

O exemplo que pretendo apresentar aqui é bem simples: Uma agenda de telefones. O banco vai conter nada mais que o nome e telefone da pessoa. Vamos criar uma tabela chamada Pessoa e nela teremos 2 campos, nome e telefone. O propósito não é mostrar aspectos do banco de dados como relacionamentos, consultas, etc. Apenas será mostrado como se conectar ao banco e inserir um registro. Sabendo disto, você pode pesquisar mais sobre o assunto depois e incrementar sua aplicação.

O Banco de Dados

O banco de dados é a base do seu projeto. Se o banco é mal projetado, isso vai refletir negativamente no projeto inteiro, porque quase toda a aplicação vai trabalhar em cima dele. Por este motivo o banco deve ser bem projetado. Deve ser desenvolvido com base em informações sólidas sobre o modelo do negócio que se deseja implementar para evitar problemas futuros. É claro que neste exemplo mostrado aqui não teria muitos problemas, o reparo seria simples. Mas essa advertência é válida para que todos saibam a importância dessa parte do projeto. Então vamos criar o banco.

Execute o Workbench.
Clique no menu File > New Model.

No menu Database clique em Query Database...Uma Janela Connect to Database irá aparecer. Clique em OK. Se a instância do MySQL estiver instalada e executando vai pedir a senha.

Entre com a senha e OK.
Na aba SQL Query cole o seguinte código:

CREATE DATABASE AGENDA;
USE AGENDA;

CREATE TABLE PESSOA(
 Nome VARCHAR(100),
 Telefone VARCHAR(100),

 PRIMARY KEY(Nome)

)

Clique no ícone Execute SQL Script in Connected Server:

Se tudo der certo, na aba Output vai aparecer a mensagem:
0 row(s) affected.
Se não der vai aparecer um erro parecido com este:

Error Code: 1064 You have an error in your SQL syntax; ...
Clique com o botão direito na parte Object Browser e Refresh All. O novo banco deve aparecer.

Pronto. Criamos um simples banco de dados chamado Agenda e dentro dele somente uma tabela chamada Pessoa com dois campos para nome e telefone, sendo o nome a chave primária (campo que identifica cada registro unicamente e não pode ser duplicado).

A Parte Gráfica

Abra o Eclipse e na parte Package Explorer clique com o botão direito e New > Java Project. Em Project Name digite "ProjetoExemplo" e Finish. No menu do Eclipse tem um botão chamado New Java Class, clique nele e depois em Visual Class:

Na janela que aparecer será solicitado o nome da classe em Name, digite Principal. Ainda nesta janela mais embaixo tem uma parte chamada Style. Nesta parte navegue por Swing > Frame. Ao lado marque a caixa public static void main(String[] args). Sua janela deverá ficar igual a esta (clique para ampliar):

Clique em Finish.
No meio da interface do Eclipse teremos uma divisão entre a parte visual e a parte dos códigos. Tudo que é feito em um reflete no outro. Pode-se alternar as partes utilizando as setas como mostra o círculo entre elas:

A seta indicada pelo outro círculo mais acima abre a paleta de objetos:

Antes de começar a colocar os objetos vamos definir o tipo de layout. Clique no meio do frame como botão direito e vá em Set Layout > null. Este layout nos dá mais liberdade para posicionar os itens no frame. Os outros tipos colocam os objetos em partes pré-definidas para que não se desorganizem quando a tela for maximizada. Opcionalmente também pode-se fazer com que os objetos se alinhem à grade, para isto clique novamente no frame com o botão direito e Snap To Grid.
Para colocar os objetos no frame basta clicar no objeto desejado e depois clicar no frame onde quiser colocá-lo. Quando clicar no frame para inserir o objeto, ele vai perguntar qual nome queremos dar a ele. Use nomes com prefico lb para labels, tx para textfields e bt para botões. Depois do prefixo use um substantivo iniciando com letra maiúscula que identifique aquele objeto. Usar estes padrões de nomeação é importante e ajuda bastante na hora de chamar os objetos via código.
Então vamos criar 2 jLabels, 2 jTextFields e um jButtton. Para os jLabels use lbNome e lbTelefone. Para os jTextFields use txNome e txTelefone. E para o botão use btSalvar. Você deverá ter algo parecido com isto:

Mas nossos labels e o botão ainda estão sem um nome. Para dar um rótulo a eles clique com o botão direito em cada um e depois em Set Text. Pronto! Agora sim:

Cada uma destas propriedades que configuramos para os objetos pode ser modificada através da aba Properties:

Basta clicar no objeto que suas propriedades serão mostradas. Cada uma delas também pode ser acessada via código para fazer alterações como mudar o tamanho, cor, rótulo, desativar, esconder, etc.
Dica: Quando levar seu projeto para outro computador ou se tiver que instalar o Eclipse novamente e depois importar o projeto pode ser que as classes visuais não abram com Visual Editor, e apenas mostrem a parte do código. Neste caso clique com o botão direito na classe e Open With > Visual Editor.
Bom, agora a parte visual do nosso projeto está concluída. Mas antes de continuar vamos dar uma breve explicação sobre o que é o MVC e porque devemos utilizá-lo.

MVC

MVC ou Model View Controller é um padrão de desenvolvimento onde seu projeto é dividido em 3 partes: Model, View e Controller.
Primeiro vou falar da parte View que é a mais simples. View é a visão. View é a parte visual do projeto, ou seja, é a parte que acabamos de ver no capítulo anterior. É a interface, as janelas, botões, figuras, etc. Nada de código aqui, só visual.
Ok, agora vamos ver Model. Model vem de modelo. Model é a parte do seu projeto onde se modela os dados. Vou dar um exemplo bem prático: Num cadastro de clientes temos um modelo de cliente. Não é nada mais do que uma classe que possui os atributos desejados para aquele objeto (e métodos para acessá-los e alterá-los). Os atributos são os mesmos que encontramos na tabela cliente do banco de dados. Se não entendeu, tudo bem, fique tranquilo que daqui a pouco quando desenvolver esta parte vai ficar mais claro.
Por último temos o Controller. O Controller é o cara que faz acontecer. Ele valida os dados e faz a ligação entre View e Model. No final das contas ele que é o responsável por fazer as operações no banco de dados, caso tudo esteja bem.
Com isto vimos que o modelo MVC separa as partes do projeto e deixa cada uma a cargo de determinada tarefa. Isso é bom porque tudo fica mais organizado, erros são isolados e tratados, a manutenção é feita com mais facilidade.

Model

Segundo o modelo MVC vamos criar uma classe para representar a entidade Pessoa que está em nosso banco de dados. Vamos criar um modelo que represente uma unidade desta entidade, este tipo de classe é normalmente chamada de Bean ou JavaBean. Vamos ver um pouco de ação. Clique com o botão direito em cima do nosso projeto e New > Package. Dê o nome a este pacote de beans. Clique agora no pacote com o botão direito e New > Class. Dê o nome a esta classe de Pessoa. Implemente a classe desta forma:

public class Pessoa {
// Atributos
private String Nome;
private String Telefone;
}

Veja que temos os mesmos atributos do banco de dados. Esses atributos devem ser encapsulados para maior segurança e por isso precisamos criar os métodos para manipulá-los. Vamos fazer isto automaticamente: Clique com o botão direito dentro da classe onde se deseja criar os métodos e Source > Generate Getters and Setters. Clique em Select All e OK. Pronto, agora teremos algo parecido com isto:

package beans;

public class Pessoa {
// Atributos
private String Nome;
private String Telefone;

// Construtor sem parâmetro
public Pessoa() {
}

// Construtor que já inicializa recebendo nome e telefone
public Pessoa(String nome, String telefone) {
super();
Nome = nome;
Telefone = telefone;
}

// Getters e Setters
public String getNome() {
return Nome;
}

public void setNome(String nome) {
Nome = nome;
}

public String getTelefone() {
return Telefone;
}

public void setTelefone(String telefone) {
Telefone = telefone;
}
}

Veja também que temos dois construtores: um sem parâmetro e outro com. Você pode gerar estes construtores em Source > Generate Constructor using Fields. O construtor com parâmetros permite já inicializar o objeto passando os atributos de uma vez. O outro permite que inicialize o objeto e depois passe os atributos através dos métodos Getters e Setters. Lembre-se que se não criar nenhum construtor, o Java criará um sem parâmetros automaticamente. Mas se criar um com parâmetro, o Java não criará outro. Veja mais sobre construtores aqui.
Com isto temos nosso modelo pronto e podemos passar para o Controller, mas antes vamos ver como se conectar ao banco.

Conexão com o Banco

Clique com o botão direito no projeto e Build Path > Configure Build Path. Clique em ADD External JARs... e selecione o arquivo mysql-connector-java-5.1.13-bin.jar que se encontra dentro da pasta do driver que você baixou. Clique em OK. Agora o driver já está instalado no projeto. Para conectar crie uma classe dentro do pacote default com o nome Conexao e implemente conforme este exemplo:

package Principal;

import java.sql.*;
import javax.swing.JOptionPane;

public class Conexao {
public static Connection getConnection() throws SQLException {
try {
 Class.forName("com.mysql.jdbc.Driver");// Registrando o driver
 // Retorna a conexão
 return DriverManager.getConnection(
   "jdbc:mysql://localhost:3306/agenda", "root", "senha");
} catch (ClassNotFoundException e) {
 JOptionPane.showMessageDialog(null,
   "Não foi possível se conectar ao banco!\nInformações sobre o erro: "
     + e, "Conexao", JOptionPane.ERROR_MESSAGE);
 return null;
}
}
}

Na linha onde retorna a conexão você deve mudar a senha. Geralmente as classes de conexão tem outras coisas a mais. Esta aí é bem simples e por enquanto dá pro gasto, mas seria interessante que você fizesse uma pesquisa para saber mais sobre. Vamos deixar essa classe aí e continuar com o projeto.

Controller

Esta parte do projeto é onde "conversamos" com o banco de dados. Geralmente chamamos as classes que fazem este papel de DAO ou Data Access Object, porque são objetos que acessam os dados. DAO é um padrão para persistência de dados que separa regras de negócio das regras de acesso ao banco de dados. No MVC, todas as funcionalidades do bancos de dados devem ser feitas por classes DAO.

Então crie um pacote chamado DAO (você já deve ter percebido que criar pacotes para cada parte do MVC é uma boa prática). Dentro do pacote crie uma classe chamada PessoaDAO, que deverá ter o corpo parecido com isto:

package DAO;

import java.sql.Connection;
import java.sql.PreparedStatement;
import java.sql.SQLException;
import java.util.List;
import javax.swing.JOptionPane;
import beans.Pessoa;
//Import que precisa ser corrigido
import Principal.Conexao;

public class PessoaDAO {

// Cria uma conexao
private Connection con;

// Inicializa a conexão no construtor
public PessoaDAO() throws SQLException {
con = Conexao.getConnection();
}

public void remove(Pessoa pessoa) {
}

public List/*Pessoa*/ retrieveAll() {
return null;
}

public Pessoa retrieveByID(String nome) {
return null;
}

public void update(Pessoa pessoa) {
}

public void save(Pessoa pessoa) {
// Aqui vamos fazer coisas legais!!!
}
}

A princípio esta classe poderá causar alguns erros. No início criamos a classe de conexão no pacote default, porém agora para importá-la precisamos que ela esteja em algum pacote. Então crie um pacote chamado Principal e arraste as classes Principal e Conexao para este novo pacote. Outra coisa a ser corrigida é na linha 25 onde tem o método retrieveAll veja que o tipo da lista está comentado /*Pessoa*/ mas deveria estar sem comentar e entre os sinais de maior e menor como pede a sintaxe. Tive que deixar assim porque o blog estava achando que era uma tag de html e causando erro no código.
Esta classe tem vários métodos para manipular os registros do banco de dados. Observe que todos eles utilizando o bean Pessoa como parâmetro. Neste exemplo não vou mostrar como implementar todos eles, mas somente o save (no código que vou disponibilizar para download possui o remove também). Os outros métodos, depois você conseguirá fazer seguindo o mesmo exemplo do save e com mais algum conhecimento em linguagem SQL. Vejamos como ficará o nosso método save então:

public void save(Pessoa pessoa) {
 // Pega a conexão estabelecida
 Connection conn = this.con;
 // Cria um PreparedStatement
 PreparedStatement pstm = null;

 try {
  // Monta a string sql
  String sql = "Insert into Pessoa(Nome,Telefone) values(?,?);";

  /*
   * Lembrando que esta string pode ser montada diretamente com os
   * valores recebidos de pessoa por exemplo:
   * "Insert into Pessoa(Nome,Telefone) values(" + pessoa.getNome() +
   * "... mas usamos os ? ? para uma maior segurança.
   */

  // Passa a string para o PreparedStatement
  pstm = conn.prepareStatement(sql);

  // Coloca os verdadeiros valores no lugar dos ?, ?
  pstm.setString(1, pessoa.getNome());
  pstm.setString(2, pessoa.getTelefone());
  // Executa
  pstm.execute();
  // Retorna uma mensagem
  JOptionPane.showMessageDialog(null, "Dados salvos com sucesso!",
    "Salvar", JOptionPane.INFORMATION_MESSAGE);
 } catch (SQLException e) {
  // Retorna uma mensagem informando o erro
  JOptionPane.showMessageDialog(null,
    "Não foi possível salvar os dados!\nInformações sobre o erro: "
      + e, "Salvar", JOptionPane.ERROR_MESSAGE);
  e.printStackTrace();
 }
}

Dica: Para achar o método olhe a parte direita na interface do Eclipse chamada Outline e procure por main (serve pra encontrar outros métodos ou variáveis também).
Agora sempre que o programa for iniciado uma conexão será aberta (e na finalização seria interessante fechar esta conexão mas por hoje não vou mostrar como fazer).

Inserindo Dados

A inserção de dados deverá ocorrer sempre que o botão salvar for acionado. Então vamos chamar o código sempre que este evento acontecer. Para isto clique com o botão direito no botão salvar e Events > actionPerformed. Será gerado um código igual a este:

  btSalvar.addActionListener(new java.awt.event.ActionListener() {
   public void actionPerformed(java.awt.event.ActionEvent e) {
    System.out.println("actionPerformed()"); // TODO Auto-generated Event stub actionPerformed()
   }
  });

Sempre que o botão for clicado este método será executado. No código gerado ele cria um System.out.println("actionPerformed()"); como padrão. Apague esta linha e coloque o seguinte código no lugar:

//Criamos um bean
    Pessoa pessoa = new Pessoa(txNome.getText(), txTelefone.getText());
   
    /* Passou os parâmetros pelo construtor mas
     * poderia ter um construtor vazio e passar
     * por metodo set.
     */
    //Vai criar o DAO e inserir
    try {
    
     PessoaDAO pessoaDAO = new PessoaDAO();
     pessoaDAO.save(pessoa); //Aqui é o pulo do gato
    
     //Limpa as caixas
     txNome.setText("");
     txTelefone.setText("");
     //Nome pede o focus
     txNome.requestFocus();
    
    } catch (SQLException e1) {
     // TODO Auto-generated catch block
     e1.printStackTrace();
    }

O código poderá apresentar alguns erros devidos aos imports, neste caso verifique se no canto esquedo da linha que causa o erro mostra um pequeno ícone com uma lâmpada e um X. Clique neste ícone e um menu com soluções vai aparecer, então dê dois cliques na primeira solução que será 'Import PessoaDAO' (DAO). Veja:

Feito isto finalmente podemos executar nossa aplicação. Clique com o botão direito no código e Run As > Java Application 1.
Se tudo ocorrer bem o programa irá rodar e se conectar ao banco. Para testar digite dados nos campos e clique em salvar. Se os dados forem salvos uma mensagem será mostrada informando o sucesso da operação:

Mas os campos não limparam depois de salvar. Para fazer isto coloque dentro do seu try logo após chamar o save, o código:

//Limpa as caixas
txNome.setText("");
txTelefone.setText("");
//Nome pede o focus
txNome.requestFocus();

Como ter certeza que os dados foram inseridos no banco? Para saber se os dados foram todos salvos volte ao Workbench, vá em File > New Script Tab. Vamos utilizar uma simples sentença de pesquisa:

SELECT * FROM PESSOA;

Mande executar. Se a inserção funcionou então deveremos ver os dados retornados como na figura:

Se por algum motivo os dados não forem salvos, possivelmente será mostrada uma mensagem com informações relevantes sobre o erro ocorrido. Se por acaso não salvar e mesmo assim nenhuma mensagem de erro não aparecer tente verificar se a sentença SQL está correta. Para fazer isto coloque o comando abaixo antes que o execute seja chamado no DAO:

JOptionPane.showMessageDialog(null, pstm);

Fazendo isto você vai mostrar uma mensagem com a string SQL antes de executar e poderá verificar se tem algo de errado com ela. No exemplo mostrado dificilmente você vai errar porque tem poucos parâmetros mas em programas maiores é sempre bom conferir se a montagem está correta.
Agora tente executar uma nova inserção com o mesmo nome. Uma mensagem de erro será mostrada:

Como o campo nome foi definido como PRIMARY KEY (chave primária) e houve uma tentativa de violar a chave, uma exceção foi lançada.

Conclusão

Sei que é muita informação para um post só mas é isso aí. Tentei passar de uma forma bem simples e espero ter contribuído. Aqui vai o código fonte do projeto pra quem quiser dar uma olhada. Até a próxima!