Componentes GUI. Una interfaz gráfica de usuario (GUI) presenta

Componentes GUI.
Una interfaz gráfica de usuario (GUI) presenta un mecanismo amigable al usuario para interactuar
con una aplicación. Las GUIs se crean a partir de componentes de la GUI, a estos se les conoce
también como controles o widgets (accesorios de ventana) en otros lenguajes. Un componente de
la GUI es un objeto con el cual interactúa el usuario mediante el ratón, el teclado u otra forma de
entrada como el reconocimiento de voz.
Clase JOptionPane de Java (paquete javax.swing).
Proporciona cuadros de diálogo preempaquetados para entrada y salida. Estos diálogos se
muestran mediante la invocación de los métodos static de JOptionPane.
Ejm.
// Suma.java
// Programa de suma que utiliza a JOptionPane para entrada y salida.
import javax.swing.JOptionPane; // el programa usa JOptionPane
public class Suma
{
public static void main( String args[] )
{
// obtiene la entrada del usuario de los diálogos de entrada de
JOptionPane
String primerNumero =
JOptionPane.showInputDialog( "Introduzca el primer entero" );
String segundoNumero =
JOptionPane.showInputDialog( "Introduzca el segundo entero" );
// convierte las entradas String en valores int para usarlos en un
cálculo
int numero1 = Integer.parseInt( primerNumero );
int numero2 = Integer.parseInt( segundoNumero );
int suma = numero1 + numero2; // suma números
// muestra los resultados en un diálogo de mensajes de JOptionPane
JOptionPane.showMessageDialog( null, "La suma es " + suma,
"Suma de dos enteros", JOptionPane.PLAIN_MESSAGE );
} // fin del método main
} // fin de la clase Suma
Componentes básicos de GUI
JLabel
JTextField
Muestra texto que no puede editarse, o iconos
Permite al usuario introducir datos mediante el teclado. También se puede utilizar
para mostrar texto que puede o no editarse
JButton
Activa un evento cuando se oprime mediante el ratón
JCheckBox Especifica una opción que puede seleccionarse o no
JComboBox Proporciona una lista desplegable de elementos, a partir de los cuales el usuario
puede realizar una selección, haciendo clic en un elemento o posiblemente
escribiendo e el cuadro.
JList
Proporciona una lista de elementos a partir de los cuales el usuario puede realizar
una selección, haciendo clic en cualquier elemento en la lista. Pueden seleccionarse
varios elementos.
JPanel
Proporciona un área en la que pueden colocarse y organizarse los componentes.
También puede utilizarse como un área de dibujo para gráficos
Superclases de los componentes de GUI.
El siguiente diagrama de clases UML, muestra una jerarquía de herencia que contiene clases a
partir de las cuales los componentes Swing
Object
Component
Container
JComponent
La clase Component (java.awt) es una subclase de Object que declara muchos de los atributos y
comportamientos comunes para los componentes de GUI en los paquetes java.awt y java.swing.
La mayoría de los componentes GUI extienden la clase Component de manera directa o indirecta.
La clase Container (paquete java.awt) es una subclase Component. Los objetos Component se
adjuntan a objetos Container (como las ventanas), de manera que los objetos component se
pueden organizar y mostrar en la pantalla. Cualquier objeto que sea un Container se puede utilizar
para organizar o otros objetos Container para ayudar a organizar una GUI.
La clase JComponent (javax.swing) es una subclase de Container. JComponent es la superclase de
todos los componentes ligeros de Swing, y declara los atributos y comportamientos comunes.
Debido a que jComponent es una subclase de Container, todos los componentes ligeros de Swing
son también objetos Container.
Demostración de la clase JLabel
// LabelFrame.java
// Demostración de la clase JLabel.
import java.awt.FlowLayout; // especifica cómo se van a ordenar los
componentes
import javax.swing.JFrame; // proporciona las características básicas de
una ventana
import javax.swing.JLabel; // muestra texto e imágenes
import javax.swing.SwingConstants; // constantes comunes utilizadas con
Swing
import javax.swing.Icon; // interfaz utilizada para manipular imágenes
import javax.swing.ImageIcon; // carga las imágenes
public class LabelFrame extends
{
private JLabel etiqueta1; //
private JLabel etiqueta2; //
private JLabel etiqueta3; //
JFrame
JLabel sólo con texto
JLabel construida con texto y un icono
JLabel con texto adicional e icono
// El constructor de LabelFrame agrega objetos JLabel a JFrame
public LabelFrame()
{
super( "Prueba de JLabel" );
setLayout( new FlowLayout() ); // establece el esquema del marco
// Constructor de JLabel con un argumento String
etiqueta1 = new JLabel( "Etiqueta con texto" );
etiqueta1.setToolTipText( "Esta es etiqueta1" );
add( etiqueta1 ); // agrega etiqueta1 a JFrame
// Constructor de JLabel con argumentos de cadena, Icono y
alineación
Icon insecto = new ImageIcon( getClass().getResource(
"insecto1.gif" ) );
etiqueta2 = new JLabel( "Etiqueta con texto e icono", insecto,
SwingConstants.LEFT );
etiqueta2.setToolTipText( "Esta es etiqueta2" );
add( etiqueta2 ); // agrega etiqueta2 a JFrame
etiqueta3 = new JLabel(); // Constructor de JLabel sin argumentos
etiqueta3.setText( "Etiqueta con icono y texto en la parte
inferior" );
etiqueta3.setIcon( insecto ); // agrega icono a JLabel
etiqueta3.setHorizontalTextPosition( SwingConstants.CENTER );
etiqueta3.setVerticalTextPosition( SwingConstants.BOTTOM );
etiqueta3.setToolTipText( "Esta es etiqueta3" );
add( etiqueta3 ); // agrega etiqueta3 a JFrame
} // fin del constructor de LabelFrame
} // fin de la clase LabelFrame
Prueba de LabelFrame
// PruebaLabel.java
// Prueba de LabelFrame.
import javax.swing.JFrame;
public class PruebaLabel
{
public static void main( String args[] )
{
LabelFrame marcoEtiqueta = new LabelFrame(); // crea objeto
LabelFrame
marcoEtiqueta.setDefaultCloseOperation( JFrame.EXIT_ON_CLOSE );
marcoEtiqueta.setSize( 275, 180 ); // establece el tamaño del marco
marcoEtiqueta.setVisible( true ); // muestra el marco
} // fin de main
} // fin de la clase PruebaLabel
Componentes de GUI básicos
Constante
Constantes de posición horizontal
SwingConstantes.LEFT
SwingConstantes.CENTER
SwingConstantes.RIGHT
Constantes de posición vertical
SwingConstantes.TOP
SwingConstantes.CENTER
SwingConstantes.BOTTOM
Descripción
Coloca el texto a la izquierda
Coloca el texto en el centro
Coloca el texto a la derecha
Coloca el texto en la parte superior
Coloca el texto en el centro
Coloca el texto en la parte inferior
Campos de texto y manejo de eventos con clases anidadas.
Las GUIs son controladas por eventos. Cuando el usuario interactúa con un componente de la GUI,
la interacción controla el programa para que realice una tarea. El código que realiza una tarea en
respuesta a un evento
La clase JTextField extiende a la clase JTextComponent, que proporciona características comunes
para los componentes de Swing basados en texto.
La clase JPasswordField extiende JTextField y agrega varios métodos específicos para el
procesamiento de contraseñas. Cada uno de estos componentes es un área de una sola línea, en el
cual el usuario puede introducir texto mediante teclado.
Demostración de la clase JTextField
// CampoTextoMarco.java
// Demostración de la clase JTextField.
import java.awt.FlowLayout;
import java.awt.event.ActionListener;
import java.awt.event.ActionEvent;
import javax.swing.JFrame;
import javax.swing.JTextField;
import javax.swing.JPasswordField;
import javax.swing.JOptionPane;
public class CampoTextoMarco extends JFrame
{
private JTextField campoTexto1; // campo
private JTextField campoTexto2; // campo
private JTextField campoTexto3; // campo
private JPasswordField campoContrasenia;
texto
de
de
de
//
texto
texto
texto
campo
con tamaño fijo
construido con texto
con texto y tamaño
de contraseña con
// El constructor de CampoTextoMarco agrega objetos JTextField a
JFrame
public CampoTextoMarco()
{
super( "Prueba de JTextField y JPasswordField" );
setLayout( new FlowLayout() ); // establece el esquema del marco
// construye campo de texto con 10 columnas
campoTexto1 = new JTextField( 10 );
add( campoTexto1 ); // agrega campoTexto1 a JFrame
// construye campo de texto con texto predeterminado
campoTexto2 = new JTextField( "Escriba el texto aqui" );
add( campoTexto2 ); // agrega campoTexto2 a JFrame
// construye campo de texto con texto predeterminado y 21 columnas
campoTexto3 = new JTextField( "Campo de texto no editable", 21 );
campoTexto3.setEditable( false ); // deshabilita la edición
add( campoTexto3 ); // agrega campoTexto3 a JFrame
// construye campo de contraseña con texto predeterminado
campoContrasenia = new JPasswordField( "Texto oculto" );
add( campoContrasenia ); // agrega campoContrasenia a JFrame
// registra los manejadores de eventos
ManejadorCampoTexto manejador = new ManejadorCampoTexto();
campoTexto1.addActionListener( manejador );
campoTexto2.addActionListener( manejador );
campoTexto3.addActionListener( manejador );
campoContrasenia.addActionListener( manejador );
} // fin del constructor de CampoTextoMarco
// clase interna privada para el manejo de eventos
private class ManejadorCampoTexto implements ActionListener
{
// procesa los eventos de campo de texto
public void actionPerformed( ActionEvent evento )
{
String cadena = ""; // declara la cadena a mostrar
// el usuario oprimió Intro en el objeto JTextField campoTexto1
if ( evento.getSource() == campoTexto1 )
cadena = String.format( "campoTexto1: %s",
evento.getActionCommand() );
// el usuario oprimió Intro en el objeto JTextField campoTexto2
else if ( evento.getSource() == campoTexto2 )
cadena = String.format( "campoTexto2: %s",
evento.getActionCommand() );
// el usuario oprimió Intro en el objeto JTextField campoTexto3
else if ( evento.getSource() == campoTexto3 )
cadena = String.format( "campoTexto3: %s",
evento.getActionCommand() );
// el usuario oprimió Intro en el objeto JTextField
campoContrasenia
else if ( evento.getSource() == campoContrasenia )
cadena = String.format( "campoContrasenia: %s",
new String( campoContrasenia.getPassword() ) );
// muestra el contenido del objeto JTextField
JOptionPane.showMessageDialog( null, cadena );
} // fin del método actionPerformed
} // fin de la clase interna privada ManejadorCampoTexto
} // fin de la clase CampoTextoMarco
Prueba de CampoTextoMarco
// PruebaCampoTexto.java
// Prueba de CampoTextoMarco.
import javax.swing.JFrame;
public class PruebaCampoTexto
{
public static void main( String args[] )
{
CampoTextoMarco campoTextoMarco = new CampoTextoMarco();
campoTextoMarco.setDefaultCloseOperation( JFrame.EXIT_ON_CLOSE );
campoTextoMarco.setSize( 350, 100 ); // establece el tamaño del
marco
campoTextoMarco.setVisible( true ); // muestra el marco
} // fin de main
} // fin de la clase PruebaCampoTexto
Cómo funciona el manejo
Registro de Eventos. Todo JComponent tiene una variable de instancia llamada listenerList, que
hace referencia a un objeto de la clase EventListenerList (javax.swing.event). Cada objeto de una
subclase de JComponent mantiene referencias a todos sus componentes de escucha registrados
en listenerList.
Invocación del manejador de eventos. Cada tipo de evento tiene uno o más interfaces de escucha
de eventos de interfaces de escucha de eventos correspondientes. Por ejemplo, los eventos tipo
ActionEvent son manejados por objetos MouseListener y MouseMotionListener, y los eventos tipo
KeyEvent son manejados por objetos MouseListener y MouseMotionListener, y los eventos
KeyEvent son manejados por objetos KeyListener.
campoTexto
1
manejador1
Objeto TextFieldHandler
Objeto ManejadorManejadorCampoTexto
listenerList1
Public void ActionPerformed(ActionEvent evento)
{
// Aquí se maneja el evento
}
Esta referencia se crea mediante la instrucción
campoTexto1.addActionListener( manejador )
Botones de Comando y eventos de acción
// MarcoBoton.java
// Creación de objetos JButton.
import java.awt.FlowLayout;
import java.awt.event.ActionListener;
import java.awt.event.ActionEvent;
import javax.swing.JFrame;
import javax.swing.JButton;
import javax.swing.Icon;
import javax.swing.ImageIcon;
import javax.swing.JOptionPane;
public class MarcoBoton extends JFrame
{
private JButton botonJButtonSimple; // botón con texto solamente
private JButton botonJButtonElegante; // botón con iconos
// MarcoBoton agrega objetos JButton a JFrame
public MarcoBoton()
{
super( "Prueba de botones" );
setLayout( new FlowLayout() ); // establece el esquema del marco
botonJButtonSimple = new JButton( "Boton simple" ); // botón con
texto
add( botonJButtonSimple ); // agrega botonJButtonSimple a JFrame
Icon insecto1 = new ImageIcon( getClass().getResource(
"insecto1.gif" ) );
Icon insecto2 = new ImageIcon( getClass().getResource(
"insecto2.gif" ) );
botonJButtonElegante = new JButton( "Boton elegante", insecto1 );
// establece la imagen
botonJButtonElegante.setRolloverIcon( insecto2 ); // establece la
imagen de sustitución
add( botonJButtonElegante ); // agrega botonJButtonElegante a
JFrame
// crea nuevo ManejadorBoton para manejar los eventos de botón
ManejadorBoton manejador = new ManejadorBoton();
botonJButtonElegante.addActionListener( manejador );
botonJButtonSimple.addActionListener( manejador );
} // fin del constructor de MarcoBoton
// clase interna para manejar eventos de botón
private class ManejadorBoton implements ActionListener
{
// maneja evento de botón
public void actionPerformed( ActionEvent evento )
{
JOptionPane.showMessageDialog( MarcoBoton.this, String.format(
"Usted oprimio: %s", evento.getActionCommand() ) );
} // fin del método actionPerformed
} // fin de la clase interna privada ManejadorBoton
} // fin de la clase MarcoBoton
Clase de prueba de MarcoBoton
// PruebaBoton.java
// Prueba de MarcoBoton.
import javax.swing.JFrame;
public class PruebaBoton
{
public static void main( String args[] )
{
MarcoBoton marcoBoton = new MarcoBoton(); // crea MarcoBoton
marcoBoton.setDefaultCloseOperation( JFrame.EXIT_ON_CLOSE );
marcoBoton.setSize( 300, 110 ); // establece el tamaño del marco
marcoBoton.setVisible( true ); // muestra el marco
} // fin de main
} // fin de la clase PruebaBoton
Botones que mantienen el estado
// MarcoCasillaVerificacion.java
// Creación de botones JCheckBox.
import java.awt.FlowLayout;
import java.awt.Font;
import java.awt.event.ItemListener;
import java.awt.event.ItemEvent;
import javax.swing.JFrame;
import javax.swing.JTextField;
import javax.swing.JCheckBox;
public class MarcoCasillaVerificacion extends JFrame
{
private JTextField campoTexto; // muestra el texto en tipos de letra
cambiantes
private JCheckBox negritaJCheckBox; // para seleccionar/deseleccionar
negrita
private JCheckBox cursivaJCheckBox; // para seleccionar/deseleccionar
cursiva
// El constructor de MarcoCasillaVerificacion agrega objetos JCheckBox
a JFrame
public MarcoCasillaVerificacion()
{
super( "Prueba de JCheckBox" );
setLayout( new FlowLayout() ); // establece el esquema del marco
// establece JTextField y su tipo de letra
campoTexto = new JTextField( "Observe como cambia el estilo de tipo
de letra", 28 );
campoTexto.setFont( new Font( "Serif", Font.PLAIN, 14 ) );
add( campoTexto ); // agrega campoTexto a JFrame
negritaJCheckBox = new JCheckBox( "Negrita" ); // crea casilla de
verificación "negrita"
cursivaJCheckBox = new JCheckBox( "Cursiva" ); // crea casilla de
verificación "cursiva"
add( negritaJCheckBox ); // agrega casilla de verificación
"negrita" a JFrame
add( cursivaJCheckBox ); // agrega casilla de verificación
"cursiva" a JFrame
// registra componentes de escucha para objetos JCheckBox
ManejadorCheckBox manejador = new ManejadorCheckBox();
negritaJCheckBox.addItemListener( manejador );
cursivaJCheckBox.addItemListener( manejador );
} // fin del constructor de MarcoCasillaVerificacion
// clase interna privada para el manejo de
private class ManejadorCheckBox implements
{
private int valNegrita = Font.PLAIN; //
de letra negrita
private int valCursiva = Font.PLAIN; //
de letra cursiva
eventos ItemListener
ItemListener
controla el estilo de tipo
controla el estilo de tipo
// responde a los eventos de casilla de verificación
public void itemStateChanged( ItemEvent evento )
{
// procesa los eventos de la casilla de verificación "negrita"
if ( evento.getSource() == negritaJCheckBox )
valNegrita =
negritaJCheckBox.isSelected() ? Font.BOLD : Font.PLAIN;
// procesa los eventos de la casilla de verificación "cursiva"
if ( evento.getSource() == cursivaJCheckBox )
valCursiva =
cursivaJCheckBox.isSelected() ? Font.ITALIC : Font.PLAIN;
// establece el tipo de letra del campo de texto
campoTexto.setFont(
new Font( "Serif", valNegrita + valCursiva, 14 ) );
} // fin del método itemStateChanged
} // fin de la clase interna privada ManejadorCheckBox
} // fin de la clase MarcoCasillaVerificacion
Prueba de MarcoCasillaVerificación
// PruebaCasillaVerificacion.java
// Prueba de MarcoCasillaVerificacion.
import javax.swing.JFrame;
public class PruebaCasillaVerificacion
{
public static void main( String args[] )
{
MarcoCasillaVerificacion marcoCasillaVerificacion = new
MarcoCasillaVerificacion();
marcoCasillaVerificacion.setDefaultCloseOperation(
JFrame.EXIT_ON_CLOSE );
marcoCasillaVerificacion.setSize( 350, 100 ); // establece el
tamaño del marco
marcoCasillaVerificacion.setVisible( true ); // muestra el marco
} // fin de main
} // fin de la clase PruebaCasillaVerificacion