6°PRACTICA- HALUROS DE ALQUILO. SINTESIS 5.6 DIBROMO COLESTEROL
10. 5.6._Interfaces_Gr_ficas_del_Usuari.PDF
of 10
-
Upload
oscar-javier-jerez-gonzalez -
Category
Documents
-
view
222 -
download
0
Transcript of 10. 5.6._Interfaces_Gr_ficas_del_Usuari.PDF
-
7/25/2019 10. 5.6._Interfaces_Gr_ficas_del_Usuari.PDF
1/10
5.6
Interfaces graficas del usuario
Programar en
Java
sin
utilizar
interf cesgr fic s
del
usu rio
GUI,
por sus
siglas en ingles) es no aprovechar uno de los aspectos mas importantes que
ofrece la
programacion
y en
particular Java.
A
continuacion,
se
describe
el
manejo
de
ventanas, textos,
botones
y
paneles
enJava atraves de labiblioteca basicaAbstract Window Toolkit AWT) . Elejem-
plo a
desarrollarse
en
esta
seccion es muy importante, ya que
servira
de
base
para
el
desarrollo
de
software generado
en los
capitulos posteriores
en el
libro.
Todo sistema
de
ventanas requiere alguna ventana
donde
desplegar
la
informa-
cion.
Existen dos fllosofias separadas, aunque relacionadas en Java, que afecta-
ra n
el
diseno como
ya se
menciono
antes: aplicaciones y applets. Las aplicacio-
nes requieren de un Frame marco) donde desplegar y permitir la interaccion
con el usuario; mientras que un
applet
puede hacer esto en
forma
directa en la
pantalla
del browsero mediante nuevos marcos de manera similar a las apli-
caciones. Empecemos por lo mas
basico
y mostremos el uso de los marcos a
traves
de la
clase
I n t e r f a c e U s u a r i o :
c l a s s I n t e r f a c e U s u a r i o e x t e n d s r a m e
Esta clase
heredara
todas las caracteristicas de un marco para manejarse como
una
ventana. Antes
de
proseguir,
es
necesario comprender
que
toda aplicacion
con
ventanas requiere
un
manejo
de
eventos
de
entradas
y
salidas. Esto significa
que laaplicacion, antesdehacer algo
debe
especincar como controlara eventos
generados
por el
teclado
y, en
especial,
el raton.
Java define
dos
interfaces
muy
importantes en
AWT
que son
W i n do w L i st e ne r
y
A c t i o nL i s te n e r. W i nd o w L i st e ne r
define
losmetodos
relacionados
con el
manejo
de eventos
para
una
ventana,
como abrir
y
cerrar.
Y
A c t i on L i s te n e r
define
lo s
metodos para manejar even-
tos dentro de laventana,
como apretar
un
boton.
De ta l manera, es
necesario
que laclase
I n t e r f a c e U s u a r i o
implemente estas dos interfaces si se ha planea-
do
manejar
estos
tipos
de
eventos.
Por
tanto,
extendemos la
definicion
de la
clase I n t e r f a c e U s u a r i o
de la
siguiente manera:
c lass
InterfaceUsuario
e x te n d s
F rame
i m p l e m e n ts W i n d o wL i s te n e r ,
ActionListener
Dado que las interfaces
deben
tener susmetodos sobreescritos, primero haga-
mos esto con los siguientes metodos de
W i n do w L i s t en er :
public void w indowClosed(WindowEvent event {}
public void w i n d o wD e i co n i f i e d (W i n d o wEv e n t event
{}
public void w indow con i fi ed (W indow E ve n t event
{}
public void w i n d o wAc t i v a te d (W i n d o wEv e n t event
{}
public
void w indowDeact i va ted (WindowEven t event {}
public
void
windowOpened(WindowEvent
event
{}
public void w indowClos ing(WindowEven t event
{
S y s t e m . e x i t ( O ) ;
}
2 CAP. 5
P R O G R A M A C I O N O R I E N T A D A
A OBJETOS CON
J A V A
-
7/25/2019 10. 5.6._Interfaces_Gr_ficas_del_Usuari.PDF
2/10
Estos
so n
todos los metodos
definidos por la interface
W i n do w L i s te n er :
w i n d o w C l o s e d para
el
manejo
de
eventos
a
partir cle una ventana cerrada.
w i n d o w e i o n i f i e d para
el
manejo
de
eventos
a
part i r
de una
ventana
no
iconificada.
w indow lcon if ied
para el ma nejo de eventos a partir de una ven tana iconifi-
cada.
win d owAct iv a ted para el manejo de
eventos
a partir de una ventana acti-
vada.
w in dow D ea c tiv ated
para
el
manejo
de
eventos
a
partir
de una
ventanades-
activada.
w indowOpened para el manejo de eventos a partir de una ventana abierta.
w i n d o w C l o s i n g para el manejo de eventos en el momento que se cierra una
ventana.
Estos metodos deben sobreescribirse aunque queden vacios. Elunico que real-
mente se ha sobreescrito es w i n d o w C l o s i n g para permitir salir de la aplicacion
cuando este evento ocurra. Existen alternativas para sobreescribir unicamente
los
metodos
deseados ut i l izando
adaptadores
en lugar de interfaces
pero
este
tema no se abordara en este libro.)
L a
sobreescritura de la interface
A c t i on L i s te n e r
es mucho mas importante para
las ventanas, ya que a traves del metodo a c t i o nPer formed se
debe
especificar
que
hacer cuando,
por
ejemplo,
se
presiona algunboton dentro
de la
ventana.
El siguiente metodo muestra la sobreescritura de ac t i onPe r f o rmed ,
al
imprimir
el
evento
ocurrido:
public
void
actionPerform ed ActionE vent event)
{
Sys tem.ou t .p r i
ntln( Action: +event.getActi
onC ommand ));
}
Esta
es la logica basica de l
manejo
de
eventos
de un
marco. Para completar
la
funcionalidad necesitamos inicializarla clase
I n t e r f a c e U s u a r i o
y definir a lguna
pantalla
a
desplegar. Paraello definimos
el
siguiente constructor:
public
InterfacetlsuarioQ
{
setSize 800,600);
setBackground(Col
or.l ightGray);
addWindowListener(this);
pantalla = newPantallaPrincipal this);
desplegarPantalla(pantalla);
}
Describamos las llamadas dentro de este constructor, la mayoria de las cuales
son opcionales:
setSize define el tamano de l marco.
set
B ackg ro u nd asigna
un
color
de
fondo
de
manera opcional.
addW indo w L i s te ner registra el marco this) con el administrador de venta-
nas de
Java para
que
podamos
manejar
los
eventos.
Este
metodo
es
nece-
sario.
P a n t a ll a P r i n c ipa l instancia la pantalla a ser desplegada, algo qu e veremos
a continuac ion. O bserve qu e la variable
p a n t a l l a
se define como un atri-
I N T E R F A C E S
G R A F I C A S
DEL
U S U A R I O 83
-
7/25/2019 10. 5.6._Interfaces_Gr_ficas_del_Usuari.PDF
3/10
buto de la
clase I n t e r f a c e l l s u a r i o , p r i v a t e P a n t a l l a
p a n t a l l a ; ,
esto
tam-
bien se explicara junto con laclase P a n t a l l a .
d e s p l e g a r P a n t a l l a despliega
la
pantalla
recien
instanciada.
Antes de
mostrar
los
detalles
de
P a n t a l l a P r i n c i p a l ,
se estudiara
como
se
des-
pliega una pantalla mediante el metodo
show,
deflnido por la clase
F r a m e
protected voiddesplegarPantalla(Pantalla p) {
showQ;
}
Esde notar que aun no se hautilizadoelargumento de tipo P a n t a l l a . Estose
remediara
cuando
se
aclare
la logica que se aplicara
mediante
laexplicacion de
la
clase P a n t a l l a P r i n c i p a l . Antes
de
hacer
eso
mostraremos
el
metodo
m a i n
para instanciarla clase I n t e r f a c e U s u a r i o :
public
static
void main(String[] args) {
System.out.println( Starting
System... );
InterfaceUsuario
iu = new
InterfaceUsuarioQ;
}
Si se
quisiera instanciar
el
marco
bajo
control
de un
applet lo
cual
tambien
es
aceptable
se
definiria
la
siguiente clase
I n t e r fa c e U s u a r i o A p p l e t, que
hereda
de
la clase A pp le t , y se sobreescribiria elmetodo i n i t , e n lugar del metodo m a i n
public class InterfaceUsuarioApplet extends Applet {
public voidinit
{
showStatus( Starting
System... );
InterfaceUsuario iu = new
InterfaceUsuarioQ;
}
}
Tambien
hay que
senalar
que definiremos la
granmayoria
de losmetodos
como
p r o t e c t e d , dado que se accesan dentro de un mismo paquete. Solo los meto-
dos
sobreescritos
de las
interfaces
deben definirse
como publicos. Asimismo
se
definiran los constructors como publicos aunque algunos pudieran tambien
establecerse como protected
si son los
objetos instanciados dentro
del
mismo
paquete. Como ejemplo vamos a crear un
Panta l laPr inc ipal
que genere eldes-
pliegue que se muestra en la figura5.25.
Para simplificar eldiseno de una de
estas pantallas
se
dividen
ensecciones16-
gicas llamadaspaneles que visualmente no
afectan
la
presentacion
de lapan-
talla,
pero
son una buena guia para el disenador. En nuestro caso dividiremos
la
pantalla
en
paneles horizontales
que
contengan
los
diversos elementos
de la
pantalla, osea
textos
y
botones.
Dado
que en
general
se
despliegan multiples pantallas
definamos una
super-
clase P a n t a l l a , como algunos lectores ya se habran imaginado de la siguiente
manera:
class Pantalla {
protected InterfaceUsuario interfaceUsuario;
protected Panel panel;
8
CAP. 5
P R O G R A M A C I O N
O R I E N T A D A A OBJETOS CON JAVA
-
7/25/2019 10. 5.6._Interfaces_Gr_ficas_del_Usuari.PDF
4/10
igur
5 25 jemplo
de
marcodesplegandoPantallaPrincipal.
p r o t e c t e d B u t t o n b o t o n ;
p r o t e c t e d V e c t o r p a n e l e s b o t o n e s ;
Inicialmente definimos
un
atributo
de
tipo I n t e r f a c e U s u a r i opara guardar
la re-
ferenda
a la clase
encargada
de
administrar
el
despliegue.
Los
atributos
de
tipo
Panel y Bu t ton so n
referencias
que se utilizaran
cuando
se estenmanipulando
paneles o
botones
demanera temporal.Elaspecto masimportantede esta clase
es que se
definiran
dos
arreglos
de tama no dinamico
mediante
la
clase
Ve c to r
con el fin de
guardar
la
lista
de
lospaneles
y
botones
que se
instancien
en las
diversas pantallas
ya que
estosrequieren
un manejo
especial
y los
arreglos
fa -
cilitaran
su
manipulacion
como veremos mas adelante.
Se
define
el
constructor para
la
clase
P a n t a l l a de
manera
que
reciba
una
refe-
renda a guardarse de la clase I n t e r f a c e U s u a r i o .
public Pantalla InterfaceUsuario
ui) {
interfaceUsuarioui;
inicializarPantalla );
crearPantalla
);
}
Ademas
este constructor
inicializara la
pantalla mediante
la
llamada crear-
P a h t a l l a
que
esta sobreescrita
por las
pantallas particulares.
En la
superclase
el metodo sepuede definir como
abstracto
yprotegido
protected abstract
void crear an ta l la
);
I N T E R F A C E S G R A F I C A S D E L U S U A R I O
8
-
7/25/2019 10. 5.6._Interfaces_Gr_ficas_del_Usuari.PDF
5/10
Este
metodo
es el corazon de la logica de
despliegue. Pero antes
se
reiniciali-
za n los
vectores para
los
paneles
y
botones
que estan
definidos
por el
metodo
i ni ci
aliz a r P a n t a l
1 a.
protected voidinicializarPantalla()
{
paneles = newVectorO;
botones
= new
VectorO;
}
Definamos
ahora
laclase P a n t a l l a P r i n c i p a l
como subclase
de Pa n t a l l a :
class
P a n t a l l a P r i n c i p a l
e x t e nd s
P a n t a l l a
El
constructor
de
P a n t a l l a P r i n c i p a l
llamara al
constructor
de la
superclase
m e-
diante
la
llamada
s u p e r , a la cual
pasara
el
parametro
ui de
tipo Interface-
U s u a r i o .
public PantallaPrincipal (InterfaceUsuario
ui) {
super(ui);
}
Eldisenode las pantallas se harau tilizando paneles, o
sea
secciones de la
pan-
talla. Esto se guardara dentro del metodo c r e a r P a n t a l l a , en este caso de la
clase P a n t a l l a P r i n c i p a l , que se vio en la figura 5.25.Esta clase no tiene qu e
ser publica, ya que se
llama dentro
del
constructor
de la
superclase. Dado
que
existe
una
sobrescritura
del
metodo
este debe definirse
como protegido.
protected
void crearPantalla
)
El
primer panel contiene
el
titulo
de la
pantalla como
se
muestra
a
continua-
cion:
panel = newPanel();
pane l .se tLayout (newGridLayout(2,1));
panel .add(new Label( SIST EM A D E R E S E R V C I O N E S D E
V U E LO ,
Labe l .CENTER)) ;
panel.add(new Label( Pantalla Principal (P-l) ,
Label .CENTER)) ;
paneles .addElement(panel ) ;
Luego de
instanciar
el
objeto
de
tipo Panel ,
se
le asigna
a u n
administrador
para realizar
la
organizacion interna
del
panel
por
ejemplo
G r i d L a y o u t ,
qu e
define a una
cuadricula
de 2 x 1.
Luego
anadimos
los
elementos
de l
panel
en
este caso
un
titulo
Labe l )
correspondiente
a un
texto
que no es modificable,
el cual
se
centra dentro
de la
cuadricula.
U na vez
completado
el
panel
lo
agre-
gamos
a la lista de
p a ne l e s .
El panel
qu e
sigue contiene cuatro
filas y u na
sola columna
donde se
insertan
cuatro lineas de texto como se ve a continuacion:
panel
= new
Panel();
pane l .se tLayout (new GridLayout(4,l));
panel .add(new
Label( Servicios Ofrecidos: , Labe l .CENTER)) ;
panel .add(new Label( * Consulta d e V u e lo s ,
Tarifas
yHorarios ,
Labe l .CENTER)) ;
panel .add(new
Label( * Reserva
d e
Vuelos , L ab e l .CENT ER) ) ;
8
CAP. 5
P R O G R A M A C I O N
O R I E N T A D A A OBJETOS C O N
J A V A
-
7/25/2019 10. 5.6._Interfaces_Gr_ficas_del_Usuari.PDF
6/10
pane l .add(new Label( *
Compra
de
Boletos , L ab e l . C ENTER)) ;
paneles.addElement(panel);
De nuevo se agrega el panel a lalista de paneles. El panel que viene es simi-
lar al primero
yagrega una etiqueta, como se ve acontinuacion:
panel = newPanel();
panel
. se t l_ayo ut (new GridLayout(l,l));
panel .add(new Label
( Para registrarse
p o r p r i m e r a v e z o p r i m a :
1 1
,
L ab e l . C ENTER)) ;
paneles.addElement(panel);
En
el
siguiente panel
se
hace
algo
diferente.
Se
instancia
un
boton
(Button),al
cual
le
ponemoscomo etiqueta Registrarse por P r i m e r a Vez ,comose ve a
continuacion:
panel = new
Panel();
p a n e l . s e t L a y ou t ( n e w GridLayout(l,l));
boton
= new
Button ( Registrarse
po r P r i m e r a
V e z ) ;
b o t o n e s . a d d E l e m e n t ( b o t o n ) ;
panel.add(boton);
p a n e l e s . a d d E l e m e n t ( p a n e l ) ;
Ademas de agregar el
panel
a la lista de paneles, se anade el
boton
a la
lista
debotones.Elproximo panelessimilaralprimeroyagregauna etiqueta, como
se ve a continuacion:
panel = newPanel();
panel.setLayout(newGridLayout(l,l));
panel .add(new Label( Para
a c c e s a r
todos los
servicios
devuelo
(consulta,
reserva,
c o mpra)
o
modificar
su
registro,
oprima , L a b e l . C E N T E R ) ) ;
p a n e l e s .a d d E l e m e n t (p a n e l ) ;
En este
panel se instancia un campo de texto (TextField), ademas se le agre-
ga una
etiqueta L o g i n : como
se ve a
continuacion:
panel = newPanel();
p a n e l . s e t L a y o u t ( n e w GridLayout(l,l));
pane l .add(new Label( Login: , L a b e l . L E F T ) ) ;
pane l .add(new
TextField
(20));
paneles.addElement(panel);
Parael penultimo panel instanciamos un campo de texto adicional(TextField),
al que, ademas, se le agrega una etiqueta P a s s w o r d : como se describe a con-
tinuacion:
panel = new
Panel();
panel.setLayout(newGridLayout(l,l));
pane l ,add(new Label( Password: ));
pane l .add(new TextField(20));
p a n e l e s . a d d E l e m e n t ( p a n e l ) ;
En
el ultimo panel instanciamos dos
botones
adicionales,
OK
y
Salir:
panel = newPanel();
panel.setLayout(new
GridLayout(l,l));
I N T E R F A C E S G R A F I C A S DELU S U A R I O 87
-
7/25/2019 10. 5.6._Interfaces_Gr_ficas_del_Usuari.PDF
7/10
boton = newButton( OK );
bo tones .addE lement bo ton) ;
panel.add(boton);
boton = newButton( Salir );
botones.addElement bo ton) ;
panel.add(boton);
pane les .addElemen t pane l );
Ahora
-
7/25/2019 10. 5.6._Interfaces_Gr_ficas_del_Usuari.PDF
8/10
-
7/25/2019 10. 5.6._Interfaces_Gr_ficas_del_Usuari.PDF
9/10
System.out.println( Error en
PantallaPrincipal: +str);
return
this;
}
For ejemplo,
si elusuario
presiona
elboton
R e g i s t r a rs e
por P r i m e r a V ez
note
que la comparacion de
cadenas
se
hace mediante
el
metodo equa l s , entonces
se instancia una pantalla de tipo
P a n t a l l a C r e a r R e g U s u a r i o ,
que explicaremos
en un
momento.
Si es un
O K ,
se
solicita
la
pantalla
P a n t a l l a S e r v i c i o ;
y si es
Sali
r,
simplemente
se
sale
del
programa. Antes
de definirnuestra
siguiente
pan-
talla, veamos que ocurre con la logica principal. Lallamada m a n e j a rE v e n t o fu e
hecha desde a c t i o n P e r f o r m e d
en la
clase I n t e r f a c e U s u a r i o . Extendamos este
metodo
con una
nueva version
de la
siguiente manera:
public
voidactionPerformed(ActionEvent event)
{
System.out.println( Action:
+event.getAct ionCommand()) ;
Pantalla
p = panta l la .mane jarEvento(event .ge tAct ionCommandQ);
desplegarPantal1a(p);
}
La
siguiente llamada
es d e s p l e g a r P a n t a lla y el ciclo se
completa.
E n
otras
pa-
labras volvimos al inicio de nuestra logica. Lapantalla P a n t a l l a C r e a r R e g U s u a -
rio se muestra en la f igura5.26.
igur 5 26 Ejemplodemarco desplegandoP antal laCrearRegUsua rio.
La figura
5.27
ilustra
las
clases principales, junto
con sus
atributos
ymetodos,
para
el
ejemplo
de las
pantallas mostrado aqui.
Es
importante
senalar que en
CAP. 5 P R O G R A M A C I O N
O R I E N T A D A
A OBJETOS CON
JAVA
-
7/25/2019 10. 5.6._Interfaces_Gr_ficas_del_Usuari.PDF
10/10
el diagrama se muestra la notacion de implementar para las interfaces
como
una herencia punteada a partir de clases abstractas.
igur 5 27 Diagrama
de
clases para
el
ejemplo
de las
pantallas
Como veremos en el siguiente capitulo, estas pantallas y logica nosservirapara
crear
el prototipo inicial del sistema de reservaciones de vuelos que utilizare-
mos a
lolargo
del
libro.
R S U N
De
manera introductoria,
en
este capitulo
se
presenta
la
programacion
en
Java,
de lacualse describen sus caracteristicas principales, asicomo
sus
esquemas de
procesamiento, compilacion
y
ejecucion
y sus
bibliotecas.
Se
muestra como pro-
gramar
en
ava los conceptos
de
modelado representados
en
UML descritos
en
el capitulo 4. Se dan ejemplos de despliegues graficosy acceso a base de datos
y
archives,
aspectos que
serviran
mas adelante durante el desarrollo de un sis-
tema
de software como caso practice.Se describen aspectos
avanzados
de la
programacion
en
Java como
es el
caso
de las
metaclases. Ademas
se
propor-
cionan multiples ejemplos a todo lo largo de el.
REFEREN ES
1.http://java.sun.com
2.
http://www.uml.org, Booch G. Rumbaugh J . Jacobson, I . 1998. The Unified Modeling
Language User Guide
Addison-Wesley.
R E F E R E N C I A S
