Swing

Interfaces gráficas con
Swing
Java y
S er vicios
W eb I
M a n uMe last
M oe nr teenn e g r o
Dpto.
In g eSistemas
n ie ría
Informáticos
M at e m á tic y
Desp. 467 (Mat) Computación
a montenegro@fdi.ucm.es
Introducción
●
Swing es una biblioteca de interfaces gráficas
de
●
usuario (GUI) para
Viene incluida con Java.
el entorno de desarrollo d e Java
(JDK).
●
Extiende a otra librería gráfica más a n t i g u a
llamada AWT.
●
Paquetes:
●
javax.swing
●
j ava. awt
●
j ava. awt . event
●
A lt e r nat ivas: SW T (http://www.eclipse.org /swt/)
28/Mayo/2012 8. Interfaces gráficas con Swing 2
Contenidos
●
Ventanas
● Componentes
● Layout Managers
●
M a nejo d e e ve n t os
● C u a d ros d e predefinidos
● d iá lo g o
● Dibujo de gráficos
Ar qui t ec tu ra MV C

Creación de ventanas
●
La clase JFrame proporciona operaciones para
manipular ventanas.
●
Constructores:
●
JFrame()
●
JFrame(String titulo)
●
Una vez creado el objeto d e ventana, hay que:
●
Establecer su tamaño.
●
Est ab lecer la a cció n de cierre .
●
H acerla visib le.

Creación d e ventanas
import javax.swing.*;
public class VentanaTest {

public static void main(String[] args) {
JFrame f = new JFrame("Titulo de ventana");
f.setSize(400, 300);
f.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
f . s e t Vi s i b l e ( t r u e ) ;
}
}
●
Acciones de cierre:
●
JFrame.EXIT_ON_CLOSE: Abandona aplicación.
●
JFrame.DISPOSE_ON_CLOSE: Libera los recursos asociados a la
● ventana.
● JFrame.DO_NOTHING_ON_CLOSE: No hace nada.
JFrame.HIDE_ON_CLOSE: Cierra la ventana, sin liberar sus recursos.
Creación d e ventanas

Creación de ventanas
●
Es usual extender la clase JFrame, y realizar las
operaciones d e inicialización e n su constructor.
public class MiVentana extends JFrame {
public MiVentana() {
s uper ( "Ti t ul o de vent ana" ) ; s et Si ze( 400, 300) ;
s et Def aul t Cl os eOper at i on( J Fr ame. EXI T_ON_CL
OSE) ;
}
}
public class VentanaTest {

public static void main(String[] args) {
MiVentana v = new MiVentana();
v. s e t Vi s i b l e ( t r u e ) ;
}
}

Contenidos
●
Ventanas
● Componentes
● Layout Managers
●
● d iá lo g o

Componentes d e una ventana
JButton
JLabel
JTextField
JCheckBox
JRadioButt
on
●
Tras crear uno de estos componentes con new, ha d e
añadirse al contentPane de la ventana
correspondiente mediante su método add.

Añadir componentes
super("Titulo de ventana");
setSize(400, 300);
setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
Container cp = getContentPane();
cp.setLayout(new FlowLayout());
JLabel etiqueta = new JLabel("Nombre: ");
JTextField texto = new JTextField(20);
JButton boton = new JButton("Saludar");
c p. a dd ( et i qu e ta ) ;
cp. add (t ext o) ;
cp.add(boton);
}
}

Añadir componentes

Contenidos
●
Ventanas
● Componentes
● Layout Managers
●
● d iá lo g o

Layout Managers
●
En Java no es habitual indicar explícitamente la posición
de los componentes de la interfaz dentro de la ventana.
●
Los layout m anagers se e n ca rg a n d e co lo ca r lo s
co m p o n e n te s d e la in te rf az d e u s u a rio en la ve n ta n a
co n t e n e d o r a.
●
Especifican la posición y el t a m a ñ o d e dichos
componentes.
●
FlowLayout
● GridLayout
● BorderLayout
● GridBagLayout
●
…

FlowLayout
●
Coloca los elementos uno a continuación de otro,
de manera similar a la colocación d e palabras e n
un procesador de textos.
●
Métodos:
●
setAligment(int alin eacio n)
●
setHgap(int separacion)
●
setVgap(int separacion)

GridLayout
●
Coloca los componentes de la interfaz en
forma de rejilla.
●
El o rd e n en q u e se añ a d a n lo s co m p o n e n t es
d e t e rm ina su p o sició n en la r e jilla.
●
Constructor:
● GridLayout(int f i l a s , i n t columnas)
●
Métodos:
●
●

GridLayout
public class MiVentana2 extends JFrame {
public MiVentana2() {
super("Titulo de ventana" );
setSize(400, 300);
GridLayout gl = new GridLayout(4,3);
gl.setHgap(5); gl.setVgap(5);
cp. s et Lay o ut ( g l ) ;
for(int i = 1; i <= 9; i++) {
cp.add(new JB u t to n ( S tr i n g . v al u eOf ( i )) ) ;
}
cp.add(new JButton("*"));
cp.add(new JButton("0"));
cp.add(new JButton("#"));
}
}

GridLayout

BorderLayout
●
Coloca y cambia de tamaño sus componentes
para que se ajusten a los bordes y p a r t e
central de la ventana.
●
Métodos:
●
●
●
Al añadir un elemento a la
ve n tan a, hay q u e espe c i ficar
su co lo cación:
JButton b = new JButton(...);
getContentPane().add(b, BorderLayout.EAST)

Interfaces complejas: JPanel
●
Un panel es un componente con un layout
manager propio, y que puede c o n t e n e r varios
componentes en su interior.
●
Constructor:
● JPanel()
●
Métodos:
●
void setLayout(LayoutManager lm)
● void add(JComponent componente)
● …


GridLayout
F lowLayout
F lowLayout

public MiVentana3() {
super("Añadir usuario");
/ / Panel de fe cha
JPanel panelFecha = new JPanel();
panelFecha.setLayout(new FlowLayout());
panelFecha.add(new JTextField(2));
panelFecha.add(new JLabel("/"));
panelFecha.add(new JLabel("/"));
/ / Panel de dat o s
JPanel panelDatos = new JPanel();
GridLayout gl = new GridLayout(3,2,0,5);
panelDatos.setLayout(gl);
panelDatos.add(new JLabel("Nombre:"));
panelDatos.add(new JTextField(10));
panelDatos. add (new J Label("DNI : " ) ) ;
panelDatos.add(new JTextField(10));
panelDatos. add (new JLabel("Fecha de nacimiento : " ) ) ;
panelDatos.add(panelFecha);
…

…
// Panel de botones
JPanel panelBotones = new JPanel();
panelBotones.setLayout(new FlowLayout());
panelBotones.add(new JButton("Aceptar"));
panelBotones.add(new JButton("Cancelar"));
cp.add(panelDatos, BorderLayout.CENTER);
cp.add(panelBotones,
BorderLayout.SOUTH);
}

Interfaces complejas: GridBagLayout
●
Más flexible que GridLayout
●
Cada componente ha de tener asociado un
objeto de la clase GridBagConstraints. La
asociación se p r o d u c i r á e n el m é t o d o add.
JButton b = new JButton(“Aceptar”);

GridBagConstraints gbc = new GridBagConstraints(...);
getContentPane().add(b, gbc);

GridBagConstraints
●
Atributos públicos:
●
i n t g r i d x , gridy
●
i n t gridwidth, gridheight
● double weightx, weighty
●
int f i l l
● i n t anchor
● Insets insets
● i n t ipadx, ipady
●
Pueden ser inicializados e n el constructor.

GridBagConstraints
●
● i n t g r i d x , gridy

GridBagConstraints
●
● i n t gridwidth, gridheight
gridwidth = 2
gridheight = 2

GridBagConstraints
●
● double weightx, weighty
weightx = 1.0 weightx = 0.0

GridBagConstraints
●
● int f i l l
●
Puede ser:
●
GridBagLayout.HORIZONTAL
●
GridBagLayout.VERTICAL
●
GridBagLayout.BOTH

GridBagConstraints
●
● i n t anchor

GridBagConstraints
●
● Insets insets
insets = new Insets(10, 20, 10, 20)

GridBagConstraints
●
● i n t p a d x , i n t pady
●
Especifican cuánto espacio añadir a la
an c hu r a/a ltu r a m í n i m a d e los c o m p o n e n t e s .

Constructores de interfaces
●
Permiten construir interfaces de usuario
i n t e r a c t i v a me n te .
●
Ejemplo: Netbeans ( netbeans.org )

Contenidos
●
Ventanas
● Componentes
● Layout Managers
●
● d iá lo g o

Manejo de eventos
●
Un evento es un suceso que ocurre como
consecuencia de la interacción del usuario con
la interfaz gráfica.
●
Pulsación de un botón.
● C a m b io d e l co n te n ido en u n c ua d r o d e t e x t o .
● D e s liza m i e n to de una barra .
● Activación de un JCheckBox.
●
Movimiento de la ventana.

Pulsación de un botón
●
La clase JButton tiene un método:
● void addActionListener(ActionListener l )
●
Que especifica el objeto (manejador de
e ve n t o ) q u e se e n ca rg a rá d e t r a tar e l e ve n to
d e p u lsació n d el b o t ó n .
● Este objeto ha de interpretar la interfaz
ActionListener (paquete java.awt.event)
public interface ActionListener {
void actionPerformed(ActionEvent e)
}

Pulsación de un botón
●
Cuando el usuario pulse el botón, se llamará al
mét o do actionPerformed de to d os l o s
ma nej a do re s d e ev e nt o s q u e se hayan
registrado.
public class Manejador implements ActionListener {
public void actionPerformed(ActionEvent e) {
...
} In fo r m ac ió n sobre
} e l e ve nt o
●
M é t o d o s d e ActionEvent:
●
public Object getSource()
●
public i n t getModifiers()
Ejemplo
public class BotonVentana extends JFrame {
public BotonVentana() {
super("Botón");
setSize(200,100);
cp.setLayout(new FlowLayout());
JButton boton = new JButton("¡Púlsame!");
boton.addActionListener(new
EventoBotonPulsado());
cp.add(boton);
}
}

Ejemplo
public class EventoBotonPulsado implements ActionListener {
public void actionPerformed(ActionEvent e)
{ System.out.println(“¡Gracias!”);
}
}

Ejemplo
public class EventoBotonPulsado implements ActionListener {
public void actionPerformed(ActionEvent e)
{ JButton boton = (JButton)
e.getSource();
boton.setText( "¡Gracias!");
}
}

Acceso a componentes d e la i n t e r f a z

Acceso a componentes d e la i n t e r f a z
public class EventoSaludo implements ActionListener {

?
}
}
●
¿Cómo accedo al o b j e to JTextField?

Posibilidad 1
public class EventoSaludo implements ActionListener {
private JTextField cuadroTexto;
public EventoSaludo(JTextField cuadroTexto) {

this.cuadroTexto = cuadroTexto;
}

JOptionPane.showMessageDialog(null, "¡Hola, " +
cuadroTexto.getText() + "!");
}
}

Posibilidad 1
super("Titulo de ventana" );
setSize(400, 300);
setLayout(new FlowLayout());
cp.add(new JLabel("Nombre :"));
JTextField texto = new JTextField(20);
cp . ad d ( t ex t o ) ;
JButton botonSaludo = new JButton( "Saludar");
cp.add(botonSaludo);
botonSaludo.addActionListener(new EventoSaludo( texto));
}
}

Posibilidad 2
cl as s Event oSal udo i mpl ement s Act i onLi s t ener {

J Opt i onPane. s howMes s ageDi al og( nu "¡Hola, " +
l l , cuadroTexto.getText() + "!");
}
}
…
cuadroTexto = new JTextField(20);
cp. add( cuadr oText o) ;
…
botonSaludo.addActionListener(new
EventoSaludo());
}
}

Posibilidad 3
public class MiVentana extends JFrame implements ActionListener {

JOptionPane.showMessageDialog(null, "¡Hola, " +
cuadroTexto.getText() + "!");
}
…
cuadroTexto = new JTextField(20);
cp.add(cuadroTexto);
…
botonSaludo.addActionListener( th
is);
}
}

Eventos en un JTextField
●
CaretListener: Cambios en la posición del
cursor.
● void caretUpdate(CaretEvent e )
●
DocumentListener: Cambios en el texto.
●
void changedUpdate(DocumentEvent e )
●
voi d insertUpdate(DocumentEvent e )
●
voi d removeUpdate(DocumentEvent e )
JTextF ield text = ...;

text.addCaretListener(...);
t ex t. getDocument ( ) . addDocument Li s t ener ( . . .
);

Eventos en una ventana
● WindowListener
●
void windowActivated(WindowEvent e )
● voi d windowClosed(WindowEvent e )
● voi d windowClosing(WindowEvent e )
● voi d windowDeactivated(WindowEvent e )
● voi d windowDeiconified(WindowEvent e )
● void windowIconified(WindowEvent e )
●
void windowOpened(WindowEvent e )

Eventos de ratón y de teclado
●
MouseListener: Pulsaciones de botón, entradas
y salidas del puntero en un componente.
●
MouseMotionListener: Movimientos del ratón
dentro de un componente.
●
MouseWheelListener: Movimientos de la r u e d a
central de un ratón.
●
KeyListener: Pulsaciones d e teclas.

Contenidos
●
Ventanas
● Componentes
● Layout Managers
●
● d iá lo g o

Cuadros de diálogo predefinidos
●
La clase JOptionPane proporciona métodos de
utilidad para mostrar ventanas de aviso y de
confirmación estándar.
● void showMessageDialog(Component padre,
Object mensaje, String tituloVentana,
int tipoMensaje)

●
● String showInputDialog(Component padre,
Object mensaje, Object valorDefecto)

●
● i n t showConfirmDialog(Component padre,
Object mensaje, String titulo,
int tipoOpciones, int tipoMensaje)

Contenidos
●
Ventanas
● Componentes
● Layout Managers
●
● d iá lo g o

Dibujar gráficos
●
Cada componente tiene un método llamado
paintComponent, que se encarga de pintarlo e n
pantalla.
●
Para realizar un dibujo definido por el
programador, basta con heredar de un
componente (normalmente un JPanel), y
sobreescribir su método paintComponent.
● void paintComponent(Graphics g)

Dibujar gráficos
●
M é t o d o s d e Graphics:
●
void drawPolygon(int[] x , i n t [ ] y, i n t puntos)
●
void dr awRect ( i n x , i n t y,
t ancho, i nt a l t o )
●
void i nt x , i n t y,
f i l l Rect ( i nt ancho, i nt a l t o )
●
void x , i n t y,
i nt ancho, i nt a l t o )
●
void dr awOval ( i n x , i n t y,
t ancho, i nt a l t o )
i nt
●
void drawString(String cad, in t x , i n t y)
f i l l Oval ( i nt
●
voi d setColor(Color c )
●
voi d setFont(Font i nt f )

Ejemplo
public class PanelSol extends JPanel {
public void paintComponent(Graphics g) {
g.setColor(Color.ORANGE);
g.fillOval(100,100,200,200);
for (double d = 0; d < 2*Math.PI; d += 0.1) {
int xEnd = (int) (200+150*Math.cos(d));
int yEnd = (int) (200+150*Math.sin(d));
g.drawLine(200, 200, xEnd, yEnd);
}
g.setColor(Color.BLACK);
g.drawArc(150, 150, 100, 100, 230, 8 0) ;
g.fillOval(150, 150, 20, 20);
g.fillOval(230, 150, 20, 20);
}
}

Ejemplo
public class VentanaSol extends JFrame {
public VentanaSol() {
…
cp .a dd(ne Pane l Sol( ) ) ;
} w
}

Aún hay más
http://download.java.net/javadesktop/swingset3/SwingS et3.jnlp

Aún hay más
http:/ /www.particle.kth.se/~ fmi/kurs/PhysicsSimulation/Lectures/0 7A/swingDesign.html

Contenidos
●
Ventanas
● Componentes
● Layout Managers
●
● d iá lo g o

A r q ui t ec t u r a M V C
●
MVC = Modelo – Vista – Controlador
●
Es un patrón de diseño que separa los datos de
la aplicación, la i n t e r f a z d e usuario, y la lógica
d e negocio.
C o n tr o l a d o r
Vi s ta Modelo

A r qui t e ct ur a M V C
●
Ejemplo: Edición de tex t os .
Controlador
c l a s s JTextField
Vi s ta Modelo
class JTextField interfaz Document

“Mi Texto”

A r qui t e ct ur a M V C
●
Ejemplo: Listas
Controlador
Vi s ta Modelo
class JList interfaz ListModel
{“MetaSystems”, Color.RED},
{“MetaWorks”, Color.BLUE},
…

●
Preparación: El modelo tiene una lista de vistas. Cada
vez que haya un cambio de modelo, éste avisará a
todas las vistas para que se actualicen.
●
Cuando se crea una vista, ésta avisa al m o d e l o para
q u e la añada a su lista.
Controlador
Vi s ta Modelo

●
Paso 1: Cuando el controlador recibe la acción
d e l u s u a rio , e nvía u n mensaje al m o d e l o para
m o d if icar lo.
Controlador
Vi s ta Modelo

●
Paso 2: Cuando el modelo se modifica, envía
un mensaje a t o d a s las vistas q u e t e n g a
registradas.
Controlador
Vi s ta Modelo

●
Paso 3: La vista se actualiza con los cambios
realizados e n el m o d e l o
Controlador
Vi s ta Modelo

Referencias
●
P. Deitel, H. Deitel
Java. How to Program (9th Edition)
Caps. 14, 15 y 25
●
B. Eckel
Thinking in Java (3rd Edition)
Cap. 14
●
J. Zukowski
The definitive guide to Java Swing

Swing

Cargado por

Información del documento

Derechos de autor

Formatos disponibles

Compartir este documento

Compartir o incrustar documentos

Opciones para compartir

¿Le pareció útil este documento?

¿Este contenido es inapropiado?

Copyright:

Formatos disponibles

Swing

Cargado por

Copyright:

Formatos disponibles

Interfaces gráficas con

28/Mayo/2012 8. Interfaces gráficas con Swing 3

28/Mayo/2012 8. Interfaces gráficas con Swing 4

public class VentanaTest {

28/Mayo/2012 8. Interfaces gráficas con Swing 6

public class VentanaTest {

28/Mayo/2012 8. Interfaces gráficas con Swing 7

28/Mayo/2012 8. Interfaces gráficas con Swing 8

28/Mayo/2012 8. Interfaces gráficas con Swing 9

28/Mayo/2012 8. Interfaces gráficas con Swing 10

28/Mayo/2012 8. Interfaces gráficas con Swing 11

28/Mayo/2012 8. Interfaces gráficas con Swing 12

28/Mayo/2012 8. Interfaces gráficas con Swing 13

28/Mayo/2012 8. Interfaces gráficas con Swing 14

28/Mayo/2012 8. Interfaces gráficas con Swing 15

28/Mayo/2012 8. Interfaces gráficas con Swing 16

28/Mayo/2012 8. Interfaces gráficas con Swing 17

28/Mayo/2012 8. Interfaces gráficas con Swing 18

28/Mayo/2012 8. Interfaces gráficas con Swing 19

28/Mayo/2012 8. Interfaces gráficas con Swing 20

28/Mayo/2012 8. Interfaces gráficas con Swing 21

28/Mayo/2012 8. Interfaces gráficas con Swing 22

28/Mayo/2012 8. Interfaces gráficas con Swing 23

JButton b = new JButton(“Aceptar”);

28/Mayo/2012 8. Interfaces gráficas con Swing 24

28/Mayo/2012 8. Interfaces gráficas con Swing 25

28/Mayo/2012 8. Interfaces gráficas con Swing 26

28/Mayo/2012 8. Interfaces gráficas con Swing 27

weightx = 1.0 weightx = 0.0

28/Mayo/2012 8. Interfaces gráficas con Swing 28

28/Mayo/2012 8. Interfaces gráficas con Swing 29

28/Mayo/2012 8. Interfaces gráficas con Swing 30

insets = new Insets(10, 20, 10, 20)

28/Mayo/2012 8. Interfaces gráficas con Swing 31

28/Mayo/2012 8. Interfaces gráficas con Swing 32

28/Mayo/2012 8. Interfaces gráficas con Swing 33

28/Mayo/2012 8. Interfaces gráficas con Swing 34

28/Mayo/2012 8. Interfaces gráficas con Swing 35

28/Mayo/2012 8. Interfaces gráficas con Swing 36

28/Mayo/2012 8. Interfaces gráficas con Swing 38

28/Mayo/2012 8. Interfaces gráficas con Swing 39

28/Mayo/2012 8. Interfaces gráficas con Swing 40

28/Mayo/2012 8. Interfaces gráficas con Swing 41

public class EventoSaludo implements ActionListener {

28/Mayo/2012 8. Interfaces gráficas con Swing 42

public EventoSaludo(JTextField cuadroTexto) {

public void actionPerformed(ActionEvent e) {

28/Mayo/2012 8. Interfaces gráficas con Swing 43

28/Mayo/2012 8. Interfaces gráficas con Swing 44

cl as s Event oSal udo i mpl ement s Act i onLi s t ener {

28/Mayo/2012 8. Interfaces gráficas con Swing 45

public void actionPerformed(ActionEvent e) {

28/Mayo/2012 8. Interfaces gráficas con Swing 46

JTextF ield text = ...;

28/Mayo/2012 8. Interfaces gráficas con Swing 47

28/Mayo/2012 8. Interfaces gráficas con Swing 48

28/Mayo/2012 8. Interfaces gráficas con Swing 49

28/Mayo/2012 8. Interfaces gráficas con Swing 50

28/Mayo/2012 8. Interfaces gráficas con Swing 51

28/Mayo/2012 8. Interfaces gráficas con Swing 52

28/Mayo/2012 8. Interfaces gráficas con Swing 53

28/Mayo/2012 8. Interfaces gráficas con Swing 54

28/Mayo/2012 8. Interfaces gráficas con Swing 55

28/Mayo/2012 8. Interfaces gráficas con Swing 56