Codificando uma interface gráfica de usuário Java simples

Uma interface gráfica do usuário (GUI) criada usando o Plataforma Java NetBeans é composto de várias camadas de recipientes. A primeira camada é a janela usada para mover o aplicativo pela tela do seu computador. Isso é conhecido como contêiner de nível superior e seu trabalho é fornecer a todos os outros contêineres e componentes gráficos um local para trabalhar. Normalmente, para um aplicativo de desktop, esse contêiner de nível superior será fabricado usando o

classe.

Você pode adicionar qualquer número de camadas ao seu design de GUI, dependendo de sua complexidade. Você pode colocar componentes gráficos (por exemplo, caixas de texto, etiquetas, botões) diretamente no

, ou você pode agrupá-los em outros contêineres.

As camadas da GUI são conhecidas como hierarquia de contenção e podem ser pensadas como uma árvore genealógica. Se o

é o avô sentado no topo, então o próximo contêiner pode ser considerado o pai e os componentes que ele guarda como filhos.

Neste exemplo, criaremos uma GUI com um

instagram viewer

contendo dois

e um

. O primeiro

realizará um

. O segundo

realizará um

e um

. Apenas um

(e, portanto, os componentes gráficos que ele contém) serão visíveis por vez. O botão será usado para mudar a visibilidade dos dois

Existem duas maneiras de criar essa GUI usando o NetBeans. O primeiro é digitar manualmente o código Java que representa a GUI, discutido neste artigo. O segundo é usar a ferramenta NetBeans GUI Builder para criar GUIs Swing.

Para obter informações sobre o uso do JavaFX em vez do Swing para criar uma GUI, consulte O que é JavaFX?

Nota: O código completo deste projeto está em Exemplo de código Java para criar um aplicativo GUI simples.

Configurando o projeto NetBeans

Crie um novo Java Projeto de aplicativo no NetBeans com uma classe principal Vamos chamar o projeto

Ponto de verificação: Na janela Projetos do NetBeans, deve haver uma pasta GuiApp1 de nível superior (se o nome não estiver em negrito, clique com o botão direito do mouse na pasta e escolha

). Sob o

pasta deve ser uma pasta Pacotes de Origem com

chamado GuiApp1. Esta pasta contém a classe principal chamada

.Java.

Antes de adicionar qualquer código Java, adicione as seguintes importações na parte superior do

classe, entre o

linha e o

Essas importações significam que todas as classes necessárias para criar esse aplicativo GUI estarão disponíveis para uso.

No método principal, adicione esta linha de código:

Isso significa que a primeira coisa a fazer é criar um novo

objeto. É um atalho interessante, por exemplo, programas, pois precisamos apenas de uma classe. Para que isso funcione, precisamos de um construtor para o

classe, então adicione um novo método:

Nesse método, colocaremos todo o código Java necessário para criar a GUI, o que significa que todas as linhas a partir de agora estarão dentro do

método.

Nota de projeto: Você pode ter visto o código Java publicado que mostra a classe (ou seja,

) estendido de

. Essa classe é usada como a janela principal da GUI para um aplicativo. Realmente não há necessidade de fazer isso para um aplicativo GUI normal. A única vez em que você deseja estender o

classe é se você precisar criar um tipo mais específico de

(dê uma olhada

para obter mais informações sobre como criar uma subclasse).

Como mencionado anteriormente, a primeira camada do GUI é uma janela de aplicativo feita a partir de um

. Para criar um

objeto, chame o

construtor:

Em seguida, definiremos o comportamento de nossa janela de aplicativo da GUI, usando estas quatro etapas:

1. Certifique-se de que o aplicativo seja fechado quando o usuário fechar a janela para que ele não continue a ser desconhecido em segundo plano:

2. Defina um título para a janela para que a janela não tenha uma barra de título em branco. Adicione esta linha:

3. Defina o tamanho da janela, para que ela seja dimensionada para acomodar os componentes gráficos que você coloca nela.

Nota de projeto: Uma opção alternativa para definir o tamanho da janela é chamar o

método do

classe. Este método calcula o tamanho da janela com base nos componentes gráficos que ela contém. Como esse aplicativo de amostra não precisa alterar o tamanho da janela, usaremos apenas o

método.

4. Centralize a janela para aparecer no meio da tela do computador para que ela não apareça no canto superior esquerdo da tela:

Adicionando os dois JPanels

As duas linhas aqui criam valores para o

objetos que criaremos em breve, usando dois

matrizes. Isso facilita o preenchimento de algumas entradas de exemplo para esses componentes:

Crie o primeiro objeto JPanel

Agora, vamos criar o primeiro

objeto. Ele conterá um

e um

. Todos os três são criados por meio de seus métodos construtores:

Notas nas três linhas acima:

o
```
JPanel
```
variável é declarada final. Isso significa que a variável pode conter apenas o
```
JPanel
```
que é criado nesta linha. O resultado é que podemos usar a variável em uma classe interna. Ficará aparente o motivo pelo qual queremos mais adiante no código.
o
```
JLabel
```
e
```
JComboBox
```
têm valores passados a eles para definir suas propriedades gráficas. O rótulo aparecerá como "Fruits:" e a caixa de combinação agora terá os valores contidos no
```
fruitOptions
```
matriz declarada anteriormente.
o
```
adicionar()
```
método do
```
JPanel
```
coloca componentes gráficos nele. UMA
```
JPanel
```
usa o FlowLayout como padrão gerente de layout. Isso é bom para este aplicativo, pois queremos que o rótulo fique ao lado da caixa de combinação. Desde que adicionemos o
```
JLabel
```
primeiro, ficará bem:

Criar o segundo objeto JPanel

O segundo

segue o mesmo padrão. Nós vamos adicionar um

e um

e defina os valores desses componentes como "Legumes:" e o segundo

matriz

. A única outra diferença é o uso do

método para ocultar o

. Não esqueça que haverá um

controlando a visibilidade dos dois

. Para que isso funcione, é preciso estar invisível no início. Adicione essas linhas para configurar o segundo

Uma linha digna de nota no código acima é o uso do método

método do

. o

O valor faz com que a lista exiba os itens que ela contém em duas colunas. Isso é chamado de "estilo de jornal" e é uma boa maneira de exibir uma lista de itens em vez de uma coluna vertical mais tradicional.

Adicionando retoques finais

O último componente necessário é o

para controlar a visibilidade do

s. O valor passado no

O construtor define o rótulo do botão:

Este é o único componente que terá um ouvinte de evento definido. Um "evento" ocorre quando um usuário interage com um componente gráfico. Por exemplo, se um usuário clicar em um botão ou gravar texto em uma caixa de texto, ocorrerá um evento.

Um ouvinte de eventos diz ao aplicativo o que fazer quando o evento acontecer.

usa a classe ActionListener para "escutar" o clique de um botão pelo usuário.

Crie o ouvinte de evento

Como esse aplicativo executa uma tarefa simples quando o botão é clicado, podemos usar uma classe interna anônima para definir o ouvinte de evento:

Pode parecer um código assustador, mas você só precisa decompô-lo para ver o que está acontecendo:

Primeiro, chamamos o
```
addActionListener
```
método do
```
JButton
```
. Este método espera uma instância do
```
ActionListener
```
classe, que é a classe que escuta o evento.
Em seguida, criamos a instância do
```
ActionListener
```
classe declarando um novo objeto usando
```
novo ActionListener ()
```
e, em seguida, fornecendo uma classe interna anônima - que é todo o código dentro dos colchetes.
Dentro da classe interna anônima, adicione um método chamado
```
ação executada()
```
. Este é o método chamado quando o botão é clicado. Tudo o que é necessário neste método é usar
```
setVisible ()
```
para alterar a visibilidade do
```
JPanel
```
s.

Adicione os JPanels ao JFrame

Finalmente, precisamos adicionar os dois

areia

. Por padrão, um

usa o gerenciador de layout BorderLayout. Isso significa que existem cinco áreas (em três linhas) do

que pode conter um componente gráfico (NORTE, {OESTE, CENTRO, ORIENTE}, SUL). Especifique esta área usando o

método:

Defina o JFrame como visível

Por fim, todo o código acima será inútil se não definirmos o

ser visível:

Agora estamos prontos para executar o projeto NetBeans para exibir a janela do aplicativo. Clicar no botão alterna entre mostrar a caixa de combinação ou a lista.