descripción y ejempos de la librerias swing para la creacion de gui java

Oscar Bedoya

oscarbed@eisc.univalle.edu.co

Programación interactiva

Interfaces gráficas con Java Swing

• Una interfaz gráfica con el usuario (GUI) es un mecanismo incorporado en las aplicaciones para hacer más amigable y entendible la interacción con el usuario

•Las GUIs se crean a partir de componentes, éstos permiten que el usuario interactúe mediante el ratón, teclado y otras formas de entrada.

Estructura de las aplicaciones GUI

•Declarar una clase que herede de la superclase JFrame

•Declarar cada componente que hará parte de la GUI

•Dentro del método constructor, crear y organizar los componentes

•Declarar el método main

Estructura de las aplicaciones GUI

•Declarar una clase que herede de la superclase JFrame

•Declarar cada componente que hará parte de la GUI

•Dentro del método constructor, crear y organizar los componentes

•Declarar el método main

JFrame

Clase()

main()

import java.awt.*;

import java.awt.event.*;

import javax.swing.*;

public class GUI extends JFrame {

public GUI()

super( "Título de la GUI" );

Container contenedor = getContentPane();

contenedor.setLayout( new FlowLayout() );

setSize( 275, 170 );

setVisible( true );

public static void main( String a[] )

GUI aplicacion = new GUI();

aplicacion.setDefaultCloseOperation( JFrame.EXIT_ON_CLOSE );

JFrame

main()

import java.awt.*;

public GUI()

setSize( 275, 170 );

setVisible( true );

Toda GUI debe heredar de la clase JFrame

import java.awt.*;

public GUI()

setSize( 275, 170 );

setVisible( true );

Se debe DECLARAR cada componente que hará

parte de la GUI

import java.awt.*;

public GUI()

setSize( 275, 170 );

setVisible( true );

Método constructor

CREAR cada componente y organizarlo de acuerdo a lo

que se requiere

import java.awt.*;

public GUI()

setSize( 275, 170 );

setVisible( true );

aplicacion.setDefaultCloseOperation( JFrame.EXIT_ON_CLOSE);

Se crea un objeto de la aplicación

import java.awt.*;

public GUI()

setSize( 275, 170 );

setVisible( true );

Método constructor

Establecer el título de la ventana

import java.awt.*;

public GUI()

setSize( 275, 170 );

setVisible( true );

Crear el contenedor. Es el espacio que mantiene el contenido de la ventana

import java.awt.*;

public GUI()

setSize( 275, 170 );

setVisible( true );

import java.awt.*;

public GUI()

setSize( 275, 170 );

setVisible( true );

Contenedor

import java.awt.*;

public GUI()

setSize( 275, 170 );

setVisible( true );

Se establecen las dimensiones de la

ventana

import java.awt.*;

public GUI()

setSize( 275, 170 );

setVisible( true );

Algunos componentes que se pueden agregar al contenedor:

•JLabel

•JButton

•JTextField

•JCheckButtton

•JRadioButton

•JList

import java.awt.*;

public GUI()

setSize( 275, 170 );

setVisible( true );

Algunos componentes que se pueden agregar al contenedor:

•JLabel

•JButton

•JTextField

•JCheckButtton

•JRadioButton

•JList

Declarar

Crear y organizar

JLabel (Etiqueta)

•Las etiquetas son componentes que permiten mostrar un mensaje, en texto o gráfico, de tal manera que el usuario tenga una idea más clara de cómo interactuar con la aplicación

Etiqueta

JLabel (Etiqueta)

•Declarar la etiqueta

private JLabel etiqueta1;

•Crear la etiqueta

Se tienen varias formas

etiqueta1=new JLabel(“Texto de la etiqueta”);

contenedor.add(etiqueta1);

JLabel (Etiqueta)

Inicialmente el contenedor está vacío

JLabel (Etiqueta)

etiqueta1.setToolTipText( "Esta es la etiqueta 1" );

JLabel (Etiqueta)

El método setToolTipText permite establecer el texto que se mostrará en caso de que el usuario

pase el mouse por encima de la etiqueta

JLabel (Etiqueta)

Otra forma consiste en crear una etiqueta con icono

Icon imagen = new ImageIcon( "image1.gif" );

etiqueta2 = new JLabel( "Etiqueta con texto e icono“);

etiqueta2.setIcon(imagen);

etiqueta2.setHorizontalTextPosition(SwingConstants.RIGHT);

etiqueta2.setToolTipText( "Esta es la etiqueta2" );

contenedor.add( etiqueta2 );

Otra forma consiste en crear una etiqueta con icono

Icon imagen = new ImageIcon( "image1.gif" );

etiqueta2 = new JLabel( "Etiqueta con texto e icono“);

etiqueta2.setIcon(imagen);

etiqueta2.setHorizontalTextPosition(SwingConstants.RIGHT);

Otra formaetiqueta3 = new JLabel();

etiqueta3.setText( "Etiqueta con icono y texto en parte inferior" );

etiqueta3.setIcon( imagen );

etiqueta3.setVerticalTextPosition( SwingConstants.BOTTOM );

El texto debe aparecer debajo del icono

Las constantes de posición horizontal en SwingConstants son: LEFT, CENTER, RIGHT y

en la posición vertical son TOP, CENTER, BOTTOM

PruebaEtiqueta

Métodos setFont y setForegroundetiqueta3 = new JLabel();

etiqueta3.setFont(new Font("Arial", Font.BOLD, 14));

etiqueta3.setForeground(Color.black);

Se puede cambiar el tipo de fuente, tamaño y color

JTextField y JPasswordField (Campos de texto)

•Los JTextField son áreas de una sola línea en las que el usuario puede introducir texto mediante el teclado o bien, el programa puede mostrar un resultado

Campo de texto en el que el programa

muestra un resultado

Campo de texto en el que el

usuario ingresadatos

•Los JPasswordField son áreas en los que el texto se representa con simbolos * para ocultarlo de otros usuarios

JTextField

JPasswordField

JTextField (Campo de texto)

•Declarar el campo

private JTextField campoTexto1;

•Crear el campo

campoTexto1=new JTextField(10);

contenedor.add(campoTexto1);

•Crear el campo

campoTexto1=new JTextField(10);

Crea un campo de texto con 10 columnas

•Crear el campo

campoTexto2=new JTextField(“Escriba el texto aquí”);

•Crear el campo

campoTexto2=new JTextField(“Escriba el texto aquí”);

Crea un campo de texto con texto

predeterminado. El tamaño del campo estará dado por la

longitud del mensaje

•Crear el campo

campoTexto2=new JTextField(“Escriba el texto aquí”,20);

Cuando se crea un campo de texto con texto predeterminado, el tamaño del

campo queda determinado por la longitud del mensaje, si se quiere establecer un valor diferente se puede utilizar este

constructor

•Crear el campo

campoTexto3=new JTextField(“Campo de texto no editable”,20);

campoTexto3.setEditable(false);

•Crear el campo

campoTexto3=new JTextField(“Campo de texto no editable”,20);

campoTexto3.setEditable(false);

Crea un campo de texto no editable, es decir, no se puede cambiar su contenido hasta que

se ejecute el comando

campoTexto3.setEditable(true);

JPasswordField

private JPasswordField campoContraseña;

•Crear el campo

Se tienen los mismos constructores que para JTextField

campoContraseña=new JPasswordField(6);

contenedor.add(campoContraseña);

Crea un campo para contraseña

Eventos y metáfora del oyente

Java utiliza la metáfora del oyente para indicar que cualquier GUI está escuchando continuamente que suceda un evento

Los eventos que pueden ocurrir en una GUI son:

•Hacer clic sobre un botón

•Completar un campo de texto y hacer clic

•Hacer clic sobre una opción de un menú

•Ejecutar un comando con teclado

Los oyentes se han clasificado de acuerdo al componente que genera los eventos y se tienen interfaces que ayudan a manejar tales eventos

ActionListener

MouseListener

ItemListener

KeyListener

Tipo de evento Interfaz

ActionEvent ActionListener

MouseEvent MouseListener, MouseMotionListener

KeyEvent KeyListener

ItemEvent ItemListener

Cada componente que pueda generar un evento, debe tener un manejador que indique las acciones que deben ocurrir si se genera un evento

•Los campos de texto, a diferencia de las etiquetas, generan eventos!!!

•Cuando se escribe en el campo de texto y se da Enter, se genera un evento

•Concepto de FOCO: es el componente de la GUI que está actualmente siendo utilizado, cuando un campo de texto genera un evento, se dice que tiene el foco

Recuerde los oyentes (interfaces)

ActionListener

MouseListener

ItemListener

KeyListener

Entre estos, un campo de texto genera un evento de acción (ActionEvent)

Utilizar un objeto manejador de una clase que implemente la interfaz ActionListener!!!

Algunos métodos de las clases JTextField y JPasswordField

Método Descripción

setText(mensaje) Permite colocar un mensaje de tipo String en el campo

getText() Permite obtener el valor escrito en el campo

addActionListener(manejador) Adicionar el manejador de eventos al campo. El manejador es un objeto de una clase que implemente la interfaz ActionListener

Para que una aplicación pueda capturar los eventos que allí se generen debe:

-Crear la clase que implemente la interfaz

-Crear un objeto de esa clase (manejador)

-Registrar el manejador en cada componente que pueda generar un evento del tipo considerado en la interfaz

private class ManejadorCampoTexto implements ActionListener

public void actionPerformed( ActionEvent evento )

if ( evento.getSource() == campoTexto1 )

//Instrucciones que se deben ejecutar si la fuente del evento fue el campoTexto1

} // fin del método actionPerformed

} // fin de la clase interna privada ManejadorCampoTexto

La clase ManejadorCampoTexto

implementa ActionListener

Método que maneja un evento ActionEvent

Si la fuente del evento es el campoTexto1

Para que una aplicación pueda capturar los eventos que allí se generen debe:

• Crear la clase que implemente la interfaz

Se puede colocar en el mismo archivo de la GUI

• Crear un objeto de esa clase (manejador)

ManejadorCampoTexto manejador = new ManejadorCampoTexto();

• Registrar el manejador en cada componente que pueda generar un evento del tipo considerado en la interfaz

campoTexto1.addActionListener( manejador );

campoContraseña.addActionListener( manejador );

Para que una aplicación pueda capturar los eventos que alli se generen debe:

• Crear la clase que implemente la interfaz

Se puede colocar en el mismo archivo de la GUI

• Crear un objeto de esa clase (manejador)

ManejadorCampoTexto manejador = new ManejadorCampoTexto();

• Registrar el manejador en cada componente que pueda generar un evento del tipo considerado en la interfaz

campoContraseña.addActionListener( manejador );

PruebaCampoTexto

Problema: Desarrolle un traductor EspañolInglés con dos campos de texto, de tal forma que cuando se escriba un palabra en uno de los campos y se de enter, aparezca la traducción en el otro campo de texto. Se deben considerar 5 palabras.

Problema: Desarrolle una GUI con una etiqueta y un campo de texto. El contenido inicial de la etiqueta es el número 0. Cada vez que se de enter en el campo, se mostrará en la etiqueta la cantidad de veces que esto ha ocurrido. Utilice tamaño 40 para el texto en la etiqueta.

String.valueOf( int var ) : convierte un entero a String

JButton (Botón)

•Es un componente en el que el usuario hace clic para desencadenar cierta acción

• Un programa puede utilizar varios tipos de botones

-Botones de comando

-Casillas de verificación

-Botones interruptores

-Botones de opción

JButton (Botón)

•Declarar el botón

private JButton botonSimple;

•Crear el campo

botonSimple=new JButton(“Botón simple”);

contenedor.add(botonSimple);

JButton (Botón)

•Crear el campo

botonSimple=new JButton(“Botón simple”);

contenedor.add(botonSimple);

Botón que solo tiene texto

JButton (Botón)

•Crear el campo

Icon image1 = new ImageIcon( "image6.gif" );

botonElegante = new JButton( "Botón elegante", image1 );

botonElegante.setRolloverIcon( image2 );

botonElegante.setToolTipText( "Muestra un mensaje" );

botonElegante.setMnemonic('M');

contenedor.add( botonElegante );

JButton (Botón)

•Crear el campo

contenedor.add( botonElegante ); Imagen inicial del botón

JButton (Botón)

•Crear el campo

Imagen cuando se pase el mouse por encima del

botón

JButton (Botón)

•Crear el campo

Un nemómico es un atajo con teclado

Botón inicial Botón cuando se pasa el mouse por encima

JButton (Botón)

•Un botón (de comando) genera un evento ActionEvent cuando el usuario hace clic en él

Utilizar un objeto manejador de una clase que implemente la interfaz ActionListener!!!

private class ManejadorBoton implements ActionListener {

// manejar evento de botón

if (evento.getSource()==botonSimple)

JOptionPane.showMessageDialog( null, "Usted oprimió el boton simple");

if (evento.getSource()==botonElegante)

JOptionPane.showMessageDialog( null, "Usted oprimió el boton elegante");

} // fin de la clase interna privada ManejadorBoton

private class ManejadorBoton implements ActionListener {

// manejar evento de botón

if (evento.getSource()==botonSimple)

JOptionPane.showMessageDialog( null, "Usted oprimió el boton simple");

if (evento.getSource()==botonElegante)

JOptionPane.showMessageDialog( null, "Usted oprimió el boton elegante");

} // fin de la clase interna privada ManejadorBoton

PruebaBoton

Problema: Modifique la GUI anterior de tal manera que se indique la cantidad de veces que se ha oprimido cada botón

JButton (Botón)

•Método setEnabled()

Permite habilitar o deshabilitar un botón

nombreBoton.setEnabled(false);

Deshabilita el botón, no ejecuta el oyente

JButton (Botón)

•Método setEnabled()

Permite habilitar o deshabilitar un botón

nombreBoton.setEnabled(false);

Deshabilita el botón, no ejecuta el oyente

PruebaBoton2

Problema: Desarrolle una GUI que tenga dos botones. Inicialmente uno de los dos está deshabilitado pero se puede habilitar si se hace clic en el segundo botón. Si esto ocurre, el botón dos se deshabilita y solo se podrá habilitar si se hace clic en el botón uno.

Problema: Desarrolle el traductor con botones. Un botón para traducir a inglés y otro para alemán

JCheckBox (Casilla de verificación)

En un checkbox, se tienen varias casillas, se pueden

marcar todas

JCheckBox (Casilla de verificacion)

•Un ChekBox genera un evento ItemEvent cuando el usuario hace clic en él

Utilizar un objeto manejador de una clase que implemente la interfaz ItemListener!!!

JChekbox (Casilla de verificación)

•Declarar

private JChekBox negrita, cursiva;

•Crear

negrita = new JCheckBox( "Negrita" );

contenedor.add( negrita );

cursiva = new JCheckBox( "Cursiva" );

contenedor.add( cursiva );

JChekbox (Casilla de verificacion)

•Declarar

private JChekBox negrita, cursiva;

•Crear

negrita = new JCheckBox( "Negrita" );

contenedor.add( negrita );

cursiva = new JCheckBox( "Cursiva" );

contenedor.add( cursiva );

ManejadorCasillaVerificacion manejador = new ManejadorCasillaVerificacion();

negrita.addItemListener( manejador );

cursiva.addItemListener( manejador );

Se adiciona el manejador, un objeto de una clase que implementa la interfaz ItemListener, por medio del

método addItemListener

private class ManejadorCasillaVerificacion implements ItemListener {

private int valNegrita = Font.PLAIN;

private int valCursiva = Font.PLAIN;

// responder a eventos de casilla de verificación

public void itemStateChanged( ItemEvent evento )

// procesar eventos de casilla de verificación negrita

if ( evento.getSource() == negrita )

valNegrita = negrita.isSelected() ? Font.BOLD : Font.PLAIN;

// procesar eventos de casilla de verificación cursiva

if ( evento.getSource() == cursiva )

valCursiva = cursiva.isSelected() ? Font.ITALIC : Font.PLAIN;

// establecer tipo de letra del campo de texto

campo.setFont( new Font( "Serif", valNegrita + valCursiva, 14 ) );

} // fin del método itemStateChanged

} // fin de la clase interna privada ManejadorCasillaVerificacion

Se implementa la interfaz ItemListener

El evento ItemEvent se maneja por medio del

método itemStateChanged

PruebaCasillaVerificacion

JRadioButton (Botones de opción)

En un RadioButton, solo una de las opciones se puede seleccionar al

tiempo

•Un RadioButton genera un evento ItemEvent cuando el usuario hace clic en él

•Declarar

private JRadioButton botonSimple, botonNegrita…

private ButtonGruop grupoBotonesOpcion;

Como existe una relación entre los botones (no se puede seleccionar más de un botón al tiempo), se

debe agrupar en un componente ButtonGroup

Después de crear cada RadioButton, se deben adicionar a un único ButtonGroup

•Crear botonSimple = new JRadioButton( "Simple", true );

contenedor.add( botonSimple );

botonNegrita = new JRadioButton( "Negrita", false );

contenedor.add( botonNegrita );

botonCursiva = new JRadioButton( "Cursiva", false );

contenedor.add( botonCursiva );

botonNegritaCursiva = new JRadioButton( "Negrita/Cursiva", false );

contenedor.add( botonNegritaCursiva );

Se puede indicar cuál de las opciones estará activa en el

momento de iniciar la aplicación

ManejadorBotonOpcion manejador = new ManejadorBotonOpcion();

botonSimple.addItemListener(manejador);

botonNegrita.addItemListener(manejador);

botonCursiva.addItemListener(manejador);

botonNegritaCursiva.addItemListener(manejador);

Se adiciona el oyente a cada RadioButton

botonSimple = new JRadioButton( "Simple", true );

grupoBotonesOpcion = new ButtonGroup();

grupoBotonesOpcion.add( botonSimple );

grupoBotonesOpcion.add( botonNegrita );

grupoBotonesOpcion.add( botonCursiva );

grupoBotonesOpcion.add( botonNegritaCursiva );

Se crea el ButtonGroup y se le adicionan los RadioButton

botonSimple = new JRadioButton( "Simple", true );

grupoBotonesOpcion = new ButtonGroup();

grupoBotonesOpcion.add( botonSimple );

grupoBotonesOpcion.add( botonNegrita );

grupoBotonesOpcion.add( botonCursiva );

grupoBotonesOpcion.add( botonNegritaCursiva );

PruebaBotonOpcion

Ver Oyente

JComboBox (Cuadro combinado)

•Un ComboBox, conocido como lista desplegable proporciona una lista de elementos de la cual el usuario puede seleccionar solamente uno

•Los objetos ComboBox generan eventos ItemEvent cuando el usuario hace clic en una de las opciones de la lista

•Declarar

private JComboBox cuadroCombImagenes;

private String nombres[] = { "image3.gif", "image10.gif",

"image5.gif", "image8.gif" };

•Declarar

private JComboBox cuadroCombImagenes;

private String nombres[] = { "image3.gif", "image10.gif",

"image5.gif", "image8.gif" };

Se debe crear una arreglo con los datos que

aparecerán en la lista

•Crear

cuadroCombImagenes = new JComboBox( nombres );

cuadroCombImagenes.setMaximumRowCount(4);

Se pasa al constructor el arreglo con los datos que

•Crear

Se establece la cantidad máxima de ítems que puede tener la lista sin necesitar la barra de desplazamiento

•Crear

Aparece la barra si se coloca el valor en 2 y hay 4

elementos en la lista

private class ManejadorCombo implements ItemListener {

if ( evento.getStateChange() == ItemEvent.SELECTED ){

int index=cuadroCombImagenes.getSelectedIndex();

System.out.println("Seleccionó el item " + index + " en la lista");

etiqueta.setIcon( iconos[index ] );

} Método que permite conocer que un ítem cambio de estado

Método del ComboBox que permite saber cuál de los ítems fue seleccionado.

Retorna el índice (comenzando en 0)

PruebaCuadroComb

JList (listas de selección)

•Una lista de selección permite al usuario seleccionar uno (Listas de selección simple) o varios elementos de una lista (Listas de selección múltiple)

•Las listas de selección se combinan con la clase JScrollPane

JScrollPane

•Una lista de selección genera eventos ListSelectionEvent cuando el usuario hace clic en una de las opciones de la lista

Utilizar un objeto manejador de una clase que implemente la interfaz ListSelectionListener!!!

Para adicionar este escucha se debe utilizar el método addListSelectionListener

•Declarar

private JList listaColores;

private JScrollPane scroll;

private final String nombresColores[] = { "Negro", "Azul", "Cyan", "Gris oscuro“,

"Gris", "Verde", "Gris claro", "Magenta", "Naranja", "Rosa", "Rojo", "Blanco", "Amarillo" };

Se debe crear un arreglo con los datos que

•Crear

listaColores = new JList( nombresColores );

listaColores.setVisibleRowCount( 5 );

listaColores.setSelectionMode( ListSelectionModel.SINGLE_SELECTION );

scroll = new JScrollPane(listaColores);

contenedor.add(scroll);

•Crear

Se pasa al constructor la lista con los nombres

Se especifica que es una lista de selección simpleSe adiciona la lista

a un scroll

•Crear

ManejadorLista manejador = new ManejadorLista();

listaColores.addListSelectionListener(manejador);

private class ManejadorLista implements ListSelectionListener {

public void valueChanged( ListSelectionEvent evento )

int index=listaColores.getSelectedIndex();

contenedor.setBackground(colores[index] );

Se implementa el método valueChange de la interfaz ListSelectionListener

private class ManejadorLista implements ListSelectionListener {

public void valueChanged( ListSelectionEvent evento )

int index=listaColores.getSelectedIndex();

contenedor.setBackground(colores[index] );

PruebaLista

JList de selección múltiple

JList de selección

simple

•Crear

listaColores.setSelectionMode(ListSelectionModel.MULTIPLE_INTERVAL_SELECTION);

scroll1 = new JScrollPane(listaColores);

contenedor.add(scroll1);

Se especifica que se permite

selección múltiple

public class ManejadorMultiple implements ActionListener

listaCopia.setListData( listaColores.getSelectedValues() );

Se captura el evento por medio del botón

Retorna los valores de listaColores seleccionados

Establecer los datos que aparecerán en la lista

public class ManejadorMultiple implements ActionListener

listaCopia.setListData( listaColores.getSelectedValues() );

PruebaSeleccionMultiple

Explicar ancho y alto de la lista que no tiene elementos

descripción y ejempos de la librerias swing para la creacion de gui java

Software

vol 39 - [swing, swing, swing]

bariandaran librerias del_soporte_a_la_experiencia

componentes, paquetes y librerias

librerias en dev-c++

lista de libros segun librerias

proyecto de tesis mypes rubro librerias

librerias ansi c

librerias pic c

programacion swing

librerias anticuarias

tutorial librerias eagle

java gui la librería swing...

java swing

java swing gui jfc [spanish] (2005)

mypes rubro librerias

reporte librerias

globalbook librerias web

uarm librerias

diseñar un gui swing en netbeans ide

librerias opengl