Programacin Orientada a Objetos (3er curso, grupo 32) 7.

Interfaces grficas de usuario

07.05.09

Desarrollo de interfaces de usuario

Generalizacin del uso del ordenador

Importancia creciente de la facilidad de uso

La interfaz de usuario no aade funcionalidad a una aplicacin

Interfaces grficas de usuario

Sin embargo es un aspecto decisivo en el xito de un producto

Desarrollo muy costoso

Tpicamente del orden de un 50% del esfuerzo de desarrollo se dedica a la interfaz

Libreras y herramientas que ayudan al desarrollo de interfaces

Apunte histrico
1981 Xerox Star (ventanas y 1 aparicin del ratn) 1984 Apple Macintosh, X Windows (popularizacin del ratn)
There is no evidence that people want to use these things

Software para el desarrollo de interfaces de usuario (I)

Basado en una comprensin de alto nivel de las interfaces de usuario
Ventanas, botones, mens, campos de texto, etc., ms que pixels Acciones de usuario, comportamiento de la interfaz, etc., ms que la seal de los dispositivos de entrada

Desarrollo ms fcil de la interfaz, , reduccin del coste

Proporcionar parte del cdigo Ayudar a organizar y estructurar el cdigo escrito por el programador

1985 MS Windows Finales de los 90 Interfaces Web

Consistencia de las interfaces a travs de distintas aplicaciones Contrapartida: limitaciones expresivas (posibilidad de programacin complementaria a bajo nivel) Sin toolkits: dibujar y redibujar pixels en la pantalla, seguir coordenadas del ratn, comprobar regiones de la pantalla, gestionar seal de entrada
3 4

Software para el desarrollo de interfaces de usuario (II)

Sistemas de ventanas / toolkits: MS Windows, X + Motif, Mac/OS, etc.
Interfaz al sistema de mensajes del SO Libreras para desarrollo de interfaces de usuario Bajo nivel, alto poder expresivo, difcil de usar

Qu tienen que ver las interfaces de usuario con POO?

El usuario ve objetos en la pantalla, puede manipularlos Los objetos tienen comportamiento propio: distintas formas de responder a una accin del usuario:
Ejemplo: pulsar el ratn sobre un objeto grfico

Libreras de objetos: Java Swing/AWT, Swing/AWT MS MFC, MFC VB, VB .NET, NET etc etc.
Cdigo ms fcil de producir y mantener IDEs con editores interactivos de interfaz

Editores interactivos de interfaces: NetBeans, Jcreator, Visual Studio, etc.

Programacin visual Alta facilidad de uso, alcance limitado

No existe una funcin pulsar ratn que sepa qu debe hacer segn el elemento sobre el que acta Cada elemento grfico contiene la funcionalidad correspondiente a la accin de pulsar el ratn (la responsabilidad reside en el objeto) Programacin basada en eventos (mensajes)
5 6

La construccin de herramientas ms avanzadas es un campo abierto de investigacin

Pablo Castells

Escuela Politcnica Superior Universidad Autnoma de Madrid

Programacin Orientada a Objetos (3er curso, grupo 32) 7. Interfaces grficas de usuario

07.05.09

Un nuevo modelo de programacin: programacin basada en eventos

La ejecucin de una interfaz de usuario no sigue un control de flujo estrictamente secuencial El usuario i ti tiene un alto lt grado d d de lib libertad t d en t todo d momento: t amplio li conjunto j t de acciones posibles Sera muy difcil representar todos los caminos posibles con un modelo de programacin tradicional

Programacin basada en eventos

Modelo utilizado en las interfaces de usuario basadas en ventanas El usuario toma la iniciativa, no el programa El programa se divide en subprogramas asociados a ventanas o componentes grficas Las componentes estn a la espera de las acciones del usuario Las acciones del usuario generan eventos que se acumulan en una cola El sistema de eventos extrae eventos de la cola y los enva a los programas Los programas procesan los eventos recibidos respondiendo segn el tipo de evento Cada tipo de componente se caracteriza por una forma propia de respuesta a los eventos
7 8

La base: el sistema de ventanas

Funciones de dibujo de primitivas grficas: formas geomtricas, texto, etc. Generacin de mensajes (eventos) Usuario Accin del usuario Ventana Mensaje Sistema de ventanas (p.e. Windows) La ventana reacciona al mensaje de modo distinto segn el tipo de mensaje No existe el concepto de objeto grfico pero est implcito Clase de ventana Clase Sentencias case del procedimiento de ventana mtodos Proceso que ejecuta el procedimiento de ventana objeto de la clase

En Windows no hay objetos

La ventana recibe eventos sin diferenciar Respuesta de ventanas a eventos:

Repintarse Cambiar apariencia (y repintarse) Ejecutar una funcin (accin)

10

Toolkit Java para interfaz de usuario (JFC/Swing/AWT)

Usuario Accin del usuario Sistema de ventanas Mensaje Sistema Swing/AWT Invocacin a mtodo

Toolkit Java para interfaces de usuario

Introduccin

Las componentes son objetos A cada tipo de evento corresponde un mtodo de la componente La respuesta a eventos se define implementando mtodos

Componentes Swing/AWT
11

Pablo Castells

Escuela Politcnica Superior Universidad Autnoma de Madrid

Programacin Orientada a Objetos (3er curso, grupo 32) 7. Interfaces grficas de usuario

07.05.09

La librera JFC/Swing/AWT javax.swing, java.awt.event, java.awt

Componentes
Componentes predefinidas Agregacin de componentes Las interfaces se dibujan a s mismas: funciones de dibujo Creacin de nuevas componentes

Construccin de una interfaz de usuario

Componer interfaces con las clases predefinidas
La clase Container, adicin de subcomponentes Control de la apariencia de las componentes manipulando su estado

Definir la disposicin de las partes de un contenedor

Posiciones absolutas Layout managers

Gestionar los eventos: modelo emisor / receptor

Eventos de accin generados por las clases predefinidas Gestin directa del input del usuario

Interaccin con el usuario: gestin de eventos

Emisin de eventos Recepcin y procesamiento de eventos

Definir componentes personalizadas

La clase Graphics Utilizacin de las funciones de dibujo
13 14

Layout de componentes

Ejemplo: un editor de texto bsico

Componentes predefinidas
JLabel JTextField JButton

JTextArea

JFrame

15

16

Disposicin de las componentes

Ancho ocupa todo el ancho de la ventana Ancho fijo, t d centrado Llenar espacio disponible hasta borde inferior de la ventana

Aspectos interactivos
Escribir string del rea de texto en el fichero indicado en el campo de texto

Alto fijo

Editar texto del campo Salir de la aplicacin

Leer el fichero indicado en el campo de texto, asignar como string del rea de texto

Ancho ocupa todo el ancho de la ventana

Editar texto multilnea

17

18

Pablo Castells

Escuela Politcnica Superior Universidad Autnoma de Madrid

Programacin Orientada a Objetos (3er curso, grupo 32) 7. Interfaces grficas de usuario

07.05.09

import javax.swing.*; import java.awt.event.*; import java.io.*; public class Editor extends JFrame implements ActionListener { JTextField fileName; JTextArea editArea; JButton load, save, quit; Editor () { setBounds (100, 100, 335, 325); java.awt.Container p = getContentPane (); p.setLayout (null); JLabel label = new JLabel ("File Name: "); label.setBounds (10, 0, 300, 20); p.add (label); fileName = new JTextField (); fileName.setBounds (10, 20, 300, 20); p.add (fileName); ...
19

... load = new JButton ("Load"); load.setBounds (30, 50, 70, 20); p.add (load); save = new JButton ("Save"); save.setBounds (120, 50, 70, 20); p.add (save); quit = new JButton ("Quit"); quit.setBounds (210, 50, 70, 20); p.add (quit); editArea = new JTextArea (); editArea.setBounds (10, 80, 300, 200); p.add (editArea); load.addActionListener (this); save.addActionListener (this); quit.addActionListener (this); setVisible (true); } // Fin constructor ...

20

... public void actionPerformed (ActionEvent e) { String command = e.getActionCommand (); if (command.equals ("Quit")) System.exit (0); else if (command.equals ("Load")) load (); else l if ( (command.equals d l ("S ("Save")) ")) save () (); } ...

... void load () { try { RandomAccessFile input = new RandomAccessFile (fileName.getText (), "r"); byte buffer[] = new byte [(int) input.length ()]; input.read (buffer); input.close (); editArea.setText (new String (buffer)); } catch (IOException e) { e.printStacktrace (); } } void save () { try { FileWriter output = new FileWriter (fileName.getText ()); output.write (editArea.getText ()); output.close (); } catch (IOException e) { e.printStacktrace (); } } ...
21 22

... public static void main (String args[]) { new Editor (); } } // Fin clase Editor

Componentes

23

Pablo Castells

Escuela Politcnica Superior Universidad Autnoma de Madrid

Programacin Orientada a Objetos (3er curso, grupo 32) 7. Interfaces grficas de usuario

07.05.09

Componentes Swing bsicas

Componentes Swing para datos estructurados / formateados

Ver http://java.sun.com/docs/books/tutorial

25

Ver http://java.sun.com/docs/books/tutorial

26

Componentes Swing: contenedores raz

Componentes Swing: contenedores intermedios

Ver http://java.sun.com/docs/books/tutorial

27

Ver http://java.sun.com/docs/books/tutorial

28

Componentes Swing: contenedores especializados

Jerarqua de componentes Swing (I)

Component Container Window

JComponent

JFrame

JDialog

Abst actB tton AbstractButton

Men Element MenuElement

JTe tComponent JTextComponent

...

JButton

JToggleButton

JMenuItem

JMenuBar

JPopupMenu

JTextField

JTextArea

JEditorPane

JCheckBox

JRadioButton

JMenu

JCheckBoxMenuItem

JTextPane

JRadioButtonMenuItem Ver http://java.sun.com/docs/books/tutorial 29 30

Pablo Castells

Escuela Politcnica Superior Universidad Autnoma de Madrid

Programacin Orientada a Objetos (3er curso, grupo 32) 7. Interfaces grficas de usuario

07.05.09

Jerarqua de componentes Swing (II)

JComponent

Jerarqua de componentes Swing (III)

JComponent

... JLabel

JPanel

JScrollPane

JTabbedPane

JSplitPane

ToolBar

...

... JTable

JTree

JFileChooser

JColorChooser

JScrollBar

JSlider

...

JLayeredPane

JInternalFrame

JList

JComboBox

JOptionPane

JProgressBar

JSpinner

31

32

Utilizacin de las componentes predefinidas

Las clases predefinidas proporcionan:
Un aspecto visual Una respuesta predefinida a eventos del usuario Una API para controlar propiedades especficas de la componente: setFont(), setBackground(), setForeground(), y otras

La clase javax.swing.JComponent
Dibujarse en la pantalla: paintComponent() Control de la apariencia visual: Color: setForeground(Color), getForeground(), setBackground(Color), getBackground() Font: setFont(Font), getFont() Cursor: setCursor(Cursor), getCursor() Tamao y posicin: setSize(int,int), getSize() Dimension, getLocation() Point, getLocationOnScreen() Point, setBounds(int,int,int,int), getBounds() Rectangle (El layout manager puede alterar estos valores) Bordes: setBorder(Border) Tooltips: setToolTipText(String) Y ms
33 34

El programador:
Crea instancias de clases predefinidas La apariencia se controla modificando propiedades (estado) de la componente Subclasifica componentes predefinidas modificando sus mtodos Normalmente no se redefine paint(), a menos que se necesiten grficos Puede crear sus propias componentes desde cero implementando paint() para dibujarlas

Bordes

Clases bsicas auxiliares

Posiciones y tamaos:
Dimension: width, height Point: x, y Rectangle: x, y, width, height, contains(Point) Polygon: npoints, xpoints, ypoints, addPoint(Point)

No son objetos grficos

Color:
new Color (0.8f, 0.3f, 1.0f) en RGB Constantes C t t de d ti tipo C Color: l Color.white, Color.blue, etc. t Funciones para conversin RGB HSB

Font:
new Font ("Helvetica", Font.BOLD + Font.ITALIC, 18) getName(), getStyle(), getSize() Constantes de estilo: Font.BOLD, Font.ITALIC, Font.PLAIN

Cursor:
new Cursor(Cursor.HAND_CURSOR), Cursor.CROSSHAIR_CURSOR, etc.

Border:
35

BorderFactory.CreatexxxBorder()

36

Pablo Castells

Escuela Politcnica Superior Universidad Autnoma de Madrid

Programacin Orientada a Objetos (3er curso, grupo 32) 7. Interfaces grficas de usuario

07.05.09

Agregacin de componentes: la clase java.awt.Container

Las interfaces se construyen agregando componentes a modo de piezas La jerarqua de componentes debe empezar con una ventana o un applet Una componente slo puede aadirse a un Container
add(Component) remove(Component)

Agregacin de componentes (cont.)

Las componentes se pueden aadir:
En el constructor del contenedor En main En cualquier mtodo

Estructura fija Estructura dinmica

Atravesar el rbol de componentes:

Acceso a componentes: getComponent(int), getComponentAt(int,int), getComponentCount(), getComponents() Acceso al contenedor desde una componente: getParent()

Las ventanas no pueden aadirse a otra componente (excepto JInternalFrame) La colocacin de las componentes en un contenedor se puede definir:
Mediante layout managers de distintos tipos A mano, con posiciones absolutas
37

38

Subcontenedores para qu?

Mover en bloque un grupo de componentes Aadir, Aadir quitar, quitar mostrar u ocultar grupos de componentes Layouts complejos: distintos layouts en distintas regiones de la ventana JPanel

Ejemplo

JFrame

JPanel

JList

JPanel

JComboBox

JButton

JList

JTextArea

JPanel

JButton
39

JButton

JButton

JButton

JButton
40

Layout management
Qu es layout?
Disposicin global de un conjunto de componentes

Qu es un layout manager?
Es un objeto de una clase que implementa la interfaz LayoutManager Controla la disposicin de las componentes de un Container

Layout

Existen distintas clases de manager g p para distintos tipos p de layout y setLayoutManager(LayoutManager) de Container Cada clase de contenedor tiene un layout por defecto Por ejemplo: JFrame BorderLayout, JPanel FlowLayout

Por qu layout managers?

La disposicin de una componente depende de las componentes que la rodean y del espacio disponible para el grupo Un layout manager por encima de las componentes individuales impone un orden Las componentes negocian su colocacin y tamao con el layout manager
42

Pablo Castells

Escuela Politcnica Superior Universidad Autnoma de Madrid

Programacin Orientada a Objetos (3er curso, grupo 32) 7. Interfaces grficas de usuario

07.05.09

Tipos de layout managers

Bsicos: BorderLayout, FlowLayout, GridLayout, BoxLayout Avanzados:
CardLayout: dos o ms componentes comparten la misma regin GridBagLayout:
Filas y columnas de tamao variable Componentes que ocupan varias celdas

BorderLayout
class Ventana extends JFrame { Ventana () { Jpanel p = (JPanel) getContentPane (); p.setLayout (new BorderLayout ()); p.add ("North", new JButton("North")); p.add ("South", new JButton("South")); p.add ("East", new JButton("East")); p.add ("West", new JButton("West")); p.add ("Center", new JButton("Center")); } }

GroupLayout SpringLayout

43

44

FlowLayout

FlowLayout (II)

p.setLayout (new FlowLayout p.add (new JButton ("Button p.add (new JButton ("Button p.add (new JButton ("Button p.add (new JButton ("Button p.add (new JButton ("Button

()); 1")); 2")); 3")); 4")); 5"));

Todos los layout managers tienen setHgap, setVgap

FlowLayout f = new FlowLayout (); f.setAlignment(FlowLayout.RIGHT); f.setHgap (20); p.setLayout (f); p.add (new JButton ("Button 1")); p.add (new JButton ("Button 2")); p.add (new JButton ("Button 3")); p.add (new JButton ("Button 4")); p.add (new JButton ("Button 5")); p.add (new JButton ("Button 6"));

45

46

GridLayout
setRows(int), setColumns(int) GridLayout(0,n) tantas filas como hagan falta

javax.swing.BoxLayout (I)
Disposicin en fila, columna, o por ajuste de lnea Respeta las dimensiones preferidas (mnimas/mximas) de las componentes Permite que cada componente decida su alineacin con setAlignmentX(Component.LEFT|RIGHT|CENTER_ALIGNMENT), setAlignmentY(Component.TOP|BOTTOM|CENTER_ALIGNMENT)

p.setLayout (new GridLayout p.add (new JButton ("Button p.add (new JButton ("Button p.add (new JButton ("Button p.add (new JButton ("Button p.add (new JButton ("Button

(2,3)); 1")); 2")); 3")); 4")); 5"));

p.setLayout (new BoxLayout (p, BoxLayout.Y_AXIS)); p.add (new JButton ("Button 1")); p.add (new JButton ("Button 2 is large")); p.add (new JButton ("Button 3 is even larger")); p.add (new JButton ("Button 4")); p.add (new JButton ("Button 5"));

47

48

Pablo Castells

Escuela Politcnica Superior Universidad Autnoma de Madrid

Programacin Orientada a Objetos (3er curso, grupo 32) 7. Interfaces grficas de usuario

07.05.09

javax.swing.BoxLayout (II)
Admite componentes invisibles: rgidas o flexibles
p.setLayout (new BoxLayout (p, BoxLayout.X_AXIS)) p.add (firstComponent); p.add (Box.createRigidArea (new Dimension (5,0))); p.add (secondComponent);

java.awt.CardLayout
Las componentes ocupan un mismo espacio: todo el contenedor Slo una es visible en cada momento
Subir / bajar: next (Container) previous (Container) Mostrar primera, mostrar ltima first (Container) last (Container) Mostrar por nombre componentes aadidas con nombre public void show (Container, String) add (String, Component) de Container

p.setLayout (new BoxLayout (p, BoxLayout.X_AXIS)) p.add (firstComponent); p.add (Box.createHorizontalGlue ()); p.add (secondComponent);

49

50

class CardDemo extends JFrame implements ActionListener, ItemListener { JComboBox combo; CardLayout panelLayout = new CardLayout (); JPanel cardPanel; CardDemo () { cardPanel = new JPanel (); cardPanel.setLayout (panelLayout); cardPanel.add ("One", new JLabel ("Component 1", Label.CENTER)); cardPanel.add ("Two", new JLabel ("Component 2", Label.CENTER)); cardPanel.add ("Three", new JLabel ("Component 3", Label.CENTER)); cardPanel.add ("Four", new JLabel ("Component 4", Label.CENTER)); add ("Center", cardPanel); ...
51

... Button Button Button Button

first = new JButton ("First"); last = new JButton ("Last"); previous = new JButton ("Previous"); next = new JButton ("Next");

combo = new JComboBox (); combo.add ("One"); combo.add ("Two"); combo.add ("Three"); combo.add co bo.add ( ("Four"); ou ); JPanel p = new JPanel (); p.add (first); ... p.add (last); first.addActionListener p.add (previous); last.addActionListener p.add (next); previous.addActionListener p.add (combo); next.addActionListener add ("South", p); combo.addItemListener ... } // Fin del constructor ...

(this); (this); (this); (this); (this);

52

... public void actionPerformed (ActionEvent e) { String command = e.getActionCommand (); if (command.equals ("First")) panelLayout.first (cardPanel); else if (command.equals ("Last")) panelLayout.last (cardPanel); else if (command.equals ("Previous")) panelLayout previous (cardPanel); panelLayout.previous else if (command.equals ("Next")) panelLayout.next (cardPanel); } public void itemStateChanged (ItemEvent e) { String item = (String) e.getItem (); panelLayout.show (cardPanel, item); } } // Fin de CardDemo
53 54

Pablo Castells

Escuela Politcnica Superior Universidad Autnoma de Madrid

Programacin Orientada a Objetos (3er curso, grupo 32) 7. Interfaces grficas de usuario

07.05.09

java.awt.GridBagLayout
Similar a GridLayout
Componentes situadas en una cuadrcula Filas y columnas tienen anchura proporcional al tamao del contenedor

Variables de java.awt.GridBagConstraints
gridx, gridy: posicin superior izquierda (columna y fila)
A continuacin de la componente anterior: GridBagConstraints.RELATIVE (valor por defecto)

Ms flexible y complejo que GridLayout

Filas y columnas pueden tener distintas anchuras Las componentes pueden ocupar ms de una celda

gridwidth, gridheight: nmero de columnas y filas ocupadas

Valor por defecto: 1 Ultimo de la fila / columna: GridBagConstraints.REMAINDER Penltimo de la fila / columna: GridBagConstraints.RELATIVE

La disposicin (posicin y tamao) de cada componente se controla con un objeto de tipo GridBagConstraints
setConstraints (Component, GridBagConstraints) de GridBagLayout La disposicin del objeto al que se asocia la constraint se define por medio de las variables de los objetos GridBagConstraints
55

fill: flexibilidad / rigidez de la componente

Rgida: GridBagConstraints.NONE (valor por defecto) Flexible: GridBagConstraints.VERTICAL, HORIZONTAL, BOTH

weightx, weighty: tamao relativo de columnas y filas

Valor por defecto: 0.0 (celdas rgidas) Valores entre 0.0 y 1.0
56

public class GridBagWindow extends JFrame { protected void makebutton (String name, GridBagLayout gridbag, GridBagConstraints c) { JButton button = new JButton (name); gridbag.setConstraints (button, c); add(button); } public GridBagWindow () { GridBagLayout id gridbag idb = new GridBagLayout id () (); setLayout (gridbag); GridBagConstraints c = new GridBagConstraints (); c.fill = GridBagConstraints.BOTH; c.weightx = 1.0; makebutton ("Button1", gridbag, c); makebutton ("Button2", gridbag, c); makebutton ("Button3", gridbag, c); ...
57

... c.gridwidth = GridBagConstraints.REMAINDER; makebutton ("Button4", gridbag, c); makebutton ("Button5", gridbag, c); c.gridwidth = GridBagConstraints.RELATIVE; makebutton ("Button6", gridbag, c); c.gridwidth = GridBagConstraints.REMAINDER; makebutton ("Button7", gridbag, c); c.gridwidth = 1; // valor por defecto c.gridheight = 2; c.weighty = 1.0; makebutton ("Button8", gridbag, c); c.weighty = 0.0; // valor por defecto c.gridwidth = GridBagConstraints.REMAINDER; c.gridheight = 1; // valor por defecto makebutton ("Button9", gridbag, c); makebutton ("Button10", gridbag, c); } }
58

class ListDemo2 extends JFrame { JTextArea output; JList spanish, italian; ListDemo2 () { spanish = new JList (4, true); spanish.add ("uno"); spanish.add ("dos"); spanish.add ("tres"); spanish.add ("cuatro"); spanish.add ("cinco"); spanish.add ("seis"); italian = new JList (); italian add ("uno"); italian.add ( uno ); italian italian.add add ("due"); ( due ); italian.add ("tre"); italian.add ("quattro"); italian.add ("cinque"); italian.add ("sei"); output = new JTextArea (10, 40); output.setEditable (false); add (output); add (spanish); add (italian); ...

59

60

Pablo Castells

Escuela Politcnica Superior Universidad Autnoma de Madrid

Programacin Orientada a Objetos (3er curso, grupo 32) 7. Interfaces grficas de usuario

07.05.09

... GridBagLayout gridBag = new GridBagLayout (); setLayout (gridBag); GridBagConstraints tc = new GridBagConstraints (); tc.fill = GridBagConstraints.BOTH; tc.weightx = 1.0; tc.weighty = 1.0; tc.gridheight = 2; gridBag.setConstraints (output, tc); GridBagConstraints lc = new GridBagConstraints (); lc.fill = GridBagConstraints.VERTICAL; lc.gridwidth = GridBagConstraints.REMAINDER; gridBag.setConstraints (spanish, lc); gridBag.setConstraints (italian, lc); } }
61 62

Negociacin de dimensiones entre el layout manager y las componentes

Cada tipo de layout manager asigna unas dimensiones y respeta otras
Por ejemplo, FlowLayout y BoxLayout respetan todas, GridLayout ninguna,

BorderLayout algunas (alto o ancho) dependiendo de la regin Las dimensiones que respeta las pregunta a la componente con getPreferredSize() tP f dSi () Dimension Di i
Cada tipo de componente predefinida tiene su propia definicin de getPreferredSize(), p.e. en funcin del texto que muestran, etc. Si se asigna una dimensin con setPreferredSize(Dimension), entonces getPreferredSize() devuelve por defecto esta dimensin Si se quiere establecer dinmicamente la dimensin preferida, sobreescribir getPreferredSize() Anlogamente: get/setMinimumSize(), get/setMaximumSize()
63

Programacin de grficos

Apariencia de las componentes: paintComponent(Graphics)

La apariencia en pantalla de cada subclase de JComponent est definida por el cdigo de paintComponent(Graphics) El cdigo de paintComponent consiste en llamadas a funciones de dibujo sobre el objeto de tipo Graphics Es E poco factible f tibl cambiar bi el l dib dibujo j d de l las componentes t predefinidas d fi id (En cambio, es fcil cambiar su respuesta a eventos)
Normalmente no se redefine paintComponent de las clases predefinidas Para modificar su apariencia, modificar su estado (el sistema refleja los cambios en la pantalla automticamente) En componentes personalizadas desde cero s se redefine paintComponent

Refresco de las componentes: update(Graphics) y repaint()

Las componentes se dibujan a s mismas cuando: Lo decide automticamente el sistema AWT invocando a update(Graphics)
Esto ocurre cuando:
El sistema de ventanas genera cierto tipo de eventos de update debido a la manipulacin de ventanas por el usuario El programa cambia bi propiedades i d d visuales i l d de l las componentes t

Esta invocacin se hace desde el thread de procesamiento de eventos update(Graphics) borra el rea a repintar e invoca a paintComponent(Graphics)

Lo solicita el programa: repaint()

Peticin al sistema AWT para llamar a update lo antes posible programa debe llamar a repaint para refrescar sus componentes personaliza El das cuando se producen cambios de estado que deban reflejarse en su apariencia El programa no debe llamar a paintComponent directamente
66

Es importante que paintComponent no sea costoso de ejecutar

65

Pablo Castells

Escuela Politcnica Superior Universidad Autnoma de Madrid

Programacin Orientada a Objetos (3er curso, grupo 32) 7. Interfaces grficas de usuario

07.05.09

La clase java.awt.Graphics
Pasado a paintComponent() y update() por el sistema runtime de Swing Dibujo de primitivas grficas:
drawLine(int,int, int,int), drawRect(int,int,int,int), drawArc(int,int,int,int,int,int), fillRect(int,int,int,int) drawString(String,int,int) drawImage(Image,int,int[,int,int],ImageObserver)

Interaccin con el usuario

Gestin de eventos

Estado:
Un objeto JComponent est asociado 1-1 a una componente: getGraphics() de Component Origen de coordenadas: translate(int,int) Area clip: getClip(), setClip(int,int,int,int) Color: setColor(Color), getColor() Font: setFont(Font), getFont() Modo XOR: setXORMode(Color)
67

Responder a eventos: ejemplo

1. class Ventana extends JFrame implements MouseListener { Ventana () { addMouseListener (this); } public void mouseClicked (MouseEvent e) { System out println ("El System.out.println ( El usuario me ha pinchado"); pinchado ); } public public public public } void void void void mouseEntered (MouseEvent e) {} mouseExited (MouseEvent e) {} mousePressed (MouseEvent e) {} mouseReleased (MouseEvent e) {} 2.

Responder a eventos
Implementar la interfaz listener correspondiente al tipo de evento
Existe una correspondencia de tipo de evento / tipo de listener

Implementar todos los mtodos de la interfaz

Cada mtodo corresponde a una variedad del tipo de evento

3.

Registrarse como listener de un emisor

Cada tipo de componente puede emitir cierto tipo de eventos

4.

El sistema Swing/AWT se ocupa del resto Las clases que implementan listeners pueden ser componentes Swing, o cualquier otra clase esto queda a eleccin del programador

69

70

El modelo de eventos
Los eventos son objetos de distintas subclases de AWTEvent Se generan eventos cuando:
Se produce input del usuario: MouseEvent, KeyEvent Un widget se acciona: ActionEvent, TextEvent, AdjustmentEvent Una ventana es manipulada: WindowEvent Otras causas: ContainerEvent, ComponentEvent, PaintEvent, etc.

Elementos que intervienen en el procesamiento de un tipo de evento

A cada tipo de evento xxxEvent corresponde: Un tipo de receptor xxxListener (excepto MouseEvent tiene 2) Una lista de clases de componentes que pueden producir el evento Un mtodo addxxxListener para registrar receptores de esos eventos
Este mtodo est definido en las clases que generan el evento Una componente slo puede registrar listeners del tipo de eventos que genera la componente

Los eventos se producen en el contexto de una componente: emisor Otras componentes pueden registrarse para distintos tipo de eventos emitidos por un emisor: receptores Para ser receptora de un tipo de mensajes, una clase debe implementar la interfaz listener correspondiente
71

72

Pablo Castells

Escuela Politcnica Superior Universidad Autnoma de Madrid

Programacin Orientada a Objetos (3er curso, grupo 32) 7. Interfaces grficas de usuario

07.05.09

Ejemplo
Clase de evento: Objetos que lo emiten: Tipo de interfaz listener: Mtodos a implementar en clase listener: Mtodo para registrar listener:
ActionEvent JButton, JTextField, JList, JMenuItem ActionListener actionPerformed (ActionEvent) addActionListener (ActionListener)

Clases de eventos: java.awt.event, javax.swing.event

EventObject Swing

AWTEvent

CaretEvent

ChangeEvent

TableModelEvent

TreeModelEvent ...

TableColumnModelEvent

ActionEvent

ItemEvent

TextEvent

ComponentEvent

AdjustmentEvent

WindowEvent

InputEvent

ContainerEvent

FocusEvent

PaintEvent

Una componente slo puede registrar listeners del tipo de eventos que genera la componente
73

KeyEvent

MouseEvent Swing

MenuDragMouseEvent

MouseWheelEvent

74

Clases de eventos: javax.swing.event

EventObject Swing

Eventos emitidos por cada tipo de objeto

(tabla no exhaustiva) Tipo de componente
JComponent JLabel JButton JCheckBox JComboBox JList JTextField JTextArea JScrollBar JMenuItem

Tipo de evento

Mouse MouseMotion Key Action Window Text Item Container Component Adjustment Focus

...

TreeSelectionEvent

ListDataEvent

MenuEvent

PopupMenuEvent HyperLinkEvent

...

TreeExpansionEvent

ListSelectionEvent

X X X X X X X X X X

JTextComponent

75

JCheckBoxMenuItem JRadioButtonMenuItem

X X X X X X X X X X X X
X

X X X X X X X X X X X X
X

X X X X X X X

X X

X X
X

X
X

X X X X X X X X X X X X
X

X X X X X X X X X X X X
76

Mtodos de los listener (I)

Tipo de evento Tipo de componente
JComponent Container JP JPanel l JScrollPane Window JFrame JDialog
Mouse MouseMotion Key Action Window Text Item Container Component Adjustment Focus

MouseListener
mouseClicked(MouseEvent) mousePressed(MouseEvent) mouseReleased(MouseEvent) mouseEntered(MouseEvent) mouseExited(MouseEvent)

KeyListener
keyTyped(KeyEvent) keyPressed(KeyEvent) keyReleased(KeyEvent) y y

X X X X X X X

X X X X X X X

X X X X X X X

X X X

X X X X X X

X X X X X X X

X X X X X X X

ActionListener
actionPerformed(ActionEvent)

MouseMotionListener
mouseMoved(MouseEvent) mouseDragged(MouseEvent)

77

78

Pablo Castells

Escuela Politcnica Superior Universidad Autnoma de Madrid

Programacin Orientada a Objetos (3er curso, grupo 32) 7. Interfaces grficas de usuario

07.05.09

Mtodos de los listener (II)

WindowListener
windowActivated(WindowEvent) windowDeactivated(WindowEvent) windowOpened(WindowEvent) windowClosing(WindowEvent) windowClosed(WindowEvent) windowIconified(WindowEvent) windowDeiconified(WindowEvent)

Mtodos de los listener (III)

ContainerListener
componentAdded(ContainerEvent) componentRemoved(ContainerEvent)

ComponentListener
componentShown(ComponentEvent) componentHidden(ComponentEvent) componentMoved(ComponentEvent) componentResized(ComponentEvent)

TextListener
textValueChanged(TextEvent)

AdjustmentListener
adjustmentValueChanged(AdjustmentEvent)

ItemListener
itemStateChanged(ItemEvent)

FocusListener
focusGained(FocusEvent) focusLost(FocusEvent)

ListSelectionListener
valueChanged(ListSelectionEvent)
79

...
80

Qu deben hacer los mtodos de los receptores?

Modificar caractersticas de la interfaz
Cambiar colores, fonts, etiquetas, etc. Mover objetos, j cambiar su tamao Ocultar, mostrar, aadir, eliminar componentes Abrir un cuadro de dilogo etc.

Procesar eventos o ignorarlos?

Eventos de bajo nivel recogidos en widgets y elaborados en forma de eventos de alto nivel
Botones: MouseEvent ActionEvent Widgets de texto: MouseEvent, KeyEvent TextEvent, ActionEvent Widgets de seleccin: MouseEvent ItemEvent, ActionEvent etc.

Eventos de cambio de estado de componentes: procesar los eventos inmediatamente vs. acceder al estado cuando se necesite
TextEvent, ItemEvent, ComponentEvent, ContainerEvent, AdjustmentEvent, etc.
81 82

Ejecutar programas de la aplicacin

Normalmente se refleja algn resultado en la interfaz

Ejemplo
class Ventana extends Editor implements MouseListener { CoolButtons () { super (); load.addMouseListener (this); save.addMouseListener (this); quit.addMouseListener (this); } public void mouseClicked (MouseEvent e) {} public void mousePressed (MouseEvent e) { ((Component) e.getSource()).setForeground (Color.green); } public void mouseReleased (MouseEvent e) { ((Component) e.getSource()).setForeground (Color.blue); } public void mouseEntered (MouseEvent e) { ((Component) e.getSource()).setForeground (Color.blue); } public void mouseExited (MouseEvent e) { ((Component) e.getSource()).setForeground (Color.black); } 83 }

class CoolFonts extends CoolButtons { CoolFonts () { super (); editArea.addMouseListener (this); } public void mouseEntered (MouseEvent e) { super.mouseEntered (e); Component c = (Component) e.getSource (); if (c == editArea) { Font f = c.getFont (); c.setFont (new Font (f.getName (), Font.BOLD, f f.getSize Si () + 6)) 6)); } } public void mouseExited (MouseEvent e) { super.mouseExited (e); JComponent c = (JComponent) e.getSource (); if (c == editArea) { Font f = c.getFont (); c.setFont (new Font (f.getName (), Font.PLAIN, f.getSize () - 6)); } } }

84

Pablo Castells

Escuela Politcnica Superior Universidad Autnoma de Madrid

Programacin Orientada a Objetos (3er curso, grupo 32) 7. Interfaces grficas de usuario

07.05.09

JButton
Estado y propiedades
Constructores: JButton(), JButton(String)

Widgets Swing
Clases predefinidas de componentes estndar

El string se utiliza como etiqueta del botn Cambiar / acceder a la etiqueta: getLabel(), setLabel(String) Botn activo / inactivo: setEnabled(boolean)

Operacin
Emite un ActionEvent al ser pulsado Identificacin para el evento de accin: setActionCommand(String)
Asocia un string al botn (por defecto, el mismo que la etiqueta) El string formar parte de la informacin incluida en los ActionEvent's emitidos por el botn (ver getActionCommand() de ActionEvent)
86

JCheckBox
Descripcin
Botn seleccionable con dos estados: seleccionado / deseleccionado

JCheckBox (cont.)
Operacin
Emite un ActionEvent y un ItemEvent al cambiar de estado El item asociado el ItemEvent es el texto del check box Identificacin del item desde el evento:
getItem() String (texto del check box) getItemSelectable() Object (la componente check box)

Estado y propiedades
JCheckBox(), JCheckBox(String), JCheckBox(String,boolean) getLabel(), setLabel(String) getState(), setState(boolean)

87

88

JComboBox JRadioButton
Descripcin
Equivalente a CheckBox, pero seleccin excluyente Los radio buttons se agrupan creando un ButtonGroup y aadindolos al grupo con add(AbstractButton)

Descripcin
Lista de seleccin desplegable Uno de los elementos de la lista est seleccionado Opcin: editable o (por defecto) no editable

Estado y propiedades
JComboBox() (), JComboBox(Object[]) ( j []) addItem(Object), getItemAt(int) Object, getItemCount() getSelectedItem() Object setEditable(boolean)

Operacin
Equivalente a CheckBox Al pulsarlo se emite un ItemEvent extra si, como consecuencia, se deselecciona otro radio button que estaba seleccionado

Operacin
Emite un ActionEvent y un ItemEvent (dos si cambia la seleccin) al seleccionar un item
89

El item asociado al ItemEvent es el item seleccionado

90

Pablo Castells

Escuela Politcnica Superior Universidad Autnoma de Madrid

Programacin Orientada a Objetos (3er curso, grupo 32) 7. Interfaces grficas de usuario

07.05.09

JList
Descripcin
Lista de seleccin con barras de scroll El modo de seleccin puede ser simple o mltiple

JList (cont)
Estado y propiedades: la clase DefaultListModel
Manejo de la lista de datos asociada al JList addElement(Object) get(int) Object remove(int) ...

Estado y propiedades
JList(ListModel), JList(Object[]) getModel() ListModel getSelectedIndex() int, getSelectedIndices() int[], setSelectedIndex(int), setSelectedIndices(int[]), getSelectedValue() Object, getSelectedValues() Object[], isIndexSelected(int) boolean setSelectionMode(ListSelectionModel.SINGLE_SELECTION | SINGLE_INTERVAL_SELECTION | MULTIPLE_INTERVAL_SELECTION) DefaultListModel
91

Operacin
Seleccionar / deseleccionar item: emite ListSelectionEvent El mtodo getValueIsAdjusting() del evento devuelve true mientras el usuario est manipulando la seleccin
92

JTextComponent
Descripcin
Superclase de JTextField y JTextArea Texto editable, seleccionable

JTextField
Descripcin
Texto editable de una sola lnea

Estado y propiedades (adems de las de TextComponent)

JTextField() (), JTextField(String) ( g), JTextField(String,int) ( g, ) getColumns(), setColumns(int)

Estado y p propiedades p
getText(), setText(String) isEditable(), setEditable(boolean) getCaretPosition(), setCaretPosition(int) getSelectedText(), select(int,int), selectAll(), getSelectionStart(), getSelectionEnd(), setSelectionStart(int), setSelectionEnd(int)
93

Operacin
Emite un DocumentEvent cuando se edita el texto Cuando se pulsa 'Enter' emite un ActionEvent con el texto del widget como action command string

94

JTextArea
Descripcin
Texto editable multilnea con scrolling

Estado y propiedades (adems de las de TextComponent)

JTextArea(), JTextArea(String), JTextArea(String,int,int) ( g, , , ), Scrollbars: JTextArea(String,int,int,int) JTextArea.SCROLLBARS_NONE, SCROLLBARS_VERTICAL_ONLY... getColumns(), setColumns(int), getRows(), setRows(int) append(String), insert(String,int), replaceRange(String,int,int)

Operacin
Emite un DocumentEvent cuando se edita el texto No emite ActionEvent's
95 96

Pablo Castells

Escuela Politcnica Superior Universidad Autnoma de Madrid

Programacin Orientada a Objetos (3er curso, grupo 32) 7. Interfaces grficas de usuario

07.05.09

JTable
Descripcin
Lista de seleccin desplegable Uno de los elementos de la lista est seleccionado Opcin: editable o (por defecto) no editable

Estado y propiedades
JComboBox() (), JComboBox(Object[]) ( j []) addItem(Object), getItemAt(int) Object, getItemCount() getSelectedItem() Object setEditable(boolean)

Operacin
Emite un ActionEvent y un ItemEvent (dos si cambia la seleccin) al seleccionar un item
97

El item asociado al ItemEvent es el item seleccionado

98

JMenu
Descripcin
Lista de seleccin desplegable

Estado y propiedades
JComboBox(), JComboBox(Object[]) addItem(Object), getItemAt(int) Object, getItemCount()

Operacin
Emite un ActionEvent y un ItemEvent (dos si cambia la seleccin) al seleccionar un item El item asociado al ItemEvent es el item seleccionado

class ButtonDemo extends JFrame implements ActionListener { JButton b1, b2, b3; ButtonDemo () { JPanel p = (JPanel) getContentPane (); p.setLayout (new FlowLayout ()); b1 = new Button (); b1.setLabel ("Disable middle button"); b1.setActionCommand ("Disable"); b2 = new Button ("Middle button"); b3 = new Button ("Enable middle button"); b3.setEnabled (false); b3.setActionCommand ("Enable"); p.add (b1); p.add (b2); p.add (b3); b1.addActionListener (this); b3.addActionListener (this); } ...

99

100

... public void actionPerformed (ActionEvent e) { String command = e.getActionCommand(); if (command.equals ("Disable")) { b1.setEnabled (false); b2.setEnabled (false); b3.setEnabled (true); } else { b1.setEnabled (true); b2.setEnabled (true); b3.setEnabled (false); } } }

Widgets de seleccin
JCheckBox JList JRadioButton JComboBox JMenu

ItemEvent lleva nmero de item Doble click Seleccin mltiple

Emiten ActionEvents

Ahorro de espacio

Emiten ItemEvents
101 102

Pablo Castells

Escuela Politcnica Superior Universidad Autnoma de Madrid

Programacin Orientada a Objetos (3er curso, grupo 32) 7. Interfaces grficas de usuario

07.05.09

class CheckboxDemo extends Frame { CheckboxDemo () { setLayout (new GridLayout (1, 2)); Panel p1 = new Panel (); Checkbox cb = new Checkbox (); cb.setLabel ("Checkbox 1"); cb.setState (true); p1.add (cb); p1.add (new Checkbox ("Checkbox 2")); p1.add 1 dd (new Checkbox Ch kb ("Ch ("Checkbox kb 3")) ); add (p1); Panel p2 = new Panel (); CheckboxGroup group = new CheckboxGroup (); p2.add (new Checkbox ("Checkbox 4", group, false)); p2.add (new Checkbox ("Checkbox 5", group, false)); p2.add (new Checkbox ("Checkbox 6", group, false)); add (p2); } }
103 104

Radiobutton 1 Radiobutton 2

class ListDemo extends Frame implements ActionListener, ItemListener { TextArea output; List spanish, italian; ListDemo () { setLayout (new FlowLayout ()); spanish = new List (3, true); spanish.add ("uno"); spanish.add ("dos"); spanish.add ("tres"); p ( ("cuatro"); ); spanish.add spanish.addActionListener (this); spanish.addItemListener (this); italian = new List (); italian.add ("uno"); italian.add ("due"); italian.add ("tre"); italian.add ("quattro"); italian.addActionListener (this); italian.addItemListener (this); ...

... Panel p = new Panel (); p.setLayout (new GridLayout (2, 1, 10, 10)); p.add (spanish); p.add (italian); output = new TextArea (10 (10, 40); output.setEditable (false); add (output); add (p); } // Fin del constructor ...

105

106

... public void actionPerformed (ActionEvent e) { List list = (List) (e.getSource ()); String language = (list == spanish)? "Spanish" : "Italian"; output.append ("Action event on " + list.getSelectedItem () + " in " + language + ".\n"); } public void itemStateChanged (ItemEvent e) { List list = (List) (e.getItemSelectable ()); String language = (list == spanish)? "Spanish" : "Italian"; int index = ((Integer) (e (e.getItem getItem ())) .intValue intValue (); if (e.getStateChange () == ItemEvent.SELECTED) { output.append ("Select event on item " + index + " (" + list.getItem (index) + ")" + " in " + language + ".\n"); } else output.append ("Deselect event on item " + index + " (" + list.getItem (index) + ")" + " in " + language + ".\n"); } }
107 108

Pablo Castells

Escuela Politcnica Superior Universidad Autnoma de Madrid

Programacin Orientada a Objetos (3er curso, grupo 32) 7. Interfaces grficas de usuario

07.05.09

java.awt.Menu
Descripcin
Conjunto de items de distintas modalidades:
MenuItem: tipo botn CheckboxMenuItem: tipo checkbox Menu: submen

java.awt.Menu (cont.)
Estado y propiedades
getLabel(), setLabel(String)de Menu / MenuItem MenuItem Activar / desactivar item: isEnabled(), setEnabled(boolean)de Menu / MenuItem Seleccin de CheckboxMenuItem: getState(), setState(boolean)

C Construccin t i

Menu

CheckBoxMenuItem

Menu(), Menu(String), MenuItem(), MenuItem(String), CheckboxMenuItem(), CheckboxMenuItem(String) Aadir items: add(String|MenuItem|CheckboxMenuItem|Menu), insert(String|MenuItem|...,int), getItem(int), addSeparator() Se requiere una barra de mens para aadir mens a una ventana:
setMenuBar(MenuBar) de Frame add(Menu), getMenu(int), getMenuCount() de MenuBar
109

Operacin
MenuItem emite slo ActionEvent como un botn, con el label del item pulsado como action command string Source del evento: el item o el Menu contenedor del item CheckboxMenuItem emite slo ItemEvent como un checkbox, con el label del item seleccionado / deseleccionado como label del evento Source del evento: el propio CheckboxMenuItem
110

Widgets de texto
TextComponent Label TextField TextArea

java.awt.Label
Descripcin
Texto esttico

Estado y propiedades
Label(), Label(String), Label(String,LEFT|RIGHT|CENTER) getText(), setText(String) getAlignment(), setAlignment(LEFT|RIGHT|CENTER)

Operacin
No tiene

111

112

class TextDemo extends Frame implements ActionListener { TextField textField; TextArea textArea; TextDemo () { setLayout (new FlowLayout ()); textField = new TextField (20); textArea = new TextArea (5, 20); textArea.setEditable (false); add (textField); add (textArea); textField.addActionListener (this); } public void actionPerformed (ActionEvent evt) { String text = textField.getText (); textArea.append (text + "\n"); textField.selectAll (); } }
113 114

Pablo Castells

Escuela Politcnica Superior Universidad Autnoma de Madrid

Programacin Orientada a Objetos (3er curso, grupo 32) 7. Interfaces grficas de usuario

07.05.09

java.awt.Dialog
Descripcin
Depende de otra ventana:
Se destruye cuando se destruye la ventana principal Desaparece cuando se minimiza la ventana principal

class DialogWindow extends Frame implements ActionListener { private SimpleDialog dialog; private TextArea textArea; public DialogWindow () { textArea = new TextArea (5, 40); textArea.setEditable (false); add ("Center", textArea); Button button = new Button ("Click to bring up dialog"); button.addActionListener (this); Panel panel = new Panel (); panel.add (button); add ("South", panel); } public void actionPerformed (ActionEvent event) { if (dialog == null) dialog = new SimpleDialog (this, "A Simple Dialog"); dialog.setVisible (true); } public void addLine (String text) { textArea.append(text + "\n"); }
115

E t d y propiedades Estado i d d
Dialog (Frame [,String] [,boolean]) Modal / no modal: isModal(), setModal(boolean) isResizeable(), setResizeable(boolean) de Window FileDialog extends Dialog
getDirectory(), setDirectory(String) getFile(), setFile(String)

116

class SimpleDialog extends Dialog implements ActionListener { TextField field; DialogWindow parent; Button setButton; SimpleDialog (Frame w, String title) { super (w, title, false); parent = (DialogWindow) w; Panel p1 = new Panel (); p1.setLayout (new GridLayout (2, 1)); Label label = new Label ("Enter text here:"); p1.add (label); field = new TextField (40); field.addActionListener (this); p1.add (field); add ("Center", p1); ... }

... Panel p2 = new Panel(); p2.setLayout (new FlowLayout (FlowLayout.RIGHT)); Button b = new Button ("Cancel"); b.addActionListener (this); setButton = new Button ("Set"); setButton.addActionListener (this); p2.add (b); p2.add (setButton); add ("South", p2); pack (); } public void actionPerformed (ActionEvent event) { Object source = event.getSource(); if ((source == setButton) || (source == field)) parent.addLine (field.getText()); field.selectAll (); setVisible (false); }
118

117

Widgets personalizados
class Boton extends Canvas implements MouseListener { private boolean selected = false; protected String label; public Boton (String str) { label = str; addMouseListener (this); new Mover (this); } public void paint (Graphics g) { Dimension dim = getSize (); FontMetrics metrics = g.getFontMetrics (); g.drawRect (0, 0, dim.width-1, dim.height-1); g.drawString (label, (dim.width - metrics.stringWidth (label)) / 2, (dim.height - metrics.getHeight ()) / 2 + metrics.getMaxAscent ()); } ... 120

119

Definir aspecto visual

Pablo Castells

Escuela Politcnica Superior Universidad Autnoma de Madrid

Programacin Orientada a Objetos (3er curso, grupo 32) 7. Interfaces grficas de usuario

07.05.09

Mtodos para negociar tamao con layout managers

public Dimension getMinimumSize () { Dimension dim = getPreferredSize (); return new Dimension (dim.width / 2, dim.height / 2); } public Dimension getMaximumSize () { Dimension dim = getPreferredSize (); return new Dimension (dim.width * 2, dim.height * 2); } ...
121

Respuesta visual (feedback) cin del usuario a acc

... public Dimension getPreferredSize () { FontMetrics metrics = getGraphics () .getFontMetrics (); return new Dimension (metrics.stringWidth (label) + 20, metrics.getHeight () + 10); }

... public void mouseClicked (MouseEvent e) { selected = !selected; if (selected) { setBackground (Color.black); setForeground (Color.white); } else { setBackground (Color.white); setForeground (Color.black); } } public public public public ... void void void void mousePressed (MouseEvent e) {} mouseReleased (MouseEvent e) {} mouseEntered (MouseEvent e) {} mouseExited (MouseEvent e) {}

122

... public String getLabel () { return label; } public void setLabel (String str) { label = str; repaint (); } public boolean getState () { return selected; } public void setState (boolean state) { selected = state; if (selected) { g ( (Color.black); ); setBackground setForeground (Color.white); } else { setBackground (Color.white); setForeground (Color.black); } } // public void mouseClicked (MouseEvent e) { // setState (!selected); // }
123

Interfaz para controlar el estado del widget

class Boton2 extends Boton { boolean pointedAt = false; public Boton2 (String str) { super (str); } public void paint (Graphics g) { super.paint (g); Dimension dim = getSize (); if (pointedAt) g.drawRect (4, 4, dim.width-9, dim.height-9); } public void mouseEntered (MouseEvent e) { pointedAt = true; repaint (); } public void mouseExited (MouseEvent e) { pointedAt = false; repaint (); }
124

1. Inicio

4. Exit

class BotonAccion extends Boton { private ActionListener multicaster = null; public BotonAccion (String str) { super (str); } public void mouseClicked (MouseEvent e) { super.mouseClicked (e); Generacin de eventos en processEvent ( respuesta a la interaccin new ActionEvent ( this, ActionEvent.ACTION_PERFORMED, label)); } public void addActionListener (ActionListener listener) { multicaster = AWTEventMulticaster.add (multicaster, listener); } public void processEvent (AWTEvent e) { if (e.getID () == ActionEvent.ACTION_PERFORMED && multicaster != null) multicaster.actionPerformed ((ActionEvent) e); super.processEvent (e); } }
126

2 Enter 2.

5 Enter 5.

3. Click

6. Drag

125

Ms feedback a acciones del usuario

}

Pablo Castells

Escuela Politcnica Superior Universidad Autnoma de Madrid

Programacin Orientada a Objetos (3er curso, grupo 32) 7. Interfaces grficas de usuario

07.05.09

ID de los eventos
Clase de evento vs. tipo de evento
Para obtener ID: getID() de AWTEvent

Corresponden a tipos de eventos en el sistema de ventanas subyacente

Tipo de evento: tipo concreto representado por un nmero de ID

Procesamiento interno de eventos

Desde el sistema de ventanas hasta los mtodos receptores

Clase de evento: categora de eventos, engloba conjunto de IDs Las clases contienen constantes que definen los IDs que agrupan p.e. MouseEvent.MOUSE_DRAGGED, ActionEvent.ACTION_PERFORMED

Cada mtodo de un listener corresponde a un ID de evento

Por lo tanto, si se utilizan listeners el programador no necesita utilizar los ID Los ID los utiliza AWT para determinar a qu mtodos invocar sobre los listeners

Los ID se utilizan para crear y emitir eventos desde el programa

P.e. para definir nuevos widgets El ID se pasa como argumento al constructor de las distintas clases de eventos
128

ID de evento mtodo de listener

Clase de evento ID de evento MOUSE_CLICKED MOUSE_PRESSED MOUSE_RELEASED MouseEvent ouse e t MOUSE_ENTERED MOUSE_EXITED Mtodo de listener mouseClicked(MouseEvent) Listener

La cola de eventos y el bucle de eventos

Inicializacin
El intrprete crea una cola de eventos (interno)

mousePressed(MouseEvent)

El intrprete lanza un thread con un bucle que extrae y procesa eventos de la

mouseReleased(MouseEvent) mouseEntered(MouseEvent) mouseExited(MouseEvent) MouseListener

cola (interno)

Entrada E t d d de eventos t
El sistema AWT captura los mensajes que le enva el sistema de ventanas, crea eventos AWT y los introduce en la cola de eventos (interno)
MouseMotionListener

MOUSE_MOVED MOUSE_DRAGGED

mouseMoved(MouseEvent) mouseDragged(MouseEvent)

La entrada en cola est optimizada para eliminar redundancias en eventos consecutivos de tipo MOUSE_MOVE, MOUSE_DRAG, PAINT y UPDATE

KEY_TYPED KeyEvent KEY_PRESSED KEY_RELEASED

keyTyped(KeyEvent) keyPressed(KeyEvent) keyReleased(KeyEvent)

129

KeyListener

Procesamiento de eventos: el bucle de eventos

Invoca a dispatchEvent del evento extrado sobre su componente emisora
130

MouseEvent ID: MOUSE_PRESSED Click Count: 1 Modifiers: BUTTON1_MASK Point: (342, 206) Time: 925986950380 Source:

Cola de eventos Cola de eventos

El nuevo modelo de eventos

Sistema AWT

Componentes listener

Mensaje Windows ID: WM_LBUTTONDOWN O O Point: (342, 206) Time: 925986950380 lparam, wparam: ... Window:

mousePressed ( MouseEvent ) Ventana / Componente

Sistema de ventanas (Windows)

131

Bucle de eventos

MouseEvent

Componente source
132

Pablo Castells

Escuela Politcnica Superior Universidad Autnoma de Madrid