UNIVERSIDAD NACIONAL DE SAN ANTONIO ABAD DEL CUSCO DEPARTAMENTO ACADEMICO DE INFORMATICA PROGRAMACION DIGITAL 2 GGUIA 08: INTRODUCCION A PROGRAMACION VISUAL ENJAVA 1. Competencias ‘+ Utilizar interfaces graficas en la creacién de aplicaciones en Java. 2. Trabajo preparatorio '* Conocer la creacién de aplicaciones en consola y el paradigma de POO en Java. 3. Fundamento teérico Hasta ahora hemos desarrollado programas que usan la consola para interactuar con el usuario, Esa forma de interfaz de usuario es muy simple y nos ha permitido centrarnos en todo aquello que tiene que ver tan sélo 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 gréficas de usuario (GUI) ofrecen al usuario ventanas, cuadros de didlogo, barras de herramientas, botones, listas desplegables 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 las clases que para ello nos ofrece la API de Java. La interfaz de usuario es la parte del programa que permite al usuario interaccionar con él. La API de Java proporciona una biblioteca de clases para el desarrollo de Interfaces graficas de usuario (en realidad son dos), La biblioteca 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 ejecuten. La estructura basica de la biblioteca gira en torno a componentes y contenedores. Los contenedores contienen ‘componentes y son componentes a st vez, de forma que los eventos pueden tratarse tanto en contenedores como en componentes. La API esta constituida por clases, interfaces y derivaciones. AWT y Swing ‘Swing es una biblioteca de interfaces graficas de usuario para Java. Viene incluida con el entorno de desarrollo de Java (JDK) y extiende a otra libreria mas antigua llamada AWT Algunos componentes AWT:Frame Textarea TextField Button Algunos componentes de Swing.4. Aplicacién de la gufa Ejercicio 1 Creemos un nuevo proyecto “Ejercicio 1”, y cree una clase principal “Main”. igite el siguiente cédigo: Import javax.ewing.dFraney public class vain extends Jrrane { public Main() { this .setsize (200,200); this -sectitie("sFrane"); this secberaultclosaoperation ( this -setVisiple (true): Public static void main(string[] args) ( new Main (); La clase JFrame es una de las clases mas importantes de Swing, Esta clase es una ventana que tiene un contenedor (ContentPane) en donde podemos poner controles. Se entiende a JFrame como una ventana normal de Windows, pero véase que para su uso hay que importar la libreria javax.swing.JFrame. También nétese la utilizacién de extends JFrame. En el ejemplo se creo un constructor Main(), donde definimos algunos parémetros como el tamafio, titulo, etc). Compile el cédigo y observe el comportamiento. Se crea una ventana del tamafio indicado. Jlabel es una etiqueta con la que podemos mostrar texto en nuestras aplicaciones. Permite agregar texto, cambiar el formato, la posicién, agregar imagenes y muchas cosas més. Agreguemos al constructor las siguientes dos lineas de cédigo: Juabel Ibliola ~ new stabel ("ola"); add (Ibixolay : Y también hay que importar la libreria correspondiente: javax.swing.JLabel, compilemos nuestras modificaciones, y nos deberia dar este resultado: Cree un método simple que sume dos ntimeros (sumar(int a, int b)) y modifique la etiqueta anterior para que muestre “La suma es: “, yel valor de la suma de sumar(15,7).Ejercicio 2. En el ejercicio 1 vimos como podemos interactuar desde cédigo y crear interfaces graficas ‘como JFrame y JLabel. Pero también para facilitar la construccién de interfaces graficas, los diferentes IDEs nos ofrecen “Constructores” de interfaces. Por ejemplo, en Eclipse, basta con crear un nuevo proyecto y agregar una nueva clase “JFrame” que pertenece al “Swing designer”. snaueehweae QE En diferentes IDEs la ventana resultante tendré una estructura si componentes importantes: lar. Destaquemos tres 1. Nos permite cambiar entre disefio y cédigo. 2. Lapaleta, ofrece los distintos componentes gréficos disponibles.3. Esel JFrame que hemos creado donde podemos agregar componentes. Cree la siguiente interface, simplemente arrestando distintos componentes de la paleta: [EM PrmerFo gece su rontvee: Ingese swsaehoce: Ingress suelo Los componentes que utilizaremos son JLabel, JTextField y JButton. Ademés de JFrame. En propiedades puede editar los valores de los atributos de cada objeto, por ejemplo, en uno de los JLabel se tiene: “ol b%.|#E (Constructor properties) 21, 39, 15, 14) javax swing JLabel 240,240,240 Brne Tahoma 11 000 .. LEADING Ingrese sus nombres: ~ toolTipText el verticalAlign... CENTER Edite las propiedades Variable y text de cada JLabel y también de cada JButton. Ademas fije el atributo Title del JFrame = “Mi Primer Formulario”. También puede probar el resto de propiedades que es lo que hace en cada objeto. Puede usar valores como txtNombres, txtApellidos, txtEdad, btnMayorEdad, etc. Ahora revise el cédigo, vea como se autogenera a partir del editor: import Javavawt vest mts dnport jevsxoving.cPranet Smpore jevarsving sree apore je fomeet da sapere mere fae mpoce Jia ulna, ceonponjut Atpore Javan sing aroupsnjouemdgnnents iSject jovanioina.smutton fmpore jovswesovene hee ioastanse? fapore jneslaweismeot actiouener feos Gnuned SnesDijimos que las aplicaciones son conducidas por eventos, por ejemplo, los componentes “sButton” tienen eventos que disparan las acciones que realizara como por ejemplo al pulsar un botén. En la pestafia de disefio, puede hacer doble clic en el botén “éMayor de edad?” y nos llevara al cédigo del evento actionPerformed de ese botén. También puede ver los eventos en las propiedades de cada objeto, por ejemplo: Bisa * heey. palates 0 = operon tole igite el siguiente cédigo, en el evento del botén que verificara si alguien es mayor de edad 0 no, Gbutton brnlayoridad — new Jeurton(*avayer Ge Edads") benMayorEdad.addactionListener (new ActionListener () [ Public void actionPerformed(ActionEvent arg0) { int edad = Integer. valueor(txtEdad.get Text ()) + 4 (edaaci7) JoptionPane. showMessageDialog(null, "=r\ menor de edad"); else JoptionPane. showMessageDialog(null, "Eres mayor de edad")? ne La clase JOptionPane hace realmente facil el mostrar ventanas standards para mostrar y pedir informacién alos usuarios. el metodo showMessageDialog(...) crea una ventana que muestra un mensaje entregado en el parémetro. Compile el programa y verifique que muestre el mensaje correcto dependiendo que edad se haya ingresado: Mensje cS Mensaje x = oe ‘Aceptar Con lo aprendido previa mente, implementa que al pulsar el botdn “Limpiar”, se deje en blanco los tres JTextField de Nombres, Apellidos y edad. Ejercicio 3. En practicas anteriores se introdujo el concepto de ArrayList con caracteristicas similares a las, estructuras de datos dindmicas que vimos en la tiltima guia y en sesién de clases. Implemente la accién del evento del botén “ingresar”, de tal manera que se agreguen elementos a unArrayList donde se almacene el nombre, el apellido y la edad de diferentes valores que ingresemos. Una vez que se ingresa un elemento nuevo, se debe mostrar un mensaje "Persona agregada’, y limpiar los JTextFields, para poder ingresar mas personas. Por simplicidad puede agregar cadenas como (Juan Perez Loayza 15) para cada registro nuevo. ‘Ademés, agregue un nuevo JTextField que permita recuperar, la informacién de un registro dando el indice en el ArrayList como dato de entrada, ejemplo: | seman — = {mime 5 i) Evaluacién ‘* Presente ejercicio 1. (4 pts) ‘* Presentar ejercicio 2 (6 pts) '* Presentar ejercicio 3 (10 pts) iografia ‘+ Object-Oriented Program Barnes, 2000 ‘© httos://docs.oracle,com/javase/7/docs/api/iavax/swing/packa, ig with Java: An Introduction, 1st edition, David mary.htm!