h#p://www.guj.com.br 

 
 

Implementando componentes básicos com swing, utilizando NetBeans

 

Autor

Kaio Valente (ksmvalente@hotmail.com.br): Graduando em Bacharelado em Sistemas de Informação

(UFPA) e Tecnologia em Análise e Desenvolvimento de Software (CEFET-PA) – 3° semestre ambos

Gravata 
 
Neste tutorial iremos implementar um sistema simples de cadastro com o objetivo de
explicar como funciona os componentes básicos do framework swing (JTextField,
JTextArea, JRadioButton, ButtonGroup, JCheckBox, JComboBox, etc), para isso
utilizaremos a IDE NetBeans 5.5.1 para construir nossa interface, aprenderemos como
manipular os métodos mais importantes para se trabalhar com estes componentes, e
como manipular suas propriedades.

Introdução
 
Como sabemos, uma das partes mais complicadas e chatas para um programador é “desenhar” a
interface gráfica, ainda mais se tiver que fazê-la na mão, linha por linha, para nos poupar trabalho e
tempo o NetBeans possui uma fantástica ferramenta para desenvolvermos nossa interface gráfica no
estilo “Drag and drop” - Arrastar e soltar. Uma paleta com diversos componentes disponíveis, onde você
tem apenas que arrasta-la para dentro de seu Jframe e pronto! O NetBeans gera todo código para você
automaticamente. No final deste tutorial você será capaz de criar seu próprio projeto fazendo uso de
inumeras aplicações possíveis com o construtor de interface do NetBeans.

Estou usando neste tutorial o NetBeans 5.5.1 versão em português.

Item 1: Criando um JFrame.
Após criar um projeto clique com o botão direito do mouse sobre ele, em novo, escolha a opção
Formulário JFrame como na imagem abaixo.
  
h#p://www.guj.com.br 

 
 

Imagem 1. Criando um JFrame.

Note que será gerado pra você uma nova tela com uma caixa de edição, onde você irá construir toda sua
interface gráfica, pode redimensioná-la a vontade. Na barra de menu, a direita da tela, terá dois botões:
Propriedades e Paleta. Em paleta estará todos os componentes que você pode usar para criar sua
interface gráfica.
Item 2: Construindo a Interface

Como vamos fazer um sistema simples de cadastro, utilizaremos os seguintes componentes:

JPanel: Painel criado em cima do JFrame que permite entre outras opções, adicionar cor de fundo e
borda. É utilizado para organizar melhor sua interface.

JLabel: Permite inserir textos e imagens.

JTextField: Caixa de texto para que o usuário insira os dados no programa.

- Importante mencionar que todos os dados inseridos em um JTextField são tratados como String.
Portanto se for inserir um dado numérico é necessaria a devida conversão.

JTextArea: Campo semelhante ao JTextField, normalmente usado para entrada de textos maiores. Como
críticas, sugestões, etc.

JRadioButton: Botão que permite apenas seleção de uma opção quando relacionado a um ButtonGroup.

ButtonGroup: Componente utilizado para criar grupos de JRadioButtons.

JCheckBox: Caixas de multiplas seleções, permite o usuario marcar várias opções ao mesmo tempo.

JComboBox: Componente semelhante a um vetor, que permite ao usuário escolher apenas uma opção.
  
h#p://www.guj.com.br 

 
 

JButton: Botão onde serão implementados os eventos.

Agora que você já conhece os componentes, monte a interface abaixo:

Imagem 2. Construindo a interface gráfica.

Item 3: Explicando passo-a-passo

No exemplo acima, estamos usando todos os componentes mencionados anteriormente. O JPanel

principal apresenta um título ‘Cadastro’, para colocarmos borda com título a um JPanel você deve ir até o
botão propriedades, a direita da tela, ou clicar com o botão direito do mouse sobre o JPanel e ir até a
propriedade border, clique no botão com ‘...’ várias opções de borda serão exibidas, selecione
TitledBorder, e no campo Título escreva o título que desejar para o seu JPanel, no nosso exemplo
‘Cadastro’. Para o JPanel que contém os JCheckBox o tipo de borda é EtchedBorder.

- Para inserir qualquer componente dentro de um JPanel, você deve primeiro inserir o JPanel, em seguida
os componentes sobre ele. Outra maneira é arrastando os componentes de fora para dentro do JPanel.

Para inserir itens no JComboBox da opção ‘Estado’, você deverá ir na opção model em propriedades,
insira o nome do item que você quer que apareça e clique em adicionar.

Para inserir uma imagem, coloque um JLabel e na opção icon em propriedades, marque ‘Arquivo’, botão
‘Selecionar Arquivo’ e escolha a imagem que você deseja adicionar a sua interface, de preferência em
.gif, em seguida apague o que estiver escrito na opção text para deixar somente a imagem.
  
h#p://www.guj.com.br 

 
 

- Ao transferir seu projeto de um computador para outro, certifique-se de que o caminho da imagem seja o
mesmo neste computador.

Para permitir que seja marcada apenas uma opção nos JRadioButtons, da opção Sexo de nosso
cadastro, voce deve adicionar ao projeto o componente ButtonGroup, este componente não apresenta
nenhum tipo de interface, ao inseri-lo note que ele será adicionado no inspetor de componentes a
esquerda da tela. Em seguida vá até as propriedades dos JRadioButtons, opção buttonGroup e escolha
buttonGroup1 (nome padrão para este componente), faça isso para ambos os JRadioButtons.

- Para apagar os nomes que vêem dentro dos JTextField, JRadioButtons, JCheckBox e JButtons basta
dar duplo clique sobre eles e apagar o que está escrito, ou então na opção text em propriedades.

Item 4: Manipulando o código

Neste tutorial vou me limitar apenas a implementação dos métodos necessários para a utilização dos
componentes inseridos em nosso projeto.
Primeiramente, antes de começar a manipular o código, deve-se alterar o nome de variável de todos os
componentes que serão utilizados para processar os eventos (entenda ‘eventos’, como sendo
basicamente a funcionalidade que você dará a um botão), para que nosso código fique mais legível e
organizado.

Para alterar o nome de variável de um componente, clique sobre ele, como o botão direito do mouse
escolha ‘Alterar o nome de variável...’ e insira o nome que você deseja.

Em nosso projeto utilizaremos o seguinte padrão:

Para JTextField: campoNomeDaOpção – Ex: campoNome
Para JComboBox: comboNomeDaOpção – Ex: comboEstado
Para JRadioButton: rbNomeDaOpção – Ex: rbMasculino
Para JCheckBox: cbNomeDaOpção – Ex: cbMusica
Para JTextArea: campoNomeDaOpção – Ex: campoBiografia
Para JButton: btNomeDoBotão – Ex: btSalvar

- JLabels e JPanels não necessitam de alteração pois não serão implementados diretamente no
tratamento de eventos.

Muito bem, vamos implementar um evento no botão ‘Salvar’, onde os dados contidos em todos os
componentes serão armazenados em um objeto, para isso você deve criar uma classe auxiliar que
apresente variáveis para todas as opções do cadastro (Nome, endereço, sexo, etc), e instanciar o objeto,
você deverá criar métodos set e get para todas as variáveis (utilizaremos apenas 1 cadastro, mas você
pode fazer utilizando vetores ou arquivos), como disse anteriormente, o objetivo é ensinar os métodos
necessários a implementação dos componentes.

Para inserir um evento de clique a um botão, clique sobre ele, opção ‘Eventos’ > ‘Action’ >
‘actionPermormed’, veja na imagem abaixo:
  
h#p://www.guj.com.br 

 
 

Imagem 3. Adicionar evento de clique.

Repare que o NetBeans leva você até a área de edição de código e gera pra você o cabeçalho do método
que irá tratar o evento:

private void btSalvarActionPerformed(java.awt.event.ActionEvent evt) {

// TODO adicione seu código de manipulação aqui:
}
 
- Todo código com fundo azul o NetBeans gera automaticamente pra você e não pode ser mudado.

Instancie fora do método criado pelo NetBeans o seu objeto:

ClasseAuxiliar obj = new ClasseAuxiliar();

 
E começe a implementar o código dentro do método criado pelo NetBeans. Para receber os dados
inseridos em um JTextField você deve utilizar o método getText() da seguinte forma

obj.setText( campoNome.getText() );

Faça o mesmo para os campos Endereço, E-Mail e Fone.

Para retornar os campos de um JComboBox você deve utilizar o método getSelectedItem(). Entretanto
para armazenar em uma variável do tipo String você deve converte-lo para String, ficando assim:

obj.setEstado( (String)comboEstado.getSelectedItem() );
  
h#p://www.guj.com.br 

 
 

Para retornar o sexo (Masculino ou Feminino) deve ser feita uma verificação de qual JRadioButton foi
marcado pelo usuário, o método utilizado para isso é isSelected(), desta forma:

if ( rbMasculino.isSelected() )
obj.setSexo( "Masculino" );
else
obj.setSexo( "Feminino" );
Vamos agora para os JCheckBox, para saber quais foram marcados, você deve fazer uma verificação
para cada componente. O método utilizado para isso é o mesmo do JRadioButton, isSelected(), vamos
adotar que as variáveis de interesses foram declaradas do tipo boolean em sua classe auxiliar, ficando
desta maneira:

if ( cbMusica.isSelected() )
obj.setMusica( true );

if ( cbCinema.isSelected() )
obj.setCinema( true );

if ( cbEsporte.isSelected() )
obj.setEsporte( true );

if ( cbInformatica.isSelected() )
obj.setInformatica( true );

Muito bem, agora falta apenas o JTextArea, que é implementado igualmente ao JTextField usando o
método getText(), assim:

obj.setBiografia( campoBiografia.getText() );
 
Após ser implementado todo os componentes no evento do botão salvar, coloque uma mensagem de
confirmação para o usuário utilizando

JOptionPane.showMessageDialog(null,"Cadastro realizado com sucesso");

Não esqueça dos imports. Pronto o cadastro está completo, agora vamos para os métodos de exibição.

Após os dados serem salvos você deve apaga-los de seus respectivos campos para usar os espaço para
exibição (ou se você quiser implementar mais de um cadastro). Para isso pode-se criar um botão ‘Apagar’
ou simplesmente os dados serão apagados após serem salvos, que é como faremos aqui.

Para apagar o JTextField e o JTextArea utilização o método setText(), ficando desta forma:

campoNome.setText( “” );
comboEstado.setText( “” );

Um JComboBox funciona como se fosse um vetor, onde cada item fica em um índice, para desmarcar um
JComboBox utiliza-se o método setSelectedIndex(int i) que recebe como parâmetro um número inteiro
que representa o índice deste JComboBox. Para desmacar usa-se:

comboEstado.setSelectedIndex(-1);

O -1 indica que nenhum item está selecionado.

Para apagar o JRadioButton selecionado, deve-se apagar o grupo inteiro, ou seja o ButtonGroup, para
isso utilizamos o método clearSelection(), da seguinte forma:

if ( rbMasculino.isSelected() || rbFeminino.isSelected() )
buttonGroup1.clearSelection();
  
h#p://www.guj.com.br 

 
 

O código assima verifica se algum dos JRadioButtons estão selecionados, se verdadeiro, apaga a
seleção.

Agora só falta apagar os JCheckBox que foram marcados, para isso basta verificar cada um para ver se
estão marcados e então, desmarcar. Utilizando o método setSelected( boolean b ), pode-se mudar o
estado de um JCheckBox, onde o parâmetro é do tipo boolean e true representa opção marcada, e false
desmarcada.

If ( cbMusica.isSelected() )
cbMusica.setSelected( false );

If ( cbCinema.isSelected() )
cbMusica.setSelected( false );

If ( cbEsporte.isSelected() )
cbMusica.setSelected( false );

If ( cbInformatica.isSelected() )
cbMusica.setSelected( false );

Pronto! Todos os campos serão apagados após serem salvos, e agora podemos exibir os dados
armazenados.

Item 5: Exibindo Dados

Para exibir os dados que foram armazenados usaremos os mesmos campos onde são preenchidos os
dados (os componentes), caso você esteja implementando mais de um cadastro, utilizando vetor ou
arquivos, seria interessante criar dois botões ‘Próximo’ e ‘Anterior’ para navegar entre os cadastros, mas
isso fica para uma próxima oportunidade, como disse anteriormente o objetivo desde tutorial é familiarizar
você com os principais componentes e aprender os métodos necessários para implementá-los.

Primeiramente devemos criar um evento para o botão ‘Limpar’ da mesma forma que foi feito para o botão
‘Salvar’. Dentro do método gerado pelo NetBeans vamos implementar nosso código.

Para exibir em um JTextField e JTextArea, utiliza-se o método setText()

Ex.:
campoNome.setText( obj.getNome() );

- Repita isso para todos os JTextField e para o JTextArea. Atenção para o nome de variável do
componente.

Para alterar o estado de um JComboBox usamos o método setSelectedItem(), ficando deste jeito:

comboEstado.setSelectedItem( obj.getEstado() );

Para selecionar um JRadioButton e JCheckBox, utilizaremos o método setSelected(), devemos verificar

qual opção sexual foi escolhida no cadastro e quais opções foram marcadas nos Interesses, e então
selecioná-las, nosso código ficará assim:

if ( obj.getSexo() == "Masculino" )
rbMasculino.setSelected(true);
else
rbFeminino.setSelected(true);
 
O trecho acima verifica se a variável sexo é iqual a “Masculino” (como definimos no evento do botão
salvar) , então marca o JRadioButton, senão, marca o JRadionButton referente ao sexo feminino.
  
h#p://www.guj.com.br 

 
 
Para os JCheckBoxs:

If ( obj.getMusica == true )
cbMusica.setSelected(true);

If ( obj.getCinema == true )
cbCinema.setSelected(true);

If ( obj.getEsporte == true )
cbEsporte.setSelected(true);

If ( obj.getInformatica == true )
cbInformatica.setSelected(true);

Verificamos qual dos interesses foram salvos no cadastro e marcamos para exibição.

Bom é isso ai, chegamos no fim... Construimos nossa interface, aprendemos a tratar eventos, e inserimos
os métodos mais importantes para manipular os componentes básicos da API swing.

Espero que tenham entendido. Até a próxima!

Kaio Valente