Tipos de componentes gráficos en Java

Hola a todos, hoy os explicare los tipos componentes gráficos en Java.
Como hemos visto hasta ahora, podemos insertar varios tipos de componentes, vamos a ver algunos ejemplo.

Usaremos la forma simple de crearlos, si quieres mas detalles puedes consultar el API de Java, buscando la clase dentro del paquete javax.swing.

También pueden tener métodos específicos, si hay alguno especial que debas saber, te lo diremos. Recuerda que lo normal para insertar un componente sera crear un objeto de esa clase, situarlo en una posición del panel y añadirlo al panel.

Este es un ejemplo de una aplicación gráfica, puedes ayudarte del plugin de Eclipse Windows builder:

import javax.swing.*;

public class AplicacionGrafica extends JFrame{

	/**
	 * Panel de la aplicacion
	 */
	private JPanel contentPane;
	public AplicacionGrafica(){

		//Añade un titulo, no es estrictamente necesario
		setTitle("Titulo de la ventana");

		/*
		 * Coordenadas x y de la aplicacion y su altura y longitud,
		 * si no lo indicamos aparecera una ventana muy pequeña
		 */
		setBounds(400, 200, 607, 448);

		/*
		 * Indica que cuando se cierre la ventana se acaba la aplicacion,
		 * si no lo indicamos cuando cerremos la ventana la aplicacion seguira funcionando
		 */
		setDefaultCloseOperation(EXIT_ON_CLOSE);

		//Hace visible la ventana, si no lo hacemos no veremos la aplicacion
		setVisible(true);

		//Creamos el panel
		contentPane =new JPanel();

		//Indicamos su diseño
		contentPane.setLayout(null);

		//asigno el pannel a la ventana
		setContentPane(contentPane);

	}

	public static void main(String[] args) {
		AplicacionGrafica ventana=new AplicacionGrafica();

	}

}

Estos tipos son los mas comunes:

  • Etiqueta: se crean con la clase JLabel, le pasamos como parámetro una cadena que sera el contenido de la etiqueta. Veamos un ejemplo.
JLabel etiqueta=new JLabel("¡Hola mundo!");
etiqueta.setBounds(60, 20, 100, 20);
contentPane.add(etiqueta);

ejemplo componente 1

  • Campo de texto: se crean con la clase JTextField, nos permite que el usuario introduzca un texto, que podemos utilizar para nuestra aplicación. Veamos un ejemplo:
textField = new JTextField();
textField.setBounds(43, 67, 86, 26);
contentPane.add(textField);

ejemplo componente 2

  • Botón: se crea con la clase JButton, le pasamos una cadena como parámetro el nombre que contendrá el botón. Veamos un ejemplo:
JButton btnPulsame = new JButton("Pulsame");
btnPulsame.setBounds(43, 133, 89, 23);
contentPane.add(btnPulsame);

ejemplo componente 3

  • Botón radio: se crea con la clase JRadioButton, le pasamos una cadena para indicar su nombre, también le podemos pasar un booleano, indicando si esta marcado por defecto. NOTA: es importante agrupar estos botones para formen parte de uno, es decir, que no podamos marcar mas de dos, para ello creamos un objeto ButtonGroup y con el metodo add vamos añadiendo botones. Veamos un ejemplo:
JRadioButton rdbtnOpcion= new JRadioButton("Opcion 1", true);
				rdbtnOpcion.setBounds(43, 194, 109, 23);
				contentPane.add(rdbtnOpcion);

				JRadioButton rdbtnOpcion_1 = new JRadioButton("Opcion 2", false);
				rdbtnOpcion_1.setBounds(43, 220, 109, 23);
				contentPane.add(rdbtnOpcion_1);

				JRadioButton rdbtnOpcion_2 = new JRadioButton("Opcion 3", false);
				rdbtnOpcion_2.setBounds(43, 246, 109, 23);
				contentPane.add(rdbtnOpcion_2);

				ButtonGroup bgroup = new ButtonGroup();
				bgroup.add(rdbtnOpcion);
				bgroup.add(rdbtnOpcion_1);
				bgroup.add(rdbtnOpcion_2);
  • Botón checkbox: se crean con la clase JCheckBox, le pasamos como parámetro una cadena para indicar su nombre, también un booleana indicando su estado inicial, recuerda que pueden estar varios marcados. Veamos un ejemplo:
JCheckBox chckbxOpcion = new JCheckBox("Opcion1", true);
chckbxOpcion.setBounds(43, 305, 97, 23);
contentPane.add(chckbxOpcion);

JCheckBox chckbxNewCheckBox = new JCheckBox("Opcion 2", true);
chckbxNewCheckBox.setBounds(43, 325, 97, 23);
contentPane.add(chckbxNewCheckBox);

JCheckBox chckbxOpcion_1 = new JCheckBox("Opcion3", false);
chckbxOpcion_1.setBounds(43, 346, 97, 23);
contentPane.add(chckbxOpcion_1);

ejemplo componente 5

  • Texto de área:  se crea con la clase JTextArea, le podemos pasar como parámetro una cadena con el texto que aparecerá por defecto. Si queremos que se baje la palabra al terminar la linea, usaremos el método setLineWrap(true); invocado desde el objeto TextArea. Si queremos que cuando que cuando baje lo haga la palabra entera en lugar de caracteres sueltos, usaremos el método setWrapStyleWord(true);. Veamos un ejemplo:
JTextArea textArea = new JTextArea("prueba");
textArea.setBounds(189, 18, 141, 117);
textArea.setWrapStyleWord(true);
textArea.setLineWrap(true);
contentPane.add(textArea);

Si ejecutas hasta aquí, veras que al escribir demasiado baja y ya no vemos lo que escribimos, por eso podemos añadir un scroll (clase JScrollPane) para que nos aparezca un scroll cuando se pase. Escribiremos lo siguiente:

JScrollPane scroll = new JScrollPane(textArea); //Objeto
scroll.setBounds(189, 18, 141, 117); //Misma coordenadas y tamaño que el objeto
contentPane.add(scroll);

ejemplo componente 6

  • Campo de password: se crea con la clase JPasswordField, le podemos pasar una cadena con el texto por defecto. El texto que insertemos aparecerán puntos, muy usados para contraseñas. Veamos un ejemplo:
JPasswordField pwd = new JPasswordField("fernando");
pwd.setBounds(189, 171, 139, 20);
contentPane.add(pwd);

ejemplo componente 7

  • Menú de selección: se crea con la clase JComboBox, esta es una clase parametrizada por lo que es recomendable indicar el tipo de dato a almacenar. Para añadir elementos, usaremos el método addItem(“elemento”);  donde elemento sera lo que queremos introducir en el combobox. Veamos un ejemplo:
JComboBox comboBox = new JComboBox<>();
comboBox.setBounds(189, 221, 141, 22);
contentPane.add(comboBox);

comboBox.addItem("Fernando");
comboBox.addItem("Alberto");
comboBox.addItem("Arturo");

ejemplo componente 8

  • Interruptor: se crea con la clase JToggleButton, nos permite usarlo como si fuera un interruptor, si esta pulsado es true y si no lo esta es false. Le podemos pasar una cadena con el texto por defecto, también un booleano para indicar si esta pulsado o no por defecto.
JToggleButton tglbtnNewToggleButton = new JToggleButton("Interruptor", true);
tglbtnNewToggleButton.setBounds(189, 291, 121, 23);
contentPane.add(tglbtnNewToggleButton);

ejemplo componente 9

  • JSpinner: se crea con la clase JSpinner, nos sirve para llevar un contador, podemos aumentar o disminuir una cantidad. Veamos un ejemplo:
JSpinner spinner = new JSpinner();
spinner.setBounds(371, 20, 29, 20);
contentPane.add(spinner);

ejemplo componente 10

  • Lista: se crea con la clase JList, es una clase parametrizada por lo que es recomendable indicar el tipo de dato a almacenar. Hay varias formas de construir este componente, pero lo mas sencillo, es pasandole un array de objetos, por ejemplo, un array de String. También le añadiremos un scroll, como vimos antes. Veamos un ejemplo:
//Arrays de String
String pelis[]={"Star wars: la venganza de los siths", "El señor de los anillos: el retorno del rey", "Guerra mundial Z", "Revolution", "007: Todo o Nada"};

JList list = new JList<>(pelis);
list.setBounds(371, 72, 86, 80);
contentPane.add(list);

ejemplo componente 11

Si usas Windows Builder, es posible que aparezca un error al colocar el diseño de nuevo, se debe a parametrizar un componente JList, si lo dejas sin parametrizar podrás volver a acceder, aunque este parametrizada si ejecutas el programa, funciona.

Hay muchos mas componentes, alguno de ellos , lo comentaremos en otros posts con mas profundidad.

Os dejo el ejemplo completo:

import java.awt.EventQueue;
import javax.swing.*;

public class EjemploWindowsBuilder extends JFrame {

	private JPanel contentPane;
	private JTextField textField;

	/**
	 * Launch the application.
	 */
	public static void main(String[] args) {
		EventQueue.invokeLater(new Runnable() {
			public void run() {
				try {
					EjemploWindowsBuilder frame = new EjemploWindowsBuilder();
					frame.setVisible(true);
				} catch (Exception e) {
					e.printStackTrace();
				}
			}
		});
	}

	/**
	 * Create the frame.
	 */
	public EjemploWindowsBuilder() {
		//Añade un titulo, no es estrictamente necesario
				setTitle("Titulo de la ventana");

				/*
				 * Coordenadas x y de la aplicacion y su altura y longitud,
				 * si no lo indicamos aparecera una ventana muy pequeña
				 */
				setBounds(400, 200, 607, 448);

				/*
				 * Indica que cuando se cierre la ventana se acaba la aplicacion,
				 * si no lo indicamos cuando cerremos la ventana la aplicacion seguira funcionando
				 */
				setDefaultCloseOperation(EXIT_ON_CLOSE);

				//Hace visible la ventana, si no lo hacemos no veremos la aplicacion
				setVisible(true);

				//Creamos el panel
				contentPane =new JPanel();

				//Indicamos su diseño
				contentPane.setLayout(null);

				//asigno el pannel a la ventana
				setContentPane(contentPane);

				//Creacion de componentes

				//Etiqueta
				JLabel etiqueta=new JLabel("¡Hola mundo!");
				etiqueta.setBounds(60, 20, 100, 20);
				contentPane.add(etiqueta);

				//Campo de texto
				textField = new JTextField();
				textField.setBounds(43, 67, 86, 26);
				contentPane.add(textField);

				//Boton
				JButton btnPulsame = new JButton("Pulsame");
				btnPulsame.setBounds(43, 133, 89, 23);
				contentPane.add(btnPulsame);

				//Boton de radio
				JRadioButton rdbtnOpcion= new JRadioButton("Opcion 1", true);
				rdbtnOpcion.setBounds(43, 194, 109, 23);
				contentPane.add(rdbtnOpcion);

				JRadioButton rdbtnOpcion_1 = new JRadioButton("Opcion 2", false);
				rdbtnOpcion_1.setBounds(43, 220, 109, 23);
				contentPane.add(rdbtnOpcion_1);

				JRadioButton rdbtnOpcion_2 = new JRadioButton("Opcion 3", false);
				rdbtnOpcion_2.setBounds(43, 246, 109, 23);
				contentPane.add(rdbtnOpcion_2);

				//Agrupamos los botnones de radio
				ButtonGroup bgroup = new ButtonGroup();
				bgroup.add(rdbtnOpcion);
				bgroup.add(rdbtnOpcion_1);
				bgroup.add(rdbtnOpcion_2);

				//Checkboxes
				JCheckBox chckbxOpcion = new JCheckBox("Opcion1", true);
				chckbxOpcion.setBounds(43, 305, 97, 23);
				contentPane.add(chckbxOpcion);

				JCheckBox chckbxNewCheckBox = new JCheckBox("Opcion 2", true);
				chckbxNewCheckBox.setBounds(43, 325, 97, 23);
				contentPane.add(chckbxNewCheckBox);

				JCheckBox chckbxOpcion_1 = new JCheckBox("Opcion3", false);
				chckbxOpcion_1.setBounds(43, 346, 97, 23);
				contentPane.add(chckbxOpcion_1);

				//TextArea
				JTextArea textArea = new JTextArea("pruebaaaa");
				textArea.setBounds(171, 18, 141, 117);
				textArea.setWrapStyleWord(true);
				textArea.setLineWrap(true);
				contentPane.add(textArea);

				//Scrollpane asociado a textarea
				JScrollPane scroll = new JScrollPane(textArea); //Objeto
				scroll.setBounds(189, 18, 141, 117); //Misma coordenadas y tamaño que el objeto
				contentPane.add(scroll);

				//Campo de password
				JPasswordField pwd = new JPasswordField("fernando");
				pwd.setBounds(189, 171, 139, 20);
				contentPane.add(pwd);

				//Menu de opciones
				JComboBox comboBox = new JComboBox<>();
				comboBox.setBounds(189, 221, 141, 22);
				contentPane.add(comboBox);

				//Añadimos opciones
				comboBox.addItem("Fernando");
				comboBox.addItem("Alberto");
				comboBox.addItem("Arturo");

				//Boton interruptor
				JToggleButton tglbtnNewToggleButton = new JToggleButton("Interruptor", true);
				tglbtnNewToggleButton.setBounds(189, 291, 121, 23);
				contentPane.add(tglbtnNewToggleButton);

				//Contador
				JSpinner spinner = new JSpinner();
				spinner.setBounds(371, 20, 29, 20);
				contentPane.add(spinner);

				//Arrays de String
				String pelis[]={"Star wars: la venganza de los siths", "El señor de los anillos: el retorno del rey", "Guerra mundial Z", "Revolution", "007: Todo o Nada"};

				//Lista
				JList list = new JList<>(pelis);
				list.setBounds(371, 72, 86, 80);
				contentPane.add(list);

				//Scroll asociado a la lista
				JScrollPane scroll2 = new JScrollPane(list); //Objeto
				scroll2.setBounds(371, 72, 86, 80); //Misma coordenadas y tamaño que el objeto
				contentPane.add(scroll2);
	}
}

Recordar que también podéis hacerlo con el IDE Netbeans. Es más sencillo de usar.

Espero que os sea de ayuda. Si tenéis dudas, preguntad. Estamos para ayudarte.

Etiquetas

One comment

  1. Problemas que se me presento con el codigo sugerido:
    1) Tengo la version 6.5 de NetBeans y para poder observar los objetos colocados me falta incluir al final un repaint sino solo veo la primera etiqueta.
    2) cuando coloco el JTextArea, sin la barra de desplazamiento Vertical (Scroll), se muestra el texto prueba y puedo trabajar sobre el area, pero al adicionar el Scroll, me borra la informacion del area, como también se me deshabilita las o`cion de poder escribir texto en dicha area, eso si no supe como resolverlo. Alguien que me de sugerencias y me diga los porque!!
    De ante mano gracias

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *