Clase Swing

  • View
    212

  • Download
    0

Embed Size (px)

DESCRIPTION

Manual de Instrucciones y ejercicios para desarrollar, dentro de NetBeans.

Transcript

  • Sem

    ana

    XTa

    ller

    de

    Pro

    gra

    mac

    in

    I

  • Res

    um

    en s

    eman

    a an

    teri

    or

    Inicio 10 minutos:Resumen de la semana anterior

    La semana anterior se trabaj con herencia.

  • Apr

    endi

    zaje

    s es

    pera

    dos

    10 minutos:Al trmino de la semana

    Aprenders a desarrollar aplicaciones que permitan lainteraccin con el usuario mediante una interfaz grfica.

    Contenido:225 minutos.

    Material de apoyo:2 PPT.1 Gua Prctica.1 Actividad Propuesta.1 Videotutorial.

  • Pro

    gram

    aci

    n co

    n In

    terf

    aces

    Gr

    ficas

    Programacin con interfaces grficas.

    En java existe una enorme cantidad de APIs (clases) que nos permiten trabajarcon interfaces grficas, este conjunto de clases se conoce como swing, estatecnologa es el reemplazo de de AWT. AWT tambin es un conjunto de clasesque permite crear ventanas, botones, cajas de texto entre otros controles quepermiten crear interfaces grficas, sin embargo la radical diferencia entreSWING y AWT est en que SWING agrega varios comportamientos ms asus clases, pudiendo as crear objetos muchos ms funcionales, ademsinternamente la forma en la que las clases se crean son tambin distintas,en AWT cuando se instanciaba una clase que crease por ejemplo un botn,esta tena la instruccin de pedirle al sistema operativo que la dibujase,creando una dependencia del sistema operativo sobre el cual trabaja elprograma, la versin de SWING en cambio realiza una mejora importante,logrando separar el sistema operativo de la interfaz, de esta forma el cdigorealizado con Swing funciona sobre cualquier sistema operativo que exista.Cuando pensamos en aplicaciones con interfaces graficas debemos conocery entender muy bien el concepto de evento, para que te hagas una idea delo que un evento es, te puedo adelantar que se produce cada vez que unusuario presiona un botn o cambia escribe en una caja de texto, aunque tecuento tambin que no slo los usuarios producen eventos, existen tambineventos que se producen debido a la ejecucin de comportamientos delcdigo.Un evento est asociado al cambio de estado de un control, por ejemplo, enel teclado de tu computador, las teclas se encuentran por defecto en un estadode reposo y seguirn as hasta que alguna fuerza se aplique sobre ellos,cuando presiones una tecla, notars que estado de la tecla ha cambiado,dando paso a la generacin de varios eventos, el primer evento ser teclabajando, despus tecla mantenida abajo y luego tecla subiendo hastallegar otra vez al estado de reposo, en programacin los eventos son tienenlas caractersticas que pueden ser programados, por ejemplo, un botn quese presenta , los eventos son simulares a los de la tecla, siendo el msfamoso el evento que se ejecuta cuando el usuario presiona el botn, en elque se suele programar alguna operacin en particular.En java los eventos funcionan de la siguiente manera, cuando un controlgenera un evento, por ejemplo presionar un botn, hacer scroll sobre una barrade desplazamiento o mover el mouse sobre una imagen provoca que elcontrol empaquete toda la informacin que tenga relacin con el evento y esenviada a un event Listener o conocido como manejador de eventos, conla notificacin de que un evento ha ocurrido el manejador ejecuta elcomportamiento programado.Cuando la informacin es empaquetada, lo que se pasa al manejador es unobjeto, el cual contiene toda la informacin del evento ocurrido, el listener

  • asociado al evento siempre tendr su nombre referente al evento ocurrido,por ejemplo un evento que ha generado el mouse se llamar mouseListener.La siguiente tabla muestra eventos y los controles que lo producen:

    Pro

    gram

    aci

    n co

    n In

    terf

    aces

    Gr

    ficas

  • Ejercicio 01 : PropiedadesDuracin: 15 minutos

    1._ Confecciona un diseo que represente una calculadorabsica .2._ Distingue en tu diseo la funcionalidad que deben tener cada.

    Niv

    eles

    de

    pens

    amie

    nto:

    CO

    MP

    RE

    NS

    IN

    : C

    onfe

    ccio

    nar

    D

    istin

    guir

    Act

    ivid

    ades

    elemento de la interfaz diseada.

  • Crear una ventana es mucho ms sencillo de lo que crees debido a que lamayora los controles y la forma en que se dibujan y se comportan ya estndiseados en Java, todas estas clases se encuentran dentro del packagejavax.swing (javax viene de java extendido), por ejemplo, cuando deseascrear una ventana Jframe desde ahora en adelante, basta con crear una clasecualquiera, la cual hereda de la clase Jframe, esto permitir que la claseherede toda la funcionalidad necesaria para comportarse como tal.

    Una vez la clase hereda de JFrame bastar con instanciar la clase desdemain, para verificar que esta se comporta como una ventana gracias a laherencia realizada.

    En este caso, el objeto es creado y luego mediante su comportamiento setSizese asigna su ancho (800) y largo (600), una vez las dimensiones han sidoespecificada la ventana se pone visible entregando true a setVisible. Unaimagen como esta aparecer en su pantalla.

    Pro

    gram

    aci

    n co

    n In

    terf

    aces

    Gr

    ficas

  • Un Jframe es un objeto en el cual podemos agregar todos los controles quedeseamos (botones, cajas de textos, scrolls, etc.) sin embargo la forma enla que se redibuja en Jframe no es tan eficiente como lo hace el objeto Jpanel,por ello lo ms frecuente es agregar un Jpanel sobre el Jframe y sobre lagregar los controles que necesitemos:

    El cdigo anterior por ejemplo agrega un comportamiento llamadoagregarPanel(), en l se crea un objeto de tipo Jpanel, el cual se agrega aMiventana, luego se establece el tamao, el cual es en este caso el mismoque el de la ventana, por ltimo, se establece su color en rojo.La siguiente imagen muestra el resultado de la ejecucin:

    Existen un objeto el cual es el encargado de posicionar los elementos dentrode la ventana, este objeto recibe el nombre de layout, existen varios tipos delayout, entre los cuales debes seleccionar el que ms se acomode a lo quedeseas lograr.1) Null: permite posicionar elementos sin ayuda de ningn tipo, es decirno hay alineamiento u otras ayudas, el programador decide la posicin exactaque necesita para el control.2) Flow: ordena los elementos en fila (uno al lado del otro) siempre ycuando quepan en la ventana actual

    Pro

    gram

    aci

    n co

    n In

    terf

    aces

    Gr

    ficas

  • 3) Box: permita posicionar elementos de forma horizontal y vertical.4) Border: los elementos son posicionados pegados a la derecha, izquierdaarriba, abajo o al centro.5) Grid: permite posicionar los elementos como si se tratase de una matriz.6) Card: hace que el control ocupe el mayor espacio posible (slo una vezvisible).

    Antes de continuar es importante que aprendas a utilizar alguna IDE dedesarrollo para la creacin de interfaces grficas de usuario, estas permitenhacer el proceso inverso, es decir primero se dibuja y a partir de lo que sedesea lograr se genera el cdigo necesario, as como tambin permite asociary codificar los eventos a cada uno de los controles, veamos cmo realizar loque hemos hecho hasta ahora utilizando una IDE.

    Nota que utilizando NetBeans puedes agregar un objeto de tipo Jframe, alhacerlo vers como la venta es de forma inmediata mostrada, de esta formaayuda al programador a extraerse del cdigo que genera esta interfaz, ashay ms tiempo para la productividad.

    Pro

    gram

    aci

    n co

    n In

    terf

    aces

    Gr

    ficas

  • La siguiente imagen muestra como luce una ventana agregada con netbeans

    Cuando se est trabajando de esta forma se le suele llamar tiempo de diseo.Desde aqu puedes agregar de forma visual botones, cajas te texto, etc.

    A la izquierda de la ventana aparecer una ventana que luce de la siguienteforma:

    Pro

    gram

    aci

    n co

    n In

    terf

    aces

    Gr

    ficas

  • Desde esta ventana puedes seleccionar los controles que deseas agregar,para hacerlo basta con arrastrarlos hasta la ventana.

    Incluso una vez estn los controles posicionados en la ventana puedes cambiarsus atributos, ya que los controles son en realidad instancias de una clasey por ello tienen atributos, por ejemplo, el botn es un objeto que provienede la clase Jbutton.

    Es importante que comprendas que esto no es magia y que hay cdigo quese est generando, para que cuando comience el programa dibuje lo mismoque has realizado en tiempo de diseo, el cdigo en cuestin puede versecambiando la vista de diseo a cdigo.

    La siguiente imagen muestra parte del cdigo que es auto generado porNetBeans:

    Cada vez que agregas un control el objeto recibe un nombre por defecto, el

    Pro

    gram

    aci

    n co

    n In

    terf

    aces

    Gr

    ficas

  • cual se genera basndose en su tipo y un nmero, por ejemplo jButton1, siagregas otro ser jButton2, es recomendable cambiar los nombres ya que endeterminado momento querrs referirte a ellos por cdigo y no podrs recordarcual es cual, por suerte no necesitas ir al cdigo auto generado, basta conpresionar el botn derecho sobre el control y seleccionar la opcin cambiarnombre de variable.

    Es recomendable que para que puedas distinguir el tipo de los objetos luegoutilices las tres primeras letras del tipo y un nombre descriptivo, por ejemplobtnSalir, lo cual asume un botn que permite salir de la ventana actual.

    As como puedes cambiar el nombre de las variables, tambin es posiblecambiar los atributos del objeto en tiempo de diseo, la ventana de propiedadesmuestra una lista con todos los atributos que un objeto