Interfaz gráfica de usuario

12
Interfaz gráfica de usuario Desarrolla software de aplicación .utilizando programación orientada. 07/10/2013 CBTIS128 2”R” Gabriela Staysy Pérez Chávez

Transcript of Interfaz gráfica de usuario

Page 1: Interfaz gráfica  de usuario

Interfaz gráfica de usuarioDesarrolla software de aplicación .utilizando programación orientada.

07/10/2013CBTIS1282”R”Gabriela Staysy Pérez Chávez

Page 2: Interfaz gráfica  de usuario

Introducción

Page 3: Interfaz gráfica  de usuario

Interfaz gráfica usuario

Esta forma de interfaz de usuario es muy simple y nos ha permitido centrarnos en todo aquello que tiene que ver tan solo con la programación orientada a objetos con el lenguaje java sin tener que tratar al mismo tiempo con ventanas, botones y otros elementos similares .

Las interfaces graficas de usuario (GUI) ofrece al usuario , ventanas cuadros de dialogo , barras de herramientas, botones, listas despegables y muchos otros elementos con los que ya estamos muy acostumbrados a tratar.

Las aplicaciones son conducidas por eventos y se desarrollan haciendo uso de la clase que para ello nos ofrecen la API de Java.

La API de Java para desarrollo de GUI

La interfaz de usuario es la parte del programa que permite al usuario interaccionar con el .la API de Java proporciona una biblioteca que proporciona un conjunto de herramientas para la construcción de interfaces graficas que tienen una apariencia y se comportan de forma semejante en todas las plataformas en las que se ejecutan.

La estructura básica de la biblioteca gira entorno a componentes y contenedores. Los contenedores contienen componentes y son componentes a su vez, de forma que los eventos puedan tratarse tanto en contenedores como en componentes. La API está constituida por clases, interfaces y derivaciones AWT Y SWING.

Una aplicación Swing se construye mezclando componentes con las siguientes reglas. Debe existir, al menos, un contenedor de alto nivel (Top-Level Container), que provee el soporte que las componentes Swing necesitan para el pintado y el manejo de eventos. Otras componentes colgando del contenedor de alto nivel (éstas pueden ser contenedores o componentes simples). Un ejemplo:

Import javax.swing.*;

Import java.awt.*;

Import java.awt.event.*;

public class HolaMundoSwing {

public static void main(String[] args) {

JFrame frame = new JFrame("HolaMundoSwing");

final JLabel label = new JLabel("Hola Mundo");

Page 4: Interfaz gráfica  de usuario

frame.getContentPane().add(label);

//frame.setDefaultCloseOperation (JFrame.EXIT_ON_CLOSE);

frame.addWindowListener(new java.awt.event.WindowAdapter(){

public void windowClosing(WindowEvent e){

System.exit(0);

}

}

);

frame.pack();

frame.setVisible(true);

}

}

import javax.swing.JOptionPane;

public class Addition {

public static void main( String args[] )

{

String firstNumber, secondNumber;

int number1, number2, sum;

// read in first number from user as a string

firstNumber = JOptionPane.showInputDialog( "Enter first integer" );

// read in second number from user as a string

Page 5: Interfaz gráfica  de usuario

secondNumber = JOptionPane.showInputDialog( "Enter second integer" );

// convert numbers from type String to type int

number1 = Integer.parseInt( firstNumber );

number2 = Integer.parseInt( secondNumber );

sum = number1 + number2;

// display the results

JOptionPane.showMessageDialog( null, "The sum is " + sum, "Results", JOptionPane.PLAIN_MESSAGE );

System.exit( 0 ); // terminate the program

}

}

Page 6: Interfaz gráfica  de usuario

Manejo de eventos

Cuando se realiza una interacción con el programa, se envía un evento,Es fundamental su comprensión para programar con GUI

La fuente del evento o Evento (event source)

El componente GUI con el cual interactúa el usuario.

La información sobre un evento esta encapsulada

Se deriva de java.util.EventObject hacia java.awt.AWTEvent

Por. Ejem. Teclas, movimiento click de mouse, manejo de una ventana.

Diferentes fuentes de eventos producen diferentes tipos de eventos

Un botón envía ActionEvent

Una ventana envía WindowEvent

El objeto evento (event object)

Encapsula información acerca del evento que ocurrió.

Incluye información que el que escucha el evento necesita para manejar el evento.

Cuando ocurre un evento, lo envía a escuchadores registrados

El que escucha el evento (event listener)

Implementa una interfase especial

Determina la reacción el un evento

Page 7: Interfaz gráfica  de usuario

Librerias Java para diseñar GUI

AWT

" Primera librería gráfica

" Se usan llamadas a los sistemas de ventanas nativos (componentes

“pesados”)

" Intento de un API común mediante el “mínimo común

denominador” de todos los sistemas de ventanas

" Problemas: componentes escasos, aplicaciones dependientes del

entorno de ventanas.

Swing

" Evolución tras AWT

" Se usa código propio de Java que dibuja en una ventana

proporcionada por el sistema de ventanas (componentes “ligeros”).

" Mayor cantidad de componentes y uniformidad de las aplicaciones

gráficas en todos los entornos de ventanas

Pasos para definir una GUI con Swing

1. Crear los componentes

2. Definir las propiedades de los componentes

3. Crear los contenedores que almacenan los

componentes

4. Especificar los LayoutManagers para disponer los

componentes en los contenedores

5. Añadir los componentes en los contenedores

6. Definir la escucha de eventos

7. Mostrar la GUI al usuario

Page 8: Interfaz gráfica  de usuario

Oyentes de eventos

Los eventos los generan los componentes y los procesan objetos que implementan la interfaz EventListener.

Pasos:

"1. Crear los componentes

"2. Crear los oyentes de los eventos que queremos tratar

"3. Asociar los oyentes a los componentes

"4. Cuando un evento se genera en un componente, la

aplicación llama al método correspondiente del oyente

asociado a ese componente

Objetos de la clase Event

Cuando se llama a una función que procesa un

evento, definida en una clase que implementa el

interfaz EventListener, se pasa como parámetro

información sobre el evento producido

public void actionPerformed(ActionEvent event) {

// código para tratar el evento

}

Tipos de oyentes

Para cada evento con nombre xxxEvent, se define una interfaz llamada xxxListener en la que se definen los métodos que van a manejarse relacionados con ese evento

ActionEvent -> ActionListener

MouseEvent -> MouseListener

Page 9: Interfaz gráfica  de usuario

¿Dónde implementar la interfaz?

Dado que los oyentes deben ser objetos de una clase que implemente la interfaz, surge la cuestión de qué clase debe implementar la interfaz. Tres opciones:

Crear una clase que defina el componente e implemente ,el oyente, Crear una clase aparte,Crear una clase interna.

Clase que define el componente y la interfaz

class MiClase implements ActionListener{

public MiClase() {

Button btn = new Button("Boton");

btn.addActionListener(this);

}

public void actionPerformed(ActionEvent e) {

// Aqui va el codigo de la accion!!!

}

}

Clase aparte

class MiClase{

public MiClase()

{

Button btn = new Button("Boton");

btn.addActionListener(new MiOyente());

}

}

class MiOyente implements ActionListener{

public void actionPerformed(ActionEvent e)

{

Page 10: Interfaz gráfica  de usuario

}

}

Clase interna

Button btn = new Button("Boton");

btn.addActionListener(

new ActionListener() {

public void actionPerformed(ActionEven e)

{

// Aqui va el codigo de la accion

}

}