Interfaz

Tema 9: Interfaces gráficas
q

q

¿Cómo construir GUIs? Interfaces gráficas de usuario. Ejemplos. Packages java.awt y java.awt.event AWT (Abstract Windows Toolkit) Jerarquía de clases. Clase Graphics. Ejemplos. Usando Widgets a toda potencia. Uso de gestores de maquetación. Manejo de eventos en AWT. Diseño e implementación de una aplicación

© F.Escolano & M.I.Alfonso

PG -

1

1: ¿Cómoconstruir GUIs?

© F.Escolano & M.I.Alfonso

PG -

2

GUIs: Graphic User Interfaces

Aplicación = GUI + gestión eventos Componentes: – Windows y frames, Menús desplegables, File dialogs, Canvas, Botones, Scroll. – Package java.awt (Gráficos) – Package java.awt.event (Gestión eventos)

© F.Escolano & M.I.Alfonso

PG -

3

Frames, menús y sub-menús

© F.Escolano & M.I.Alfonso

PG -

4

File dialogs

©F.Escolano & M.I.Alfonso

PG -

5

Botones, listas desplegables y gráficos

© F.Escolano & M.I.Alfonso

PG -

6

2: AWT: Abstract Windows Toolkit

© F.Escolano & M.I.Alfonso

PG -

7

Elementos
AWT (Abstract Windows Toolkit): Conjunto de clases para construir interfaces gráficas de usuario (GUIs).

Componentes: Menús, botones, etiquetas, selectores, áreas de texto, etc. Eventos: listeners(objetos que se asocian a componentes y manejan los eventos específicos de su clase (pulsado de botón, eventos de ratón, de ventana, etc.)

© F.Escolano & M.I.Alfonso

PG -

8

Jerarquía de clases

© F.Escolano & M.I.Alfonso

PG -

9

Clase Graphics: Programación gráfica
import java.applet.*; import java.awt.*; public class Hola extends Applet { public static void paint(Graphics g) {g.drawString(“Hola!”, 20, 10); } } g.drawRect(0, 0, 50, 100); // draw: dibujar. g.drawOval(0, 0, 50, 100); g.clearRect(0, 0, 50, 100); // clear: color backg. g.fillRect(0, 0, 50, 100); // fill: rellenar color. Coloy miColor = new Color(Color.green); g.setColor(miColor); g.setFont(new Font(“SansSerif”, Font.BOLD, 12);
© F.Escolano & M.I.Alfonso

PG -

10

Graphics: ejemplo

import java.applet.*; import java.awt.*;public class Ovalos extends Applet { public void paint (Graphics g) { int i; // Pintar fondo negro g.setColor(Color.black); g.fillRect(0,0, 500, 350);

© F.Escolano & M.I.Alfonso

PG -

11

Graphics: ejemplo

// Pintar los diez agujeros for (i=0; i<=9; i++) pintarAgujero(i, g); // Pintar el texto g.setColor(Color.blue); g.setFont(new Font("TimesRoman",Font.BOLD, 36)); g.drawString("Ovalos...!", 22,300); // Pintar el texto como haciendo sombra) g.setColor(Color.white); g.drawString("Ovalos...!", 20, 298); }

© F.Escolano & M.I.Alfonso

PG -

12

Graphics: Ejemplo
public void pintarAgujero(int n, Graphics g) { int x0=50, // x-esquina sup-izq del ovalo exterior y0=50, // y-esquina sup-izq del ovalo exterior w0=350,// anchura del ovalo exterior h0=200,// altura del ovalo exterior INC_X = 30,// Incremento-x entre ovalos INC_Y = 10, // Incremento-y entre ovalos INC_RG = 10, // Incremento de R y G (color) INC_B = 25; // Incremento de B (azul) g.setColor(new Color(n*INC_RG, n*INC_RG, (n+1)*INC_B)); g.fillOval(x0+n*INC_X, y0+n*INC_Y, w0-n*INC_X, h0-n*2*INC_Y); } }
© F.Escolano & M.I.Alfonso

PG -

13

Componentes AWT: Ejemplos
Button comp = new Button("Etiq"); Checkbox comp =Checkbox("Etiq", true); CheckboxGroup cbg = new CheckboxGroup(); Checkbox comp1 = new Checkbox("Etiq 1", cbg, true); Checkbox comp2 = new Checkbox("Etiq 2", cbg, false); Choice comp = new Choice(); comp.add("Etiq 1"); comp.add("Etiq 2"); comp.add("Etiq 3"); Label comp = new Label("Etiq"); TextField comp = new TextField("Etiq",15); // número de columnas

© F.Escolano & M.I.Alfonso

PG -

14

Componentes AWT:Ejemplos
TextArea comp = new TextArea("Etiq", 10,20); // filas y cols. List list = new List(3, false); // Visualizo 3 list.add("Etiq 1"); // elementos, list.add("Etiq 2"); // sin selección list.add("Etiq 3"); // múltiple list.add("Etiq 4"); list.add("Label 5"); Scrollbar comp = new Scrollbar(Scrollbar.HORIZONTAL, 0, // valor inicial 5, // ancho del slider -100, 100); // rango

© F.Escolano &...