JLabel - Como criar rótulos com textos e imagens em frames

Agora que aprendemos os conceitos básicos de JFrame e JPanel, bem como ensinamos como fazer alguns desenhos interessantes em Java, já estamos um pouco familiarizados com a programação gráfica em Java.

Agora vamos mostrar os principais componentes do pacote Swing.
Neste artigo de nosso apostila, vamos ensinar como colocar textos (JLabel) e imagens (Icon e ImageIcon).

JLabel - Exibindo rótulos (Textos e Imagens)

Como primeiro, mais básico e simples, componente de um aplicativo do tipo GUI que iremos ensinar aqui em nossa apostila de Java, os JLabels são rótulos que podemos exibir em nossos frames.
São elementos estáticos, não sendo usado para interagir com o usuário.

Bem comum de serem vistos quando vamos instalar algum aplicativo de alguma empresa famosa, onde é possível ver um JLabel com texto e imagem, do programa/corporação.

Ou seja, um rótulo em programação Java é o mesmo que no mundo real, um texto e/ou imagem.
Pense em um rótulo de automóvel ou loja, geralmente é um texto (nome) e uma imagem (slogan).

Os JLabels são classes derivadas da JComponent e fazem parte do pacote swing.
Logo, para usar, fazemos o import:
import javax.swing.JLabel;

Vamos colocar labels em frames, para fazermos testes.
Portanto, precisamos fazer o import do JFrame também:
import javax.swing.JFrame;



JLabel só com String

Vamos criar rótulos.
No primeiro exemplo, vamos criar um label que só exiba um simples texto.

Para fazer isso, vamos criar uma classe chamada "Rotulo", que vai herdar a classe JFrame.
Declaramos o JLabel da seguinte maneira:
private JLabel texto;

Como podemos ver na documentação do JLabel, podemos inicializar um JLabel passando só a String de texto, só a imagem, uma string e um texto, uma string e um inteiro, uma imagem e uma inteiro ou podemos inicializar a JLabel passando tudo: uma imagem, um texto e um inteiro.
Esse inteiro é o alinhamento que o JLabel vai ter no JFrame.

Como esse exemplo queremos apenas fornecer uma String, inicializamos nosso JLabel dentro do construtor da classe "Rotulo": 
texto = new JLabel("Meu primeiro JLabel!");

Criado o componente JLabel, vamos adicioná-lo ao nosso JFrame, através do método add:
add(texto);

Tudo isso dentro de nosso construtor, que também fornece uma String que será o título do JFrame:
super("Usando rótulos em JFrame");

Na nossa main, criamos um objeto do tipo Rotulo, o rotulo1, tornamos ele visível, fazemos com que ele feche quando clicamos no botão close e definimos um tamanho de nosso JFrame.

Assim, o código de nosso programa fica:

GUI.java

import javax.swing.JFrame;

public class GUI {
 public static void main(String[] args) {
  Rotulo label1 = new Rotulo();
  
  label1.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
  label1.setSize(300,100);
  label1.setVisible(true);
 }
}

Rotulo.java

import javax.swing.JFrame;
import javax.swing.JLabel;

public class Rotulo extends JFrame{
 private JLabel texto;
  
 public Rotulo(){
  super("Usando rótulos em JFrame");
  
  texto = new JLabel("Meu primeiro JLabel!");
  add(texto);
 }
}

JLabel só com imagem

Agora vamos aprender uma coisa bem bacana: colocar imagens de nosso computador em aplicativos gráficos em Java.
De início, vamos usar imagens simples, de rótulos, que são os ícones.

Vamos usar a seguinte imagem, que é o favicon do curso Java Progressivo:
Usando ícones em JFrames em Java
Salve com o nome "xicara.png".
Agora uma coisa importante: coloque esta imagem dentro da pasta de seu projeto.
Ela deve ficar na pasta que tem as pastas 'bin' e 'src' de seu projeto.

Para manipular este tipo de imagem, precisamos usar as classe Icon e ImageIcon, do pacote swing:
import javax.swing.Icon; 
import javax.swing.ImageIcon;

Vendo a documentação, percebemos que o JLabel recebe imagens que são objetos da classe Icon.
Vamos criar tal objeto, chamando-o de "xicara", e fazendo o polimorfismo, fazendo o objeto "xicara" ser um objeto específico da classe ImageIcon.

Como argumento, passamos a URL da imagem.
Como esta URL está na pasta do projeto, apenas colocamos o nome e extensão da imagem.
Assim, nosso objeto da classe Icon é declarado da seguinte maneira:
Icon xicara = new ImageIcon("xicara.png");

Tendo o objeto "xicara", passamos ele para o nosso JLabel "imagem":
imagem = new JLabel(xicara);
E adicionamos nosso JLabel ao nosso JFrame.

Assim, o código Java do aplicativo que exibe um rótulo composto de uma imagem de nosso HD é:

Rotulo.java

import javax.swing.JFrame;
import javax.swing.JLabel;
import javax.swing.Icon; 
import javax.swing.ImageIcon;

public class Rotulo extends JFrame{
 private JLabel imagem;
  
 public Rotulo(){
  super("Usando rótulos em JFrame");
  
  Icon xicara = new ImageIcon("xicara.png");
  imagem = new JLabel(xicara);
  add(imagem);

 }
}

Note que não precisamos mudar em nada a main, pois ela só cria o JFrame, e para um JFrame um JLabel é um label, tendo imagem, texto ou ambos. Aliás, JLabel é um JComponent, assim como os JButtons, por exemplo.
São todos herdados da mesma superclasse, e se comportam da mesma maneira.

JLabel com imagem e texto

Agora vamos fazer os dois: criar um JLabel com String e imagem.
Porém, a coisa começa a ficar um pouco mais complicada devido ao local da String e da Imagem.

Para usar JLabel com Icon e String, precisamos usar o conceito de alinhamento.
Existem dois tipos: o horizontal e o vertical.
Todos essas posições são números inteiros, mas não precisamos nos preocupar com tais valores.

Para isso, vamos usar as constantes da SwingConstants:
import javax.swing.SwingConstants; 

Na horizontal, existem as posições:
SwingConstants.LEFT, SwingConstants.CENTER e SwingConstants.RIGHT

Na vertical, existem as posições:
SwingConstants.TOP, SwingConstants.CENTER e SwingConstants.BOTTOM

O construtor do JLabel recebe um inteiro que representa o alinhamento horizontal.
Ou seja, se o Label vai ficar na esquerda, no centro ou na direita.

O outro tipo de alinhamento é o vertical, que vai definir de se o JLabel vai ficar em cima, no meio ou na parte de baixo do frame.
Para mudarmos o alinhamento vertical, usamos o método: setVerticalAlignment
Esse método recebe uma das três constantes: SwingConstants.TOP, SwingConstants.CENTER e SwingConstants.BOTTOM

Um outro conceito que devemos saber é o da posição da String e da Imagem.
Se você pensar, pode ser que queiramos a imagem em cima do texto, embaixo ou ao lado.

Para ter controle desse posicionamento, existem dois método: 
  • setHorizontalTextPosition -> define a posição do texto, na horizontal (se vai ficar a esquerda ou direita da imaagem)
  • setVerticalTextPosition -> define a posição do texto, na vertical (se o texto vai ficar abaixo ou acima da imagem)

Para definir o alinhamento horizontal no centro, podemos passar a constante já no construtor:
label = new JLabel("Símbolo do Java", xicara, SwingConstants.CENTER);

Para que a posição do texto seja centralizada, fazemos:
label.setHorizontalTextPosition( SwingConstants.CENTER );

E finalmente, se eu quiser que o texto fiquei abaixo da imagem, fazemos:
label.setVerticalTextPosition(SwingConstants.BOTTOM);

Nosso código fica:

Rotulo.java

import javax.swing.JFrame;
import javax.swing.JLabel;
import javax.swing.Icon; 
import javax.swing.ImageIcon;
import javax.swing.SwingConstants;

public class Rotulo extends JFrame{
 private JLabel label;
  
 public Rotulo(){
  super("Usando rótulos em JFrame");

  Icon xicara = new ImageIcon("xicara.png");
  label=new JLabel("Símbolo do Java", xicara, SwingConstants.CENTER);
  label.setHorizontalTextPosition( SwingConstants.CENTER );
  label.setVerticalTextPosition( SwingConstants.BOTTOM );
  
  add(label);

 }
}

E o resultado é o esperado:

Como colocar textos e imagens em um JFrame

2 comentários:

  1. Precisei colocar o caminha da imagem, para localiza-la, apenas como você fez não me mostrou nada.
    Porém, estou acompanhando totalmente os passos, e a cada dia me interesso mais pela linguagem...
    Muito boa as aulas... Top

    Cláudia

    ResponderExcluir
  2. Você precisou colocar o caminho provavelmente porque a imagem não estava dentro da mesma pasta do projeto. Se estivesse dentro da mesma pasta bastaria ter colocado o nome da imagem, como no exemplo do site.

    ResponderExcluir