Documentos de Académico
Documentos de Profesional
Documentos de Cultura
Lo bsico ...
Las aplicaciones Java son programas (requieren de un main() ) que se ejecutan localmente usando el interprete de java Los applets Java se pueden ejecutar remotamente usando un navegador Web (Netscape, Explorer, etc.), incrustando una referencia al applet en una pgina Web utilizando una etiqueta HTML especial <applet>, el navegador baja el applet y lo ejecuta en el sistema local. Tambin puede utilizarse el appletviewer.
M.C. Yal Galicia Hdez. 2
Las aplicaciones y los applets tiene distinto conjunto de restricciones que sealan como pueden operar dentro de un contexto de seguridad (por ejemplo: El acceso al sistema de archivos, ejecucin de programas en el sistema local, etc.) Los applets no requieren el mtodo main(), ya que su ciclo de vida es diferente al de una aplicacin.
El JFC
p
Para disear aplicaciones que utilicen interfaces grficas (ventanas, etiquetas, cajas de texto, botones, barras de desplazamiento, etc.), java proporciona una biblioteca de clases denominada JFC (Java Foundation Classes) Bajo JFC se agrupan las APIs (Interfaces para programacin de aplicaciones)
n n n
Abstract Window Toolkit (AWT). Librerias bsicas n Se intent Write Once, Run Anywhere en multiplataformas. Pero terminaba en write once, debug everywhere. Pintar en una ventana =swing n Swing no remplaza a AWT, solo lo mejora en el look and feel, es decir, la apariencia en pantalla y funcionamiento, que van a tener los Componentes Swing de ese ejecutable. n El Look-and-Feel es la apariecia que se proporciona a los diferentes Componentes: botones, cajas de texto, cajas de seleccin, listas, etc
M.C. Yal Galicia Hdez. 5
AWT y Swing
6 6
Swing
Los componentes Swing son implementados completamente en el lenguaje Java. p La caractersticas look and feel permite crear GUIs que pueden ser vistas de igual forma en diferentes plataformas o asumir el look and feel de la plataforma del SO (como Microsoft Windows, Solaris or Linux).
p
M.C. Yal Galicia Hdez. 7
8 8
Aplicaciones grficas
Un vistazo
Aplicacin grfica
p p
Una aplicacin que muestra una interfaz grfica cuando se ejecuta, no es ms que un objeto de una clase derivada de Jframe. Los componentes ms comunes derivados de la clase JComponet son: (paquete javax.swing):
n n n n n n n n n
Etiquetas: JLabel Botones: JButton Cajas de texto de una lnea: JTextField Cajas de Texto de varias lneas: JTextArea Casilla de verificacin: JCheckBox Botones de opcin: JRadioButton Listas: JList Barras de desplazamiento: JScrollBar Cuadros de dialogo estndar: JOptionPane
M.C. Yal Galicia Hdez.
10
Contenedores
p p
Los contenedores son componentes Swing utilizados para ubicar otros componentes: Ejemplo de contenedores n Contenedores de nivel superios:
Jframe (Marcos), JDialog (Cuadros de Dialogo) y JApplet (Applet) p Cada uno de estos contenedores define un componente llamado panel, que a su vez puede contener otros paneles, creando una jerarqua de paneles. p La clase para crear paneles es JPanel.
p
M.C. Yal Galicia Hdez. 11
Algunos de los mtodos ms importantes n setTitle: Sirve para cambiar el texto que aparece en la barra de ttulo n setResizable: Admite un boolean (true o false) y determina si el usuario va a poder o no cambiar el tamao del marco n setVisible: Recibe como parmetro un valor boolean, si es true muestra el Frame n setDefaultCloseOperation: Establece la operacin que se ejecutar por default cuando el usuario cierre el frame. Si recibe como parmetro marco.EXIT_ON_CLOSE cerrar el marco antes de terminar. n setIconImage: Admite un objeto de tipo Image y lo utiliza como icono cuando se minimiza o iconiza la ventana M.C. Yal Galicia Hdez. 12
Jerarqua de herencia
Object Compone nt Container JComponen t JPanel
13
Componentes
14 14
Cuando se disea un Frame, se van aadiendo componentes a la lmina de contenido (panel de contenido), empleando un cdigo similar al siguiente: Container panelRaiz = marco.getContentPane(); Component c = ; panelRaiz.add(c); A partir del JDK 5.0, el panel de contenido es implcito y podemos utilizar simplemente: Component c = ; add(c);
M.C. Yal Galicia Hdez. 15
Cmo se distribuyen los componentes dentro de un contenedor?. Todos los contenedores en java tienen en su interior una clase, de nombre genrico "layout", que es la encargada de organizar los componentes dentro del contenedor. Por ejemplo, el administrador FlowLayout se encarga de hacer que los botones se organicen en una lnea (o diferentes hileras). El GridLayout los coloca en forma de matriz, etc. Cuando el usuario modifica el tamao del contenedor, el administrador de disposiciones reorganiza automticamente los componentes para ocupar el espacio disponible.
M.C. Yal Galicia Hdez. 16
Administradores de distribucin
n
Swing proporciona 5 administradores de distribuciones o disposiciones p FlowLayout (default para JPanel) p BorderLayout (default para JFrame) p GridLayout p CardLayout p GridBagLayout Para establer un administrador de distribucin especfico para un contenedor dado, se debe crear una instancia del administrador de distribucin pasado como parmetro al mtodo setLayout(), para ese contenedor. Public MiFrame( ) { setLayout(new FlowLayout()); . M.C. Yal Galicia Hdez. 17 }
Administradores (Layouts)
Distribucin FlowLayout BorderLayout GridLayout BoxLayout GridBagLayout Descripcin Es la predeterminada para Jpanel. Coloca los componentes secuencialmente (de izquierda a Es el predeterminado que se agregaron derecha) en el orden para paneles de contenido de objetos JFrame. Ordena los componentes en 5 OrdenaNORTH, SOUTH, EAST, WEST Y CENTER reas: los componentes en filas y columnas Ordena los componentes en forma horizontal a lo largo del eje x, o en forma vertical a lo largo del Es el ms poderoso y complejo. Es similar al eje y. GridLayout solo que ms flexible. Los componentes pueden variar de tamao (pueden ocupar varias filas y columnas) y pueden agregarse en cuaquier orden
18
Administradores de distribucin...
n
Despus de que el administrador de distribucin est definido, se puede empezar a agregar componentes
p
El orden de agregacin es significativo y depende del administrador de diseo que este activo Leer la informacin para cada administrador Esta clase es la ms simple de los diseos y es la distribucin por default para el JPanel Los componentes son agregados al panel uno por uno, de izquierda a derecha, fila por fila (si un componente no cabe en una fila se pasa a la siguiente) Cuenta con Yal Galicia Hdez. M.C. una alineacin (el valor por default 19 es fila centrada)
Administradores de distribucin...
n
Para crear distribuciones con una alineacin diferentes se deben agregar las variables de clase como argumento:
p p
FlowLayout.RIGHT FlowLayout.LEFT
Para agregar espacios horizontales o verticales entre componentes se debe agregar argumentos enteros al constructor de diseo.
setLayout(new FlowLayout(FlowLayout.LEFT, 30, 10)); p EL ejemplo agrega espacios de hasta 30 puntos horizontales y 10 verticales
M.C. Yal Galicia Hdez. 20
Si en lugar de especificar una instancia de alguna distribucin, establecemos Null, entonces nosotros podemos colocar el componente en un lugar deseado y especfico con un posicin X, Y en un plano cartesiano Ejemplo: miPanel.setLayout(null) A partir de ah, para cada componente se debe especificar su posicin y M.C. Yal Galicia Hdez. tamao
0,0 Y
21 21
Eventos
Manejo de eventos
22
Eventos
p
Un evento es generado en respuesta a cualquier cosa que pueda ocurrir durante el ciclo de vida de un applet o una aplicacin
n n n
p p
Mientras el programa se ejecuta una gran cantidad de eventos se estn generando Es comn querer interceptar algunos eventos en los cuales se esta interesado, por ejemplo cuando el usuario da clic en algn lugar especfico dentro del applet, para responder de alguna forma
M.C. Yal Galicia Hdez. 23
Movimientos del mouse Cada clic o presin de alguna tecla Cada acceso a ventanas
Eventos ...
p
Clics del ratn: ratn abajo (botn aprimido), ratn arriba (soltar el botn) o clic simple Movimientos del ratn: posicin y arrastres del ratn Pulsaciones de teclas: oprimir una tecla, soltar una tecla, pusaciones sencillas Eventos de interaccin del usuario: clics en botones, mover barras de dezplazamiento, abrir mens, etc. Eventos de ventanas: abrir, cerrar o salir de ventanas.
M.C. Yal Galicia Hdez. 24
Manejo de eventos
p p
Para el manejo de eventos Java debe contar con una interfaz listener (oyente) . El oyente representa cierto conjunto de eventos (un oyente para el ratn, otro para teclas, etc.) y es el responsable de hacer algo como respuesta a ese evento especfico. El receptor del evento y el oyente estn unidos por medio del registro del oyente.
n
26
Escuchas y eventos
27 27
ActionEve nt AdjustmentEven t ItemEvent TextEvent ComponentEve nt ContainerEvent FocusEve nt PaintEven t WindowEvent InputEven t MouseEve nt MouseWheelEvent
M.C. Yal Galicia Hdez.
KeyEvent
28
28
Interfaz EventListener
Interfaz ActionListener Interfaz AdustmentListen er Interfaz ContainerListene r interfaz FocusListener Interfaz ItemListener Interfaz KeyListener Interfaz MouseListener
Interfaz MouseMotionListe ner
Interfaz TextListener
29 29
Primero entonces veamos algunas interfaces oyentes y los eventos del ratn y teclado relacionados
n
Eventos: ratn abajo, ratn arriba, ratn entra, ratn sale, clics del ratn Definicin de los mtodos Public void mousePressed(MouseEvent e) Public void mousereleased(MouseEvent e) Public void mouseEntered(MouseEvent e) Public Galicia Hdez. M.C. Yal void mouseExited(MouseEvent30 e) Public void mouseClicked(MouseEvent
Interfaz de oyente: MouseMotionListener p Eventos: movimiento del ratn, arrastre del ratn p Definicin de los mtodos: Public void mouseMoved(MouseMotionEvent e) Public void mouseDragged(MouseMotionEvent e) Interfaz del oyente: KeyListener p Eventos: tecla abajo, tecla arriba, pulsacin sencilla p Definicin de los mtodos: Public void keyReleased(KeyEvent e) M.C. Yal Galicia keyPressed(KeyEvent e) 31 Public void Hdez. Public void keyTyped(KeyEvent e)
Despus de conocer algunos oyentes y seleccionar cuales manipularn nuestros eventos, procedemos a crear el applet que ser su propio oyente
n
Para crear un applet que sea tambin un oyente, se debe modificar para que implemente la interfaz de oyente apropiada, siguiendo estos pasos: p Importar java.awt.event.* p Agregar la palabra implements a la definicin de la clase seguida de la interfaz de oyente en la que estamos interesados p Sopreponer (o invalidar) los mtodos de la interfaz p Agregar el cdigo adecuado al mtodo apropiado
M.C. Yal Galicia Hdez. 32
Un ejemplo que usa las interfaces MouseListener y KeyListener import java.awt.event.*; import java.applet.*; public class MiApplet extends Applet implements MouseListener, KeyListener { Public void mousePressed(MouseEvent e) { } Public void mouseReleased(MouseEvent e ) { } Public void mouseEntered(MouseEvent e) { } Public void mouseExited(MouseEvent e) { } Public void mouseClicked(MouseEvent e){ } } El ltimo paso es registrar el oyente con el objeto que recibir el mtodo, para que queden encadenados
M.C. Yal Galicia Hdez. 33
n n
Estos mtodos son definidos en la clase Component (superclase de Applet) Para cada tipo de oyente hay un mtodo de registro Para los tres tipos de oyentes que comentamos sus mtodos son: p addMouseListener(this) p addMouseMotionListener(this) p addKeyListener(this)
El registro del oyente se realiza por lo general en el mtodo init() del applet
M.C. Yal Galicia Hdez. 34
Ejemplo eventos
import java.awt.*; import java.applet.*; import java.awt.event.*;
public class DibujosEventos extends Applet implements MouseListener, MouseMotionListener { private int x,y;
public void init(){ //registro de oyentes de evento addMouseListener(this); addMouseMotionListener(this); } public void paint(Graphics g) { }
M.C. Yal Galicia Hdez. 35
Ejemplo ...
//sobreposicin de mtodos abstractos public void mouseMoved(MouseEvent e) { } public void mouseClicked(MouseEvent e) { } public void mouseEntered(MouseEvent e) { } public void mouseExited(MouseEvent e) { } public void mouseReleased(MouseEvent e) { }
//escribimos cdigo para los eventos que nos interesan public void mousePressed(MouseEvent e) { this.x = e.getX(); this.y = e.getY(); }
36
Ejemplo ...
public void mouseDragged(MouseEvent e) { Graphics g = getGraphics(); //Dibuja una lnea del ltimo punto al actual g.drawLine(this.x, this.y, e.getX(), e.getY()); this.x = e.getX(); this.y = e.getY(); }
} // fin de la clase
37
38
Ms sobre Eventos
p
Como ya hemos visto, toda clase que implementa una interfaz de oyente debe implementar todos sus mtodos.
n
Por ejemplo la interfaz WindowListener que tiene 7 mtodos, debe implementar esos 7 mtodos.
Para simplificar esta tarea, todas las interfaces de oyente de AWT que tienen ms de un mtodo, cuentan con una clase adaptadora asociada que implementa todos los mtodos de la interfaz, pero no hace nada con ellos.
39
Interfaces y adaptadores
Oyentes ActionListener AdjustmenListener
Adaptadores
FocusAdapter
WindowAdapter
40
Ejemplo
addMouseListener(new MouseAdapter(){ public void mouseClicked(MouseEvent e2){ label.setText(e2.getX()+,"+e2.getY()); } }); que usando el adaptador MouseAdapter ya no tengo que sobreponer tod
41
Cuadros de dilogo
Una forma simple de leer datos
42
Cuadros de dilogo
p
Podemos leer valores directamente del teclado (consola) usando la clase Scanner que provee Java, o bien a travs de cajas de texto; sin embargo, una forma muy til es usando las clases predefinidas por Java para cuadros de dilogo. Los cuadros de dilogo son ventanas que por lo general se utilizan para desplegar mensajes importantes para el usuario de una aplicacin. Java 2 incluye la clase JOptionPane que permite desplegar fcilmente un cuadro de dilogo que contiene informacin y donde tambin se puede introducir valores. Los mtodos ms importantes de JOptionPane son: p showMessageDialog - Para despliegue de mensajes p showInputDialog - para lectura de valores
43
Ejemplo en consola
public class Suma { public static void main(String args[] ) { String s1, s2; //para almacenar lo ledo int n1, n2, suma; //nmeros convertidos //Lee datos como cadenas s1 = JOptionPane.showInputDialog( Introduce primer dato ); s2 = JOptionPane.showInputDialog( Introduce segundo dato ); //convierte a valores enteros 1er. Parmetro: usualmente Null n1 = Integer.parseInt(s1); 2do. Parmetro: mensaje n2 = Integer.parseInt(s2); //Suma los nmeros suma = n1 + n2; //despliega resultados JOptionPane.showMessageDialog( null, La suma es + suma, Resultado, JOptionPane.PLAIN_MESSAGE); System.exit( 0 ); //termina programa } //fin main 3er. Parmetro: ttulo de la ventana } //fin clase Suma 4to. Parmetro: Tipo de mensaje
44
Salida
45
JOptionPane.WARNING_MESSAGE
JOptionPane.QUESTION_MESSAGE
JOptionPane.PLAIN_MESSAGE
46
47
El AWT
p
El AWT (Abstrac Windowing Toolkit) fue creado para proporcionar soporte grfico a los applets (como ya vimos); y proveer un conjunto de clases y mtodos que permiten crear aplicaciones GUI (Graphical User Interface). El AWT proporciona:
n
Un conjunto completo de componentes de interfaz de usuario (UI) y otros componentes, incluyendo ventanas, mens, botones, casillas de verificacin, cajas de texto, barras de desplazamiento y listas. Soporte a contenedores de UI, los cuales pueden contener otros contenedores de UI.
M.C. Yal Galicia Hdez. 48
El AWT ...
n n
Un sistema de eventos para administrar sistemas y eventos del usuario como partes del AWT. Mecanismos para emplear componentes que permitan el diseo del UI independientemente de la plataforma.
La idea bsica detrs del AWT, es que un programa Java grfico, es un conjunto de componentes anidados, iniciando por una ventana exterior y profundizando hasta el ms pequeo componente UI.
n
Los componentes pueden incluir elementos visibles en la pantalla, como: mens, botones, etc. M.C. Yal Galicia Hdez. Y tambin puede incluir contenedores (containers) 49
El AWT ...
p
El anidamiento de componentes dentro de contenedores crea una jerarqua de componentes, desde el botn ms interno de un applet hasta la ventana general de la pantalla.
n
La jerarqua de componentes determina la distribucin de elementos en la pantalla, el orden en que se dibujan y la manera como los eventos se mueven. Contenedores
p
Su forma ms comn es el Panel, el cual representa un contenedor que podra desplegarse en la pantalla. Otro contenedor es la ventana (Window), la cual M.C. Yal Galicia 50 permite crear unHdez. marco estndar (Frame) para las aplicaciones.
El AWT ...
n
Lienzos
p
Es una superficie simple de dibujo. Aunque puede dibujarse en los paneles (como lo hemos hecho hasta ahora), los lienzos son ms adecuados para imgenes y operaciones grficas. Incluyen botones, listas, mens, casillas de verificacin, campos de texto, etc. Incluyen ventanas, cuadros, barras de mens y cuadros de dilogo. Estos componentes se usan en aplicaciones y no en applets (el navegador porporciona la ventana principal)
51
Componentes UI
p
Las clases dentro del paquete java.awt estn M.C. Yal Galicia Hdez. escritas y organizadas para reflejar esta
El AWT ...
n
Canvas
Container
TextComponent
Button
Panel
TextField
Applet
52
El AWT ...
p
El AWT tambin incluye un conjunto de administradores de diseo que determinan como se distribuyen los diferentes componentes cuando se despliegan en la pantalla y la proporcin entre los distintos tamaos de cada uno.
n
Los administradores de diseo ayudan a crear diseos de UI que son dinmicamente distribuidos.
53
Componentes bsicos de UI
p
A continuacin veremos lo bsico para crear y usar etiquetas, casillas de verificacin, botones de opcin, mens de opcin y campos de texto.
n
Crearlo Aadirlo al applet o al panel que lo contendr, en el punto en que debe ser desplegado en la pantalla.
54
Botones: Button Casillas de verificacin: Checkbox Caja de texto: TextArea Etiquetas: Label Lista: List Mens de opcin: Choice Sliders y scrolls bar: Scrollbar Mens: Menu, MenuItem, Checkbox.MenuItem Campos de texto: TextField
M.C. Yal Galicia Hdez. 55
getLabel: Devuelve una cadena que contiene la etiqueta del componente setLabel: cambia el texto de la etiqueta del componente
getState: Devuelve true o false, dependiendo de el componete esta seleccionado o no SetState (boolena): cambia el estado del componente
M.C. Yal Galicia Hdez. 56
Ejemplo de botones
p
Cdigo para crear algunos botones sencillos import java.awt.*; import java. Applet.*; public class ButtonTest extends Applet { public void init( ) { add(new Button(Regresar)); add(new Button(Ejecutar)); add(new Button(Adelantar)); add(new Button(Detener)); } }
57
Applet botones
58
Los mens de opcin descendentes (Pop-up menus), son listas de elementos de los cuales puede seleccionar un elemento. Al hacer su seleccin, el men despliega esa opcin en la pantalla.
public class ChoiceTest extends Applet { public void init( ) { Choice c = new Choice( ); c.add(Alta); c.add(Baja); c.add(Modificacin); add( c ); } }
M.C. Yal Galicia Hdez. 59
60
Cmo se distribuyen los botones dentro de la ventana?. Todos los contenedores en java tienen en su interior una clase, de nombre genrico "layout", que es la encargada de distribuir los botones dentro del contenedor. Por ejemplo, la clase FlowLayout se encarga de hacer que los botones vayan todos seguidos de izquierda a derecha, como sera el caso de tu barra de herramientas del navegador. El GridLayout los coloca en forma de matriz, etc, etc. Hdez. M.C. Yal Galicia 61
Administradores de distribucin
n
El AWT proporciona 5 administradores de distribuciones p FlowLayout p GridLayout p BorderLayout p CardLayout p GridBagLayout Para crear un administrador de distribucin para un panel dado, crea una instancia del administrador de diseo y despus utiliza el mtodo setLayout(), para ese panel.
Public void init ( ) { setLayout ( new FlowLayout ); de agregar componentes M.C. Yal Galicia Hdez. }
// poner antes
62
Administradores de distribucin...
n
Despus de que el administrador de distribucin est definido, se puede empezar a agregar componentes
p
El orden de agregacin es significativo y depende del administrador de diseo que este activo Leer la informacin para cada administrador Esta clase es la ms simple de los diseos y es la distribucin por default para el panel Los componentes son agregados al panel uno por uno, de izquierda a derecha, fila por fila (si un componente no cabe en una fila se pasa a la siguiente) Cuenta con Yal Galicia Hdez. M.C. una alineacin (el valor por default 63 es fila centrada)
Administradores de distribucin...
n
Para crear distribuciones con una alineacin diferentes se deben agregar las variables de clase como argumento:
p p
FlowLayout.RIGHT FlowLayout.LEFT
Para agregar espacios horizontales o verticales entre componentes se debe agregar argumentos enteros al constructor de diseo.
setLayout(new FlowLayout(FlowLayout.LEFT, 30, 10)); p EL ejemplo agrega espacios de hasta 30 puntos horizontales y 10 verticales
M.C. Yal Galicia Hdez. 64
Ejemplo de FlowLayout
65
Administradores de distribucin...
p
n n
Proporciona ms control sobre la colocacin de los componentes en el panel Divide el rea de desplegado de panel en filas y columnas, que es necesario especificar. Cada componente que agrege al panel es colocado en una celda de la cuadrcula, iniciando desde la celda superior izquierda y avanzando de izquierda a derecha. Ejemplo: setLayout(new GridLayout(3,2)); Para agregar espacios:
p
66
Ejemplo GridLayout
67
Administradores de distribucin...
p
La clase BorderLayout n Los componentes se agregan indicando su posicin como una direccin geogrfica (North, South, West y East, Center). n Los componentes alrededor de los lmites son cololados con ms espacio del que necesitan.El componente en el centro (si es que lo hay) ocupa el espacio de sobra. n El diseo de bordes se crea: p setLayout(new BorderLayout(10, 10)); //agrega espacios entre // componentes p Los componentes individuales se agregan con el mtodo add( ), que en este caso tiene dos argumentos: Add(North,Hdez. M.C. Yal Galicia new Buuton(Regresar, 68 50));
Ejemplo BorderLayout
69
Administradores de distribucin...
n
La clase GridBagLayout (distribucin de cuadrcula global) nEste diseo le permite controlar el espacio de cada celda individual en la cuadrcula, las proporciones entre filas y columnas y la colocacin de los componentes dentro de cada celda de la cuadrcula. nPara lograr este diseo, en realidad, se requieren dos clases: nGridBagLayout: Habilita la administracin del diseo en general nGridBagConstraints: Define las propiedades de cada componente en la M.C. Yal Galicia 70 cuadrcula Hdez. nColocacin, Dimensin,
Administradores de distribuciones...
n n
La relacin entre la cuadrcula global, las propiedades y cada componente, definen el diseo en conjunto. En general, la distribucin involucra:
p
Creacin de un objeto GridBagLayout y su definicin como administrador actual de diseo Creacin de una nueva instancia de GridBagConstraints.
Definir las restricciones y propiedades de los componentes Button b = new Button(Adelante); constraints.gridx = 0; //Coord. X celda del componente constraints.gridy = 0; //Coord. Y celda del componenteM.C. Yal Galicia Hdez.
p
71
Administradores de distribucin...
constraints.gridWidth = 1; // columnas que ocupa el componente constraints.gridHeight = 1; //renglones que ocupa el componente constraints.weightx =30; //Porcentaje del tamao total del ancho constraints.weighty =30; //Porcentaje del tamao total del largo constraints.fill = GridBagConstraints.NONE; constraints.fill = GridBagConstraints.CENTER; p Informar al administrador de diseo sobre los componentes y sus restricciones
p
La parte ms tediosa es el proceso de definir restricciones para los componentes, ya que se debe hacer para cada M.C. Yal Galicia Hdez. 72 componente.
p
Ejemplo de cuadrcula
0,0 Nombre: 20% 1,0 Contrase 20% 2,0 20% a: Ok 2,1 90% 0,1 1,1
10%
73
El cdigo
import java.awt.*; import java.applet.*;
public class EjemplosUI extends Applet { void Construye(GridBagConstraints gbc,int gx,int gy,int gw,int gh,int wx,int wy) { gbc.gridx = gx; gbc.gridx = gy; gbc.gridwidth = gw; gbc.gridheight = gh; gbc.weightx = wx; gbc.weighty = wy; }
74
El cdigo ...
public void init() { GridBagLayout gb = new GridBagLayout(); GridBagConstraints c = new GridBagConstraints(); setLayout(gb); //Etiqueta para el nombre Construye(c, 0, 0, 1, 1, 10, 40); //ocupa el 10% del ancho y 40 de largo c.fill = GridBagConstraints.NONE; c.anchor = GridBagConstraints.EAST; Label etiq1 = new Label("Nombre:", Label.LEFT); gb.setConstraints(etiq1, c); add(etiq1);
M.C. Yal Galicia Hdez. 75
El cdigo ...
//Campo Texto para escribir el nombre Construye(c, 0,1, 1, 1, 90, 0); // 90% de ancho y largo de arriba c.fill = GridBagConstraints.HORIZONTAL; TextField txtNombre = new TextField(); gb.setConstraints(txtNombre, c); add(txtNombre); //Etiqueta para la contrasea Construye(c, 1, 0, 1, 1, 0, 40);//ya no hace falta definir ancho, 40%
largo
c.fill = GridBagConstraints.NONE; c.anchor = GridBagConstraints.EAST; Label etiq2 = new Label("Contrasea:", Label.LEFT); gb.setConstraints(etiq2, c); add(etiq2);
M.C. Yal Galicia Hdez. 76
El cdigo ...
//Campo Texto para escribir la contrasea Construye(c, 1, 1, 1, 1, 0, 0); c.fill = GridBagConstraints.HORIZONTAL; TextField txtPass= new TextField(); gb.setConstraints(txtPass, c); add(txtPass); //Botn OK Construye(c, 2,0, 2, 1 ,0, 20); //solo hace fakta definir largo c.fill = GridBagConstraints.NONE; c.anchor = GridBagConstraints.CENTER; Button bok= new Button("Ok"); gb.setConstraints(bok, c); add(bok); } }
77
Ejemplo GridBagLayout
78
Eventos UI
n
Hasta ahora nuestro applet es torpe, puesto que ninguno de nuestros componentes UI pueden hacer algo al ser presionados o teclear informacin. Para lograr que hagan algo, se debe agregar cdigo para manipilar eventos
p
Al igual que para los eventos de teclado y ratn que vimos antes
por ejemplo, los botones utilizan eventos de accin que son disparados cuando se oprimen.
No se tiene uno que preocupar por los eventos de ratn abajo o arriba. El componente lo maneja todo.
M.C. Yal Galicia Hdez. 79
Eventos UI ...
Cada clase de evento tiene una interfaz auditora correspondiente con un conjunto de mtodos a implementar p A continuacin se muestran los eventos, las clases auditoras de eventos que los manejan y los mtodos que los tratan
p
n
Evento: Accin
p p
Eventos UI ...
n
81
Eventos UI ...
n
82
Eventos UI ...
p
Como antes, el mtodo init( ) es el mejor lugar para poner estos mtodos Los auditores de componente se tienen que registrar con cada componente especfico que recibir ese evento.
M.C. Yal Galicia Hdez. 83
Eventos UI ...
n
Public void init( ) { Button Okb = new Button(Ok); OKButtonAction ok = new OKButtonAction(); OKButton.addActionListener(ok); //Botn OK Button Cancelb = new Button(Ok); OKButtonAction cancel = new OKButtonAction(); Cancelb.addActionListener(cancel); //botn cancel add(Okb); add(Cancelb); }
M.C. Yal Galicia Hdez. 84
Ejemplo de eventos
import java.awt.*; import java.applet.*;
public class TestEventos extends Applet { Button rojo, verde, azul, blanco, negro;
public void init() { setBackground(Color.white); setLayout(new FlowLayout(FlowLayout.CENTER, 10, 10)); ManejadorBoton mb; rojo = new Button("Rojo"); mb = new ManejadorBoton(this, Color.red); rojo.addActionListener(mb); add(rojo); azul = new Button("Azul"); mb = new ManejadorBoton(this, Color.blue);
M.C. Yal Galicia Hdez.
85
azul.addActionListener(mb); add(azul); verde= new Button("Verde"); mb = new ManejadorBoton(this, Color.green); verde.addActionListener(mb); add(verde); blanco= new Button("Blanco"); mb = new ManejadorBoton(this, Color.white); blanco.addActionListener(mb); add(blanco); negro= new Button("negro"); mb = new ManejadorBoton(this, Color.black); negro.addActionListener(mb); add(negro);
86
88
Applets
Introduccin
89
Creacin de applets
p
Todos los applets heredan de la clase JApplet, que es parte del paquete java.applet. n Para crear un applet se debe crear una subclase de la clase JApplet. n La clase JApplet proporciona el comportamiento que el applet necesita para funcionar dentro de un navegador compatible con Java. n En un applet se puede
p p
dibujar en la pantalla crear ventanas, barras de mens, botones, casillas de verificacin, etc. Entradas del usuario como clics del ratn o pulsacionesGalicia Hdez. M.C. Yal del teclado
90
La clase del applet principal, la que dispara su ejecucin, siempre tendr la forma:
public class EjemploApplet extends Applet { public void init() { } public void paint(Graphics g) { g.drawString(Hola Mundo!!", 50, 60 ); } }
Los applets tiene 5 mtodos principales, los cuales son utilizados para ejecutar las actividades bsicas que realizan durante su ciclo de vida:
n
Inicializacin (mtodo init()): Ocurre cuando se carga o recarga un applet por primera vez (es similar al mtodo main( ) en las aplicaciones). Este proceso puede incluir:
p p p
Lectura y asignacin de algn parmetro al applet Creacin de cualquier objeto auxiliar Configuracin de un estado inicial o carga de M.C. 92 imgenes Yal tipos de letra. y Galicia Hdez.
Para proporcionar algn comportamiento de inicializacin al applet se debe sobreponer el mtodo init( ) en su clase applet .... }
Inicio o Arranque: El inicio es diferente de la inicializacin porque puede realizarse varias veces durante el ciclo de vida de un applet, mientras que la inicializacin sucede una sola vez.
p
public void
93
Detencin: La detencin ocurre cuando el usuario abandona la pgina que contiene un applet en ejecucin. Se puede detener, tambin llamando al mtodo stop( ). p Si se sobrepone el mtodo stop(), puede detener la ejecucin de los subprocesos (hilos) y volverlos a arrancar si el applet se visualiza nuevamente
public void
stop ( ) {
....
Destruccin: La destruccin habilita al applet a terminar correctamente antes de que sea liberado p Detener y eliminar subprocesos en ejecucin p Cerrar cualquier conexin abierta, etc.
M.C. Yal Galicia Hdez. 94
Este mtodo no es necesario sobreponer a menos que se tenga algo especfico que liberar destroy ( ) { .... }
public void
Dibujar: Es la forma en que el applet genera algo en la pantalla, ya sea texto, una lnea, un fondo a color o una imagen. Este mtodo puede usarse todas las veces que se quiera durante el ciclo de vida del applet. p El mtodo paint() tiene esta apariencia
public void paint ( Graphics g ) { se debe importar java . awt . Graphics ; .... } M.C. Yal Galicia Hdez.
//
95
Applet sencillo
import java.awt.*; //Graphics, Font, Color import java.applet.*;
public class HelloAgainApplet extends Applet { private Font f; public void init( ) { f = new Font("Arial", Font.BOLD, 36); } //Aqui es donde se hace el trabajo del applet public void paint(Graphics g) { g.setFont(f); g.setColor(Color.red); g.drawString("Hola otra vez!!", 15, 40 ); } }
96
Y ahora?
p
El siguiente paso, despus de compilar nuestra clase normalmente como cualquier otro programa en Java es crear una pgina Web que contenga el applet utilizando lenguaje HTML.
n
Para incluir un applet en una pgina Web se utiliza la etiqueta <APPLET>, la cual carga y ejecuta el applet indicado. A continuacin se muestra un ejemplo de una pgina HTML sencilla con el applet incluido.
97
98
Ejecutando ...
p
Para probar el resultado, abrir el archivo HTML (HelloAgainApplet.html) con algn navegador o con el appletviewer.
99
La clase Graphics
p
Esta clase provee mtodos que permiten dibujar lneas, figuras, caracteres e imgenes en la pantalla dentro de un applet.
n
n n
No se tiene que crear una instancia de esta clase para dibujar algo, esto se hace automticamente al invocar el mtodo paint( ). La clase Graphics es parte del paquete java.awt. Para dibujar un objeto en la pantalla, se debe llamar a alguno de los mtodos disponibles en la clase Graphics
p
Todos los mtodos tiene argumentos que representan puntos finales, esquinas o ubicacin inicial del objeto como valores en el sistema de coordenadas M.C. 100 del applet.Yal Galicia Hdez.
Sistema de coordenadas
n
n n
El sistema de coordenadas en java tiene el origen (0,0) en la esquina superior izquierda Los valores positivos de x estn a derecha Los valores positivos de y estn hacia abajo +x 0,0 Todos los valores de pixeles son positivos
+y
M.C. Yal Galicia Hdez. 101
La clase Graphics proporciona un conjunto de grficos sencillos integrados para dibujo que incluye:
n n n
Lneas: drawLine(xini, yini, xfin, yfin) Rectngulos simples: drawRect(x,y, ancho, largo) y fillRect(x,y, ancho, largo) Rectngulos con esquinas redondeadas: drawRoundRect(x,y,ancho,largo, ancho_esquina, largo_esquina) y fillRoundRect(x,y,ancho,largo, ancho_esquina, largo_esquina) Polgonos (conjunto de lneas rectas que van del primer punto, al segundo, del segundo al tercero, ect.
M.C. Yal Galicia Hdez. 102
Ejemplo: public void paint(Graphics g) { int xs[] = {39, 94, 97, 142, 53, 58, 26}; int ys[] = {33, 74, 36, 70, 108, 80, 106}; int pts = xs.length; Polygon poly = new Polygon(xs, ys, pts); g.drawPolygon(poly); }
n n
Ejemplo de grfico
import java.awt.*; import java.applet.*; public class Lampara extends Applet { public void paint(Graphics g){ g.fillRect(1,250, 290, 290); //Plataforma de la lmpara g.drawLine(125, 250, 125, 160); //La base de la lmpara g.drawLine(175, 250, 175, 160); g.drawArc(85, 157, 130, 50, -65, 312); //Cubierta lmpara g.drawArc(85, 87, 130, 50, 62, 58); g.drawLine(85, 177, 119, 89); //Lados de la cubierta g.drawLine(215, 177, 181, 89); g.fillArc(78, 120, 40, 40, 63, -174); //manchas g.fillOval(120, 96, 40, 40); g.fillArc(173, 100, 40, 40, 110, 180); M.C. Yal Galicia Hdez. 104 } }
105
Ms de Graphics
p
copyArea(x_org,y_org, ancho, largo, x_dest, y_dest) clearRect(x,y, ancho, largo) G.clearRect(0, 0, size().width, size().heigth);
M.C. Yal Galicia Hdez. 106
Objetos Font
p
Para dibujar texto en la pantalla, primero debemos crear una instancia de la clase Font con los siguientes parmetros:
n n n n
Fuente: TimesRoman, Courier, Helvetica, etc. Estilo de fuente: Font.PLAIN, Font.BOLD, Font.ITALIC Tamao
107
Objetos Color
p p
Para dibujar un objeto en un color particular se debe crear una instancia de la clase Color para representarlo. Los colores estndar son: n Color.white n Color.black n Color.lightGray n Color.gray n Color.darkGray n Color.red n Color.green n Color.blue n Color.yellow n Color.magenta n Color.cyan n Color.pink n Color.orange
M.C. Yal Galicia Hdez. 108
Color ...
p
Para crear un color particular, hay que utilizar la combinacin RGB de colores primarios (Red, Green, Blue) en distintas intensidades que van del 0 al 255. n Formato: Color c = new Color(rojo, verde, azul) n Ejem: Color c = new color(0, 195, 210); Para establecer el color de un objeto se utiliza el mtodo setColor( ) n g.setColor(Color.green); Para establecer el color de fondo del applet n setBackground(new Color (0, 140, 150)); //RGB n setBackground(Color.lightGray);
109
Un ejemplo de colores
import java.awt.*; import java.applet.*; public class Colores extends Applet { public void paint(Graphics g){ int rval, gval, bval; for(int j=30; j < (size().height -25); j+= 30) for (int i=5; i < (size().width -25); i += 30) { rval = (int) Math.floor(Math.random() * 256); gval = (int) Math.floor(Math.random() * 256); bval = (int) Math.floor(Math.random() * 256); g.setColor(new Color(rval, gval, bval)); g.fillRect(i,j, 25, 25); g.setColor(Color.black); g.drawRect(i-1, j-1, 25, 25); } } }
110
Ejemplo Colores
111
Ms sobre applets
Lo bsico en animacin e hilos ...
112
Animacin
p
La animacin esta relacionada con ttulos bailando o cambiando de colores, figuras girando o en movimiento y otros efectos.
n
Estos tipos de animacin requieren solo unos cuantos mtodos para implementarse en Java, pero son la base para cualquier applet Java que actualice la pantalla dinmicamente (animaciones, cambios de datos en tablas, etc.)
La animacin en Java se logra al incluir clases, interfaces y sobreponer algunos mtodos del AWT.
113
Creando animaciones
p
La construccin de un cuadro de animacin (consiste en definir variables para que las use paint() y crear los objetos que necesitar.) Pedirle a Java que lo dibuje (invocar al mtodo repaint(), que es un disparador que hace que Java llame a paint() y el cuadro se dibuje)
Si se realizan de forma repetida y con velocidad suficiente, se lograr el efecto de animacin dentro del applet
M.C. Yal Galicia Hdez. 114
Esto no se hace en el mtodo paint() que simplemente pone puntos en la pantalla. Paint() es responsable slo del cuadro actual de la animacin El trabajo de modificar el cuadro para una animacin se debe realizar en otro lugar de la definicin de nuestro applet.
Para los Applets Java de animacin y de otro tipo que en realidad se ejecutan, se necesitar hacer uso de start() y de stop() para iniciar la ejecucin y detenerla.
M.C. Yal Galicia Hdez. 115
Se puede hacer que todo el trabajo del applet se realice dentro de ese mtodo O se puede llamar a mtodos de otros objetos para hacerlo.
Por lo general start() se utiliza para crear e iniciar la ejecucin de un subproceso de forma que el applet pueda ejecutarse en su propio tiempo. Stop() suspende la ejecucin del applet
M.C. Yal Galicia Hdez. 116
Un subproceso ?
p
Los subprocesos son un elemento importante para lograr la combinacin de la animacin. Un subproceso, hilo, hebra o thread (como gustes llamarle ;-)) es un flujo simple de control secuencial dentro de un proceso.
n
Cada hilo tiene una ruta de ejecucin separada, con su propio inicio, flujo de programa, punto de ejecucin actual y terminacin. Los subprocesos permiten a un programa ejecutar varias tareas concurrentemente (al mismo tiempo).
M.C. Yal Galicia Hdez. 117
Subprocesos ...
p
En general, cualquier cosa que realices en un programa Java que se ejecute continuamente y ocupe mucho tiempo de procesamiento, debe ejecutarse en su propio subproceso.
n
Para lograr la animacin, podemos utilizar el mtodo start() para iniciar un subproceso, y despus redefinir el mtodo run() del subproceso, para hacer todo el procedimiento de animacin.
118
Crear applets con subprocesos es relativamente fcil. Adems, el cdigo que se usa, puede reusarse en otros applets la mayora de las veces. Hay 5 modificaciones que se necesitan hacer para crear un applet que utilice subprocesos.
1.
Crear una variable de instancia de la clase Thead (incluida en java.lang), para almacenar el subproceso de este applet.
p
Thead runner;
4.
Redefinir el mtodo start() que no haga nada mas que crear un subproceso e iniciar la ejecucin
120
6.
Crear un mtodo run(), que redefine la versin predefinida de run( ) del Runnable, que contenga el cdigo actual que controle el applet.
121