Mostrando entradas con la etiqueta GUI. Mostrar todas las entradas
Mostrando entradas con la etiqueta GUI. Mostrar todas las entradas

lunes, 26 de octubre de 2020

Componentes básicos de Java Swing

Los componentes básicos que provee la biblioteca Java Swing son

  • JButton
  • JCheckBox
  • JLabel
  • JTextArea
  • JTextField
  • JPasswordField
  • JRadioButton
  • JOptionPane

Además, el contenedor primario es el JFrame que es una subclase de java.awt.Frame. Sin embargo, a diferencia de su superclase esta puede ser cerrada u ocultada. Dentro de este contenedor particular se ubican los componentes como botones, etiquetas, cajas de texto, etc.

JFrame

El siguiente código crea un JFrame sin emplear ningún editor gráfico

package view;

import javax.swing.GroupLayout;
import javax.swing.GroupLayout.Alignment;
import javax.swing.JButton;
import javax.swing.JFrame;
import javax.swing.JLabel;
import javax.swing.JPanel;

public class JFrameExample {

    public static void main(String[] args) {
        JFrame ventana = new JFrame("JFrame Demo");
        JPanel panel = new JPanel();
        JLabel label = new JLabel("JLabel");
        JButton button = new JButton();
        button.setText("JButton");

        GroupLayout groupLayout = new GroupLayout(panel);
        groupLayout.setHorizontalGroup(
                groupLayout.createParallelGroup(Alignment.LEADING)
                        .addGroup(groupLayout.createSequentialGroup()
                                .addGap(100)
                                .addGroup(groupLayout.createParallelGroup()
                                        .addComponent(label)
                                        .addComponent(button))
                                .addContainerGap(300, Short.MAX_VALUE))
        );
        groupLayout.setVerticalGroup(
                groupLayout.createParallelGroup(Alignment.LEADING)
                        .addGroup(groupLayout.createSequentialGroup()
                                .addGap(40)
                                .addComponent(label)
                                .addGap(20)
                                .addComponent(button)
                                .addContainerGap(200, Short.MAX_VALUE))
        );
        panel.setLayout(groupLayout);

        ventana.add(panel);
        ventana.setSize(600, 400);
        ventana.setLocationRelativeTo(null);
        ventana.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
        ventana.setVisible(true);
    }
}

Lo que se requiere es un método "main", luego crear un JFrame en este caso llamado "ventana", es el contenedor principal, luego un JPanel dentro del cual se colocarán los JLabel y JButton. En ese momento aparece un código un poco engorroso de métodos que llaman otros métodos dentro y así sucesivamente. Ese código crea un objeto de tipo GroupLayout y lo inicializa con el parámetro JPanel, luego indica la disposición de los componentes dentro del contenedor JPanel de forma horizontal y vertical creando grupos secuenciales (un componente sigue a otro de derecha a izquierda o de arriba hacia abajo). Dentro de cada uno de ellos se indica como parámetro la alineación y se llaman otros métodos que pueden crear otros grupos como los paralelos o directamente agregar un componente con el método "addComponent". También, se encuentran los métodos "addGap" que indican distancia entre los elementos. Finalmente, se indica el "layout" o disposición al JPanel y se procede a agregar el JPanel al JFrame seguido del tamaño de la ventana, ubicación por defecto en la pantalla del monitos, acción al presionar el botón cerrar y haciéndolo visible.

Etiquetas (JLabel)

Este componente puede ser usado para mostrar texto plano, una imagen o una imagen con un texto. También, puede ser usado para mostrar los resultados de un proceso. Los métodos más empleados son:

  • setText() - Permite colocar un valor textual, puede ser empleado para mostrar un resultado en este componente.
  • setFont() - Permite definir tanto el tipo de fuente como estilo (negrita y/o cursiva) y tamaño de la letra.
  • setIcon() - Permite emplear un ícono o imagen y ser mostrado en pantalla.

Cajas de texto (JTextArea, JTextField y JPasswordField)

Estos componentes son empleados para que el usuario ingrese un valor textual y capturarlo. Los JTextField permiten ingresar una línea de texto, los JPasswordField ingresar un valor pero mostrarlo camuflado y los JTextArea permiten ingresar múltiples líneas de texto. Los métodos más empleados son:

  • setText() - Permite colocar un valor textual, puede ser empleado para mostrar un resultado en este componente.
  • getText() - Permite recuperar el valor que tiene la caja de texto.
  • setFont() - Permite definir tanto el tipo de fuente como estilo (negrita y/o cursiva) y tamaño de la letra.
  • setEnabled() - Permite deshabilitar la escritura, pudiendo usarse para mostrar un resultado al igual que en un JLabel

Botones (JButton, JCheckBox y JRadioButton)

Estos componentes permiten diversas formas gráficas con las que el usuario puede interactuar, los JRadioButton permiten elegir una opción de un grupo de estas, los JCheckBox permiten seleccionar más de una opción de un grupo de estas. Finalmente los JButton se emplean principalmente para ejecutar un evento al presionarlo.

Listas desplegables (JComboBox)

Similar al JRadioButton, permite seleccionar una opción de un grupo de estas, pero sin ocupar espacio en la ventana.

Cuadros de diálogo (JOptionPane)

Permite mostrar un cuadro con un mensaje, un ícono y botones. Un código de ejemplo sería:

JOptionPane.showMessageDialog(null,
     "Mensaje", "Título",
     JOptionPane.WARNING_MESSAGE);

El segundo y tercer parámetro indican el mensaje y el título, estos cuadros se pueden emplear para mostrar mensajes de confirmación, error, advertencia u otros.

Java Swing

Dentro de la forma de interactuar con el computador, se inició este proceso mediante las interfaces de línea de comandos, que tenían sus limitaciones como la de ejecutar una tarea a la vez, mostrando cierta discrepancia con la forma de trabajo del ser humano. Como respuesta aparecen las interfaces gráficas de usuario (GUI) con las llamadas WIMP(clic para conocer más) que implementan el uso de ventanas, menús, punteros e íconos.

En el caso de Java se debe emplear una biblioteca gráfica para el uso de las GUI como:

  • AWT, emplea los componentes gráficos del sistema operativo.
  • SWING, se abstrae del sistema operativo y contiene su propia colección de elementos gráficos.

La biblioteca Swing es parte de Java Foundation Classes (JFC), que es una colección de componentes gráficos para la construcción de aplicaciones de escritorio.

La estructura de esta biblioteca gira en torno a componentes y contenedores. Los contenedores son componentes y al mismo tiempo contienen a otros componentes, esto permite que los eventos pueden ser aplicados en contenedores y/o componentes.

Dependiendo del IDE empleado las paletas para el desarrollo gráfico pueden variar ligeramente y a su vez el código autogenerado.

Paleta de componentes en NetBeans


Paleta de componentes en Eclipse


En ambos se puede apreciar que componentes como los JPanel o Panel, JLabel o Label, JButton o Button y muchos más se repiten con diferente nombre, pero al ser visualizados como código se convierten en objetos cuya clase es derivada del JComponent. Es importante mencionar que los diversos IDE contienen herramientas que permiten construir las interfaces gráficamente y generan todo el código conforme se agregan elementos o realizan cambios. Cada IDE tiene una forma particular de crear el código según el "plug-in" que emplee, por ejemplo en NetBeans no encontrará ningún "import" mientras en Eclipse con su complemento WindowsBuilder se utilizarán todo el tiempo, en NetBeans existen partes del código que no se pueden modificar directamente sino solo a través de la pestaña de diseño, en Eclipse todo el código se puede modificar. Además, las paletas de diseño también tendrán diferente diseño, pero la ejecución del código será la misma.