IMPLEMENTAÇÃO DE COMPONENTES BÁSICOS COM SWING, UTILIZANDO NETBEANS

Maio 8, 2009

 

Neste exercício/guião iremos implementar um sistema simples de Registo com o objectivo de explicar como funciona os componentes básicos do framework swing (JTextField, JTextArea, JRadioButton, ButtonGroup, JCheckBox, JComboBox, etc), para isso utilizaremos a IDE NetBeans, para construir a interface, aprenderemos como manipular os métodos mais importantes para se trabalhar com estes componentes, e como manipular as suas propriedades.

 

Introdução

O NetBeans possui uma boa ferramenta para desenvolver a interface gráfica no estilo “Drag and drop” – Arrastar e soltar. Uma palete com diversos componentes disponíveis, onde se tem tem apenas que arrasta-los para dentro de seu Jframe e pronto! O NetBeans gera todo código automaticamente. No final deste guião será capaz de criar seu próprio projecto fazendo uso de inumeras aplicações possíveis com o construtor de interface do NetBeans.

 

Item 1: Criar um novo projeto do tipo ‘Java Desktop Application’

Através do menu File… crie um novo projecto.

Note que foi gerado um formulário, onde poderá construir toda a interface gráfica, pode redimensioná-la à vontade. Na barra de menu, a direita do ambiente de trabalho, terá dois grupos: Palete e Propriedades. Em palete estará todos os componentes que você pode usar para criar a interface gráfica.

 

Item 2: Construindo a Interface

 


 

 

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

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

JLabel: Permite inserir textos e imagens.

JTextField: Caixa de texto para que o utilizador 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 utilizador marcar várias opções ao mesmo tempo.

JComboBox: Componente semelhante a um vector, que permite ao utilizador escolher apenas uma opção.

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

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

 

Item 3: Explicando passo-a-passo

 

-No exemplo acima, estamos a usar todos os componentes mencionados anteriormente. O JPanel principal apresenta um título ‘Registo’, para colocarmos borda com título a um JPanel deve ir até o botão propriedades, à direita da tela, ou clicar com o botão direito do rato 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 ‘Registo’. Para o JPanel que contém os JCheckBox o tipo de borda é EtchedBorder.

 

- Para inserir qualquer componente dentro de um JPanel, 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’, 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, clique em ‘…’, depois botão ‘Import to Project’ e escolha a imagem que deseja adicionar a sua interface, de preferência em .jpg, em seguida apague o que estiver escrito na opção text para deixar somente a imagem.

 

- Ao transferir o projecto 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 do registo, 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 à esquerda da janela. 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 guião vamo-nos limitar apenas à implementação dos métodos necessários para a utilização dos componentes inseridos no projeto. Primeiramente, antes de começar a manipular o código, deve-se alterar o nome da 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, com o botão direito do rato escolha ‘Change variable name…’ e insira o nome que deseja.

No projecto 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 directamente no

tratamento de eventos.

 

Vamos implementar um evento no botão ‘Salvar’, onde os dados contidos em todos os componentes serão armazenados em um objecto, para isso deve criar uma classe auxiliar que apresente variáveis para todas as opções do Registo (Nome, endereço, sexo, etc), e instanciar o objecto, deverá criar métodos set e get para todas as variáveis, utilizaremos apenas 1 Registo (poderia utilizar array para armzenar vários registos, no entanto 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:

 

 

Repare que o NetBeans leva-o até à área de edição de código e gera 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-o automaticamente e não pode ser mudado.

 

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

 

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 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 Telefone.

 

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

 

obj.setEstado( (String)comboEstado.getSelectedItem() );

 

 

 

Para retornar o sexo (Masculino ou Feminino) deve ser feita uma verificação de qual JRadioButton foi marcado pelo utilizador, 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 );

 

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 utilizador:

 

JOptionPane.showMessageDialog(null,”Registo realizado com sucesso”);

 

O Registo está completo, agora vamos para os métodos de exibição.

 

Após os dados serem salvos deve apaga-los dos seus respectivos campos para usar os espaço para exibição (ou se quiser implementar mais que um registo). 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 vector, 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();

 

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 esteja implementando mais que um registo, utilizando uma array, seria interessante criar dois botões ‘Próximo’ e ‘Anterior’ para navegar entre os registos.

 

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

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

 

Ex.:

 

campoNome.setText( obj.getNome() );

 

- Repita isto 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 desta forma:

 

comboEstado.setSelectedItem( obj.getEstado() );

 

Para selecionar um JRadioButton e JCheckBox, utilizaremos o método setSelected(), devemos verificar qual opção sexual foi escolhida no registo 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 código 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.

 

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 registo e marcamos para exibição.

 

Construimos uma interface, aprendemos a tratar eventos, e inserimos os métodos mais importantes para manipular os componentes básicos da API swing.

4 Respostas para “IMPLEMENTAÇÃO DE COMPONENTES BÁSICOS COM SWING, UTILIZANDO NETBEANS”

  1. Funcky Jack disse

    Muito bom estas explicações.
    Deparei-me com esta página acidentalmente e posso dizer que é do melhor que eu já vi, para quem gosta de java.

  2. Bruno de Sousa Pastorello disse

    muito bom o tutorial !

  3. Alessandra disse

    Ola, meu nome é Alessandra. estou tentando aprender Java e no momento meu foco é o Swing para construir a parte visual. Seguindo o seu tuto surgiu uma duvida, aqui vc diz
    “Instancie fora do método criado pelo NetBeans o seu objecto:

    ClasseAuxiliar obj = new ClasseAuxiliar();”
    Nao compreendi esta parte, onde devo instanciar meu objeto ?
    Grata

    • humberto capela disse

      Repare na frase “deve criar uma classe auxiliar que apresente variáveis para todas as opções do Registo (Nome, endereço, sexo, etc), (…), deverá criar métodos set e get para todas as variáveis”

      Portanto deve criar uma nova class, com nome ClasseAuxiliar, clicando tecla direita sobre o package registo. Depois de criar a classe com as variáveis que vão guardar todas a informações do formulário, tem que criar um objeto do tipo classe auxiliar. Para isso basta ser (se não estou em erro) logo a seguir à definição da class registo view

      Seria:

      class registo view {

      ClasseAuxiliar obj = new ClasseAuxiliar();

      (…)

      //métodos para o evento salvar
      private void btSalvarActionPerformed(java.awt.event.ActionEvent evt)
      {
      obj.setNome( campoNome.getText() );
      }

      (…)

      }

Deixar um comentário

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Modificar )

Imagem do Twitter

You are commenting using your Twitter account. Log Out / Modificar )

Facebook photo

You are commenting using your Facebook account. Log Out / Modificar )

Connecting to %s

Seguir

Get every new post delivered to your Inbox.