Componentes GUI.

Una interfaz grfica de usuario (GUI) presenta un mecanismo amigable al

usuario para interactuar con una aplicacin. Las GUIs se crean a partir de
componentes de la GUI, a estos se les conoce tambin como controles o
widgets (accesorios de ventana) en otros lenguajes. Un componente de la GUI
es un objeto con el cual interacta el usuario mediante el ratn, el teclado u
otra forma de entrada como el reconocimiento de voz.
Clase JOptionPane de Java (paquete javax.swing).
Proporciona cuadros de dilogo preempaquetados para entrada y salida. Estos
dilogos se muestran mediante la invocacin de los mtodos 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 dilogos 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
clculo
int numero1 = Integer.parseInt( primerNumero );
int numero2 = Integer.parseInt( segundoNumero );
int suma = numero1 + numero2; // suma nmeros
// muestra los resultados en un dilogo de mensajes de JOptionPane
JOptionPane.showMessageDialog( null, "La suma es " + suma,
"Suma de dos enteros", JOptionPane.PLAIN_MESSAGE );
} // fin del mtodo main
} // fin de la clase Suma

Componentes bsicos de GUI

JLabel
JTextField
JButton
JCheckBo
x
JComboB
ox
JList

JPanel

Muestra texto que no puede editarse, o iconos

Permite al usuario introducir datos mediante el teclado. Tambin se
puede utilizar para mostrar texto que puede o no editarse
Activa un evento cuando se oprime mediante el ratn
Especifica una opcin que puede seleccionarse o no
Proporciona una lista desplegable de elementos, a partir de los
cuales el usuario puede realizar una seleccin, haciendo clic en un
elemento o posiblemente escribiendo e el cuadro.
Proporciona una lista de elementos a partir de los cuales el usuario
puede realizar una seleccin, haciendo clic en cualquier elemento
en la lista. Pueden seleccionarse varios elementos.
Proporciona un rea en la que pueden colocarse y organizarse los
componentes. Tambin puede utilizarse como un rea de dibujo
para grficos

Superclases de los componentes de GUI.

El siguiente diagrama de clases UML, muestra una jerarqua de herencia que
contiene clases a partir de las cuales los componentes Swing

Object
Compone
Container
JCompone

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 mayora 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 tambin
objetos Container.

Demostracin de la clase JLabel

// LabelFrame.java
// Demostracin de la clase JLabel.
import java.awt.FlowLayout; // especifica cmo se van a ordenar los
componentes
import javax.swing.JFrame; // proporciona las caractersticas bsicas de
una ventana
import javax.swing.JLabel; // muestra texto e imgenes
import javax.swing.SwingConstants; // constantes comunes utilizadas con
Swing
import javax.swing.Icon; // interfaz utilizada para manipular imgenes
import javax.swing.ImageIcon; // carga las imgenes
public class LabelFrame extends
{
private JLabel etiqueta1; //
private JLabel etiqueta2; //
private JLabel etiqueta3; //

JFrame
JLabel slo 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
alineacin
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 tamao del marco
marcoEtiqueta.setVisible( true ); // muestra el marco
} // fin de main
} // fin de la clase PruebaLabel

Componentes de GUI bsicos

Constante
Constantes de posicin horizontal
SwingConstantes.LEFT
SwingConstantes.CENTER
SwingConstantes.RIGHT
Constantes de posicin vertical
SwingConstantes.TOP
SwingConstantes.CENTER
SwingConstantes.BOTTOM

Descripcin
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 interacta con un
componente de la GUI, la interaccin controla el programa para que realice una
tarea. El cdigo que realiza una tarea en respuesta a un evento

La clase JTextField extiende a la clase JTextComponent, que proporciona

caractersticas comunes para los componentes de Swing basados en texto.
La clase JPasswordField extiende JTextField y agrega varios mtodos especficos
para el procesamiento de contraseas. Cada uno de estos componentes es un
rea de una sola lnea, en el cual el usuario puede introducir texto mediante
teclado.

Demostracin de la clase JTextField

// CampoTextoMarco.java
// Demostracin 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 tamao fijo

construido con texto
con texto y tamao
de contrasea 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 edicin
add( campoTexto3 ); // agrega campoTexto3 a JFrame
// construye campo de contrasea 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 mtodo 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 tamao del

marco

campoTextoMarco.setVisible( true ); // muestra el marco

} // fin de main
} // fin de la clase PruebaCampoTexto

Cmo 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.

Invocacin del manejador de eventos. Cada tipo de evento tiene uno o

ms 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.
campoTex

manejado
Objeto TextFieldHandler

Objeto

listenerLis

Public void ActionPerformed(ActionEvent

evento)
{
// Aqu se maneja el evento

Esta referencia se crea mediante la instruccin

campoTexto1.addActionListener( manejador )

Botones de Comando y eventos de accin

// MarcoBoton.java
// Creacin de objetos JButton.

import
import
import
import
import
import
import
import

java.awt.FlowLayout;
java.awt.event.ActionListener;
java.awt.event.ActionEvent;
javax.swing.JFrame;
javax.swing.JButton;
javax.swing.Icon;
javax.swing.ImageIcon;
javax.swing.JOptionPane;

public class MarcoBoton extends JFrame

{
private JButton botonJButtonSimple; // botn con texto solamente
private JButton botonJButtonElegante; // botn 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" ); // botn 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 sustitucin
add( botonJButtonElegante ); // agrega botonJButtonElegante a
JFrame
// crea nuevo ManejadorBoton para manejar los eventos de botn
ManejadorBoton manejador = new ManejadorBoton();
botonJButtonElegante.addActionListener( manejador );
botonJButtonSimple.addActionListener( manejador );
} // fin del constructor de MarcoBoton
// clase interna para manejar eventos de botn
private class ManejadorBoton implements ActionListener
{
// maneja evento de botn
public void actionPerformed( ActionEvent evento )
{
JOptionPane.showMessageDialog( MarcoBoton.this, String.format(
"Usted oprimio: %s", evento.getActionCommand() ) );
} // fin del mtodo 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 tamao del marco
marcoBoton.setVisible( true ); // muestra el marco
} // fin de main
} // fin de la clase PruebaBoton
Botones que mantienen el estado
// MarcoCasillaVerificacion.java
// Creacin 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
verificacin "negrita"
cursivaJCheckBox = new JCheckBox( "Cursiva" ); // crea casilla de
verificacin "cursiva"
add( negritaJCheckBox ); // agrega casilla de verificacin
"negrita" a JFrame
add( cursivaJCheckBox ); // agrega casilla de verificacin
"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 verificacin

public void itemStateChanged( ItemEvent evento )
{
// procesa los eventos de la casilla de verificacin "negrita"
if ( evento.getSource() == negritaJCheckBox )
valNegrita =
negritaJCheckBox.isSelected() ? Font.BOLD : Font.PLAIN;
// procesa los eventos de la casilla de verificacin "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 mtodo itemStateChanged
} // fin de la clase interna privada ManejadorCheckBox
} // fin de la clase MarcoCasillaVerificacion

Prueba de MarcoCasillaVerificacin
// 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
tamao del marco
marcoCasillaVerificacion.setVisible( true ); // muestra el marco
} // fin de main
} // fin de la clase PruebaCasillaVerificacion