01 - practica lenguaje programacion windowbuilder

6
PRÁCTICA DE LENGUAJE DE PROGRAMACIÓN Tema: Interfaces gráficas 1. Eclipse 3.7 Indigo (Eclipse IDE for Java Developers) incorpora el plugin WindowBuilder, que sirve para construir interfaces gráficas en java de manera rápida y fácil. A continuación realiza los pasos: a) Inicia un nuevo proyecto con nombre Visor: Menú Archivo > Nuevo > Proyecto Java b) Ahora en el proyecto Visor agrega el siguiente elemento: Menú Archivo > Nuevo > Otras > WindowBuilder > Swing Designer > Aplication Window. Con nombre Aplicación. c) El resultado será similar a: Observe que hay dos tipos de vistas: Código y Diseño. Si escoges Diseño se apreciará algo como esto: Prof. Simón Quispeluza M. IESPP-”José Jiménez Borja” Paleta con los controles que se insertan en la ventana Ventana del programa

Upload: simonquispeluza

Post on 03-Aug-2015

354 views

Category:

Documents


4 download

TRANSCRIPT

Page 1: 01 - Practica Lenguaje Programacion Windowbuilder

PRÁCTICA DE LENGUAJE DE PROGRAMACIÓN

Tema: Interfaces gráficas1. Eclipse 3.7 Indigo (Eclipse IDE for Java Developers) incorpora el plugin WindowBuilder, que sirve

para construir interfaces gráficas en java de manera rápida y fácil. A continuación realiza los pasos:a) Inicia un nuevo proyecto con nombre Visor: Menú Archivo > Nuevo > Proyecto Javab) Ahora en el proyecto Visor agrega el siguiente elemento: Menú Archivo > Nuevo > Otras >

WindowBuilder > Swing Designer > Aplication Window. Con nombre Aplicación.c) El resultado será similar a:

Observe que hay dos tipos de vistas: Código y Diseño. Si escoges Diseño se apreciará algo como esto:

Prof. Simón Quispeluza M. IESPP-”José Jiménez Borja”

Paleta con los controles que se insertan en la ventana

Ventana del programa

Page 2: 01 - Practica Lenguaje Programacion Windowbuilder

2. Antes de proseguir hagamos un análisis del código generado por WindowBuilder:

3. Procederemos a insertar una barra de menús para ello realiza:a) En la Paleta sección Menu escoge JMenuBar y haz clic en parte superior de la ventana (área

barra menú)b) Ahora escoge un objeto JMenu e insértalo en la barra creada, asignándole el nombre Archivo. c) Luego selecciona un JMenuItem y lo insertas en el menú Archivo con el nombre Abrir.d) De manera similar inserta otra opción en el menú Archivo llamada Guardar.e) Después inserta un separador que se halla en la Paleta > Components > Separatorf) Como última opción del menú Archivo inserta una opción llamada Salir.g) Finalmente inserta un nuevo Menú en la barra llamándolo Ayuda con una única opción llamada

Acerca...h) El resultado será:

Prof. Simón Quispeluza M. IESPP-”José Jiménez Borja”

import java.awt.EventQueue;import javax.swing.JFrame;

public class Aplicacion {

private JFrame frame;

// Lanzar el programapublic static void main(String[] args) {

EventQueue.invokeLater(new Runnable() {public void run() {

try {Aplicacion window = new Aplicacion();window.frame.setVisible(true);

} catch (Exception e) {e.printStackTrace();

}}

});}

// Constructorpublic Aplicacion() {

initialize();}

// Inicializar contenido del frame private void initialize() {

frame = new JFrame();frame.setBounds(100, 100, 450, 300);frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);

}}

AWT y SWING son bibliotecas gráficas. Swing es mejorada y se basa en awt.

La clase JFrame representa la ventana del principal del programa y funciona como un “contenedor” de otros objetos gráficos como menús, controles, etc

La clase EventQueue almacena los eventos que llegan aun contenedor provenientes de sus componentes

InvokeLater pone en la cola de eventos de ejecución un objeto con interfaz Runnable

Crea la ventana asignándole valores iniciales como tamaño, etc.

try y catch se utilizan para detectar y procesar posibles errores que pueden ocurrir durante la ejecución del programa.

Page 3: 01 - Practica Lenguaje Programacion Windowbuilder

4. Activa la Vista Código y observa que en el método Initialize de la Aplicación se han agregado varias líneas de código. Usando lenguaje apropiado de Objetos deduce y explica las siguientes instrucciones:

5. Si ejecutas la aplicación se observa que muestra una ventana con los menús definidos y que al escoger cualquier opción no se realiza absolutamente nada. Es necesario entonces “programar” las opciones del menú para que realicen lo que queremos. La primera que vamos a implementar es la opción Salir, para ello realiza:a) En vista Diseño y apuntando a

la opción Salir invoca el menú contextual (clic botón derecho).

b) En el menú contextual selecciona Add Event Handler > action > actionPerformed

c) En vista Código en el método actionPerformed agrega:

Prof. Simón Quispeluza M. IESPP-”José Jiménez Borja”

JMenuBar menuBar = new JMenuBar(); ..............................................

frame.setJMenuBar(menuBar); ..............................................

..................................................................................

..................................................................................

JMenu mnNewMenu = new JMenu("Archivo"); .........................................

menuBar.add(mnNewMenu); .........................................

..................................................................................

..................................................................................

JMenuItem mntmAbrir = new JMenuItem("Abrir"); ...................................

mnNewMenu.add(mntmAbrir); ...................................

.................................................................................

mntmSalir.addActionListener(new ActionListener() { public void actionPerformed(ActionEvent arg0) {

System.exit(0); //agrega esta línea }});

Page 4: 01 - Practica Lenguaje Programacion Windowbuilder

6. En todo programa se necesitan variables (objetos en el caso de la POO) que existan permanentemente mientras dure la ejecución del programa. Estos objetos se definen, normalmente, como propiedades en la clase “principal” (la que tiene el método main que es el punto de entrada al programa), así por ejemplo para nuestro Visor además del frame necesitaremos los siguientes objetos, por ello decláralos como propiedades de la clase Aplicacion:

7. Modificar las primeras líneas de código del método initialize agregando:

8. A continuación de las líneas anteriores modificar y/o agregar las siguientes instrucciones:

Nota:• En el método initialize sólo deberá tener las instrucciones descritas en los puntos 7. y 8. y todas

aquellas referidas a la construcción de la barra de menús, opciones y manejadores de eventos. Cualquier otra instrucción comentarlas con //.

• Prueba ejecutar el programa y verifica que funcione adecuadamente.

Responder:• ¿Que representa Toolkit? : .................................................................................................................

…..........................................................................................................................................................

• El método setLocationRelativeTo permite :.........................................................................................

…..........................................................................................................................................................

• ¿Qué significa y representa width y height?:…..................................................................................

…..........................................................................................................................................................

• ¿Qué representa null?:….....................................................................................................................

Prof. Simón Quispeluza M. IESPP-”José Jiménez Borja”

private JScrollPane scroll; // para desplazar en imagenes grandesprivate JLabel etiqueta; // en su propiedad icon se mostrará la imagenprivate JFileChooser dlgArchivo; // Cuadro de diálogo estandarprivate BufferedImage imagen; // usado para guardar la imagen en disco

frame = new JFrame();

// Crear objetos (agregar esto)scroll = new JScrollPane();etiqueta = new JLabel();dlgArchivo = new JFileChooser();

// fijar tamaño del frame a 1/4 de la pantallaframe.setBounds(0, 0,Toolkit.getDefaultToolkit().getScreenSize().width / 2,

Toolkit.getDefaultToolkit().getScreenSize().height / 2);

// poner el frame en el centro de la pantallaframe.setLocationRelativeTo(null);

frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE); //Terminar prg si se cierra el frame

// añadir componente en el contenedorframe.getContentPane().add(scroll);

scroll.setViewportView(etiqueta); // vincular la etiqueta (y su contenido) con el scroll

Page 5: 01 - Practica Lenguaje Programacion Windowbuilder

9. Ahora nos centraremos en la gestión de eventos. Para ello y de forma análoga al paso 5. agrega un oyente de eventos (Add Event Handler > action > actionPerformed) para la opción Abrir del menú archivo y codificar el método actionPerformed como se muestra a continuación:

Observaciones:• Aún no probar la ejecución del programa, hay que hacer algunos ajustes.• Mover y modificar la instrucción de creación del objeto JMenuItem Guardar de tal forma que

esté antes de la creación de la opción Abrir y debe quedar como sigue:final JMenuItem mntmGuardar = new JmenuItem("Guardar");

• Y como instrucción siguiente a la anterior, inhabilitar la opción Guardar, ello se logra con:mntmGuardar.setEnabled(false);

• Hacer los cambios y corrija posibles errores hasta Ejecutar correcamente el programa. Luego analice el código, haga pequeños cambios de ser necesario para entenderlo así como objetos, propiedades y métodos. Luego describa:

dlgArchivo.showOpenDialog(frame): ...................................................................................................

..............................................................................................................................................................

setFileFilter: .........................................................................................................................................

JFileChooser.APPROVE_OPTION: .......................................................................................................

ImageIO.read: .......................................................................................................................................

..............................................................................................................................................................

try {…} catch {…} : ….......................................................................................................................

setIcon: ................................................................................................................................................

dlgArchivo.getSelectedFile().getPath(): ................................................................................................

…..........................................................................................................................................................

Prof. Simón Quispeluza M. IESPP-”José Jiménez Borja”

public void actionPerformed(ActionEvent arg0) { dlgArchivo.setDialogTitle("Abrir Imagen"); // fijar título al JFileChooser // filtrar sólo archivos .jpg .png .gif if (dlgArchivo.getFileFilter().getDescription()!= "Imagenes") // sólo una vez

dlgArchivo.setFileFilter(new FileNameExtensionFilter("Imagenes", "jpg", "png", "gif"));

if (dlgArchivo.showOpenDialog(frame) == JFileChooser.APPROVE_OPTION) {try {

// intentar cargar imagenimagen = ImageIO.read( new File(dlgArchivo.getSelectedFile().getPath()) );

} catch (IOException error) { /* si ocurre error aquí se le trata */ }

if (imagen != null) { // se pudo cargar la imagen?// poner nombre en la barra de título del frameframe.setTitle(dlgArchivo.getSelectedFile().getPath());//cargar archivo de imagen en la etiquetaetiqueta.setIcon(new ImageIcon(dlgArchivo.getSelectedFile().getPath()));mntmGuardar.setEnabled(true); // hacer disponible la opcion Guardar

}else

JOptionPane.showMessageDialog(frame, "No se pudo cargar la imagen", "Aviso", JoptionPane.INFORMATION_MESSAGE);

}}

Page 6: 01 - Practica Lenguaje Programacion Windowbuilder

10. De manera complementaria implementar la opcion Guardar con el siguiente código:

Analice el código y explique. Detalle por ejemplo qué realiza o representa cada línea de código.

Salida del Visor creado

Prof. Simón Quispeluza M. IESPP-”José Jiménez Borja”

public void actionPerformed(ActionEvent arg0) {dlgArchivo.setDialogTitle("Guardar Imagen");if (dlgArchivo.showSaveDialog(null) == JFileChooser.APPROVE_OPTION) {

String[] formatos = { "jpg", "png", "gif" };Object opcion = JOptionPane.showInputDialog(null,

"Seleccione un formato:", "",JOptionPane.QUESTION_MESSAGE, null, // icono. no hay.formatos, // se puede pasar un arrayformatos[1]); // opcion por defecto

if (opcion != null) { // aceptó un formato?try { // guardar imagen en archivo

ImageIO.write(imagen, opcion.toString(), new File(dlgArchivo.getSelectedFile().getPath() + "."

+ opcion.toString()));} catch (IOException e1) { /* tratar error */ }

}}

}