Tutorial de Swing

Prof.
Juregui Sotelo Julio Cesar
TUTORIAL DE SWING
01 EJERCICIO GUIADO. JAVA: CUADROS DE VERIFICACIN
1. Realiza un nuevo proyecto. 2. En la ventana principal debes aadir lo siguiente: a. Un botn Aceptar llamado btnAceptar. b. Una etiqueta con borde llamada etiResultado. 3. Aade tambin tres cuadros de verificacin. Estos cuadros son objetos del tipo JCheckBox.
4. Aade tres JCheckBox y cambia el texto de ellos, de forma que aparezca Perro, Gato y Ratn. 5. Debe cambiar el nombre de cada uno de ellos. Se llamarn: chkPerro, chkGato, chkRaton. 6. La ventana tendr el siguiente aspecto cuando termine:
Prof. Juregui Sotelo Julio Cesar
7. El programa debe funcionar de la siguiente forma: Cuando el usuario pulse aceptar, en la etiqueta aparecer un mensaje indicando qu animales han sido seleccionados. Para ello hay que programar el evento actionPerformed del botn Aceptar. En ese evento aada el siguiente cdigo:
String mensaje="Animales elegidos: "; if (chkPerro.isSelected()) { mensaje=mensaje+"Perro "; }
if (chkGato.isSelected()) { mensaje=mensaje+"Gato "; }
if (chkRaton.isSelected()) { mensaje=mensaje+"Raton "; }
etiResultado.setText(mensaje);
8. Observa el cdigo. En l se hace lo siguiente: a. Se crea una variable de cadena llamada mensaje. b. En esa variable se introduce el texto Animales elegidos: c. Luego, compruebo si est seleccionada la casilla de verificacin chkPerro. Si es as concateno a la cadena mensaje la palabra Perro. d. Luego compruebo si est seleccionada la casilla de verificacin chkGato y hago lo mismo. e. Lo mismo con la casilla chkRaton. f. Finalmente presento la cadena mensaje en la etiqueta etiResultado. 9. Observa el mtodo isSelected() propio de las casillas de verificacin, permiten saber si una casilla est activada o no. 10. Ejecute el programa. Seleccione por ejemplo las casillas Gato y Ratn. Al pulsar Aceptar el resultado debe ser el siguiente:
CONCLUSIN
Los cuadros de verificacin (JCheckBox) se usan cuando quieres seleccionar varias opciones. 3
02 EJERCICIO GUIADO. JAVA: BOTONES DE OPCIN
1. Realiza un nuevo proyecto. 2. En la ventana principal debes aadir lo siguiente: a. Un botn Aceptar llamado btnAceptar. b. Una etiqueta con borde llamada etiResultado. 3. Aade un panel. Un panel es una zona rectangular que puede contener elementos (botones, etiquetas, etc) La forma de poner un panel es a travs del objeto JPanel.
4. Una vez aadido el panel en el JFrame, le pondremos un borde para poder localizarlo fcilmente. Debes hacer lo siguiente: a. Selecciona el panel que has aadido. b. Activa la propiedad Border (botn con tres puntos) c. Busca el tipo de borde llamado TitledBorder (borde con ttulo) y pon el ttulo colores.
5. Tu ventana debe quedar ms o menos as:
Prof. Juregui Sotelo Julio Cesar 6. Ahora debes aadir tres botones de opcin (botones de radio) dentro del panel. Estos botones son objetos del tipo JRadioButton.
7. Aade tres JRadioButton y cambia el texto de ellos, de forma que aparezca Rojo, Verde y Azul. 8. Debe cambiar el nombre de cada uno de ellos. Se llamarn: optRojo, optVerde, optAzul. 9. La ventana tendr el siguiente aspecto cuando termine:
10. Si ejecuta el programa, observar que pueden seleccionarse varios colores a la vez. Esto no es interesante, ya que los botones de opcin se usan para activar solo una opcin entre varias.
Prof. Juregui Sotelo Julio Cesar 11. Hay que hacer que solo un botn de opcin pueda estar seleccionado a la vez. Para ello, debe aadir un nuevo objeto. Realice los siguientes pasos: a. Aada un objeto del tipo ButtonGroup al formulario. Atencin! Este objeto es invisible, y no se ver en el formulario, sin embargo, lo podris ver en el Inspector, en la parte de Otros Componentes:
b. Tienes que darle un nombre al ButtonGroup. El nombre ser grupoColores. c. Ahora, hay que conseguir que los tres botones pertenezcan al mismo grupo. Es decir, que pertenezcan al grupo grupoColores. d. Selecciona el botn de opcin optRojo y cambia su propiedad buttonGroup, indicando que pertenece al grupo colores (observa la imagen):
e. Haz lo mismo con los botones optVerde y optAzul.
12. Acabas de asociar los tres botones de opcin a un mismo grupo. Esto produce que solo una de las tres opciones pueda estar activada. Prubelo ejecutando el programa.
13. Ahora interesa que la opcin Rojo salga activada desde el principio. Una forma de hacer esto es programando en el Constructor lo siguiente: optRojo.setSelected(true);
El mtodo setSelected hace que se pueda activar o desactivar un botn de opcin.
Prueba el programa. Observa como la opcin Rojo est activada inicialmente.
14. El programa no est terminado an. Interesa que cuando el usuario pulse el botn Aceptar, en la etiqueta aparezca el color elegido. Para ello, en el actionPerformed del botn Aceptar programe lo siguiente: 8
Prof. Juregui Sotelo Julio Cesar String mensaje="Color elegido: ";
if (optRojo.isSelected()) { mensaje=mensaje+"Rojo"; } else if (optVerde.isSelected()) { mensaje=mensaje+"Verde"; } else if (optAzul.isSelected()) { mensaje=mensaje+"Azul"; }
etiResultado.setText(mensaje);
15. Observa el cdigo. En l se hace lo siguiente: a. Se crea una variable de cadena llamada mensaje. b. En esa variable se introduce el texto Color elegido: c. Luego se comprueba que opcin est seleccionada, usando el mtodo isSelected de los botones de opcin. Este mtodo te dice si un botn est seleccionado o no. d. Segn la opcin que est seleccionada, se aade un texto u otro a la cadena mensaje. e. Finalmente se muestra la cadena mensaje en la etiqueta etiResultado.
Prof. Juregui Sotelo Julio Cesar 16. Ejecute el programa. Seleccione por ejemplo la Verde. Al pulsar Aceptar el resultado debe ser el siguiente:
CONCLUSIN
Los botones de opcin, tambin llamados botones de radio (JRadioButton) se usan cuando quieres que el usuario pueda elegir una opcin de entre varias.
Es interesante que los botones de radio aparezcan dentro de un panel JPanel. Se recomienda colocar un borde al panel.
Es totalmente necesario aadir un objeto del tipo ButtonGroup, y hacer que los botones de radio pertenezcan a dicho grupo. En caso contrario, ser posible activar varios botones de opcin a la vez.
10
03 EJERCICIO GUIADO. JAVA: CUADROS DE LISTA
11. Realiza un nuevo proyecto. 12. En la ventana principal debes aadir lo siguiente: a. Un botn Aceptar llamado btnAceptar. b. Una etiqueta con borde llamada etiResultado. 13. Aade un cuadro de lista. Los cuadros de listas son objetos JList.
14. Cmbiale el nombre al JList. Ten cuidado, ya que en los JList aparecen siempre dentro de otro objeto llamado jScrollPane. Si miras en el Inspector, vers que al pulsar en el botn + del jScrollPane aparecer tu JList:
11
15. Aprovecha para cambiarle el nombre al JList. El nuevo nombre ser lstColores. 16. Si te fijas en el JList, consiste en un cuadro que contiene una serie de Items. Estos elementos pueden ser cambiados a travs de la propiedad Model del JList. 17. Busca la propiedad Model y haz clic en el botn de los tres puntos. Aparecer un cuadro de dilogo parecido al siguiente. Solo tienes que seleccionar los elementos que quieras y pulsar el botn Borrar (Remove) para eliminarlos de la lista. 18. Puedes aadir elementos escribindolos en el cuadro Artculo y luego pulsando el botn Aadir (Add).
12
19. Debes hacer que la lista sea la siguiente: Rojo Verde Azul
20. Ahora programaremos el actionPerformed del botn Aceptar. Debes introducir el siguiente cdigo:
String mensaje;
mensaje="El color seleccionado es: "+lstColores.getSelectedValue().toString(); etiResultado.setText(mensaje);
13
21. Observa el cdigo: a. Se crea una variable de cadena llamada mensaje. b. Y dentro de esta variable se introduce una concatenacin de cadenas. c. Observa la parte: lstColores.getSelectedValue(), esta parte devuelve el valor seleccionado de la lista. d. Hay que tener en cuenta que este valor no es una cadena, por eso hay que convertirla a cadena aadiendo .toString(). e. De esta manera puedes extraer el elemento seleccionado de un cuadro de lista. f. Luego simplemente ponemos la cadena mensaje dentro de la etiqueta. 22. Ejecuta el programa y observa su funcionamiento. Por ejemplo, si seleccionas el color verde y pulsas aceptar el resultado ser el siguiente:
23. Vamos a mejorar el programa. Puede suceder que el usuario no seleccione ningn valor del cuadro de lista, y sera interesante en este caso que el programa avisara de ello. Cambie el cdigo del botn Aceptar por este otro cdigo:
String mensaje;
if (lstColores.getSelectedIndex()==-1) { mensaje="No hay un color seleccionado.";
14

} else { mensaje="El color seleccionado es: "+lstColores.getSelectedValue().toString(); } etiResultado.setText(mensaje);
24. Observa el cdigo: a. El mtodo getSelectedIndex me dice el ndice del elemento que est seleccionado. b. Por ejemplo, si est seleccionado el primero el ndice es 0, si est seleccionado el segundo el ndice es 1, etc. c. Si este mtodo devuelve -1, entonces es seal de que no hay ningn elemento seleccionado. d. Aprovecho esto para mostrar un mensaje indicando lo sucedido. 25. Si ejecuta el programa y pulsa el botn Aceptar sin seleccionar nada el resultado debera ser el siguiente:
26. Se podra haber prescindido del botn aceptar si el cdigo anterior se hubiera puesto en el evento mouseClicked del cuadro de lista en vez de en el actionPerformed del botn Aceptar. En este caso, cada vez que se seleccionara un elemento de la lista, automticamente aparecera el mensaje en la etiqueta. 15
Prof. Juregui Sotelo Julio Cesar Se anima a que realice esta modificacin.
CONCLUSIN
El objeto JList permite crear cuadros de lista. Estos objetos contienen una serie de elementos que pueden ser seleccionados.
A travs del mtodo getSelectedValue se puede obtener el elemento que est seleccionado. (Recuerda convertirlo a cadena con toString)
A travs del mtodo getSelectedIndex se puede saber la posicin del elemento seleccionado. Si este ndice es -1, entonces sabremos que no hay ningn elemento seleccionado.
16
Prof. Juregui Sotelo Julio Cesar 04 EJERCICIO GUIADO. JAVA: CUADROS COMBINADOS
1. Realiza un nuevo proyecto. 2. En la ventana principal debes aadir lo siguiente: a. Una etiqueta con borde llamada etiResultado. 3. Aade un cuadro combinado (combo). Los cuadros combinados son objetos del tipo JComboBox. Bsicamente, un combo es una lista desplegable.
4. Cmbiale el nombre al JComboBox. El nombre ser cboColores. Tu programa debe tener ms o menos este aspecto.
17
Prof. Juregui Sotelo Julio Cesar 5. Los elementos del cboColores pueden ser cambiados a travs de la propiedad Model. Selecciona el combo y activa la propiedad Model (el botoncito con los tres puntos) Aparecer lo siguiente:
6. Al igual que pasaba con los cuadros de lista, se pueden eliminar los elementos que contiene el combo y aadir elementos propios. Use los botones Aadir y Eliminar para aadir la siguiente lista de elementos: Rojo Verde Azul
7. Ejecuta el programa y observa el funcionamiento del desplegable...
18
8. Vamos a hacer que cuando se elija un elemento del desplegable, en la etiqueta aparezca un mensaje indicando el color elegido. Para ello, debes programar el evento actionPerformed del combo y aadir el siguiente cdigo:
String mensaje="El color elegido es ";
mensaje=mensaje+cboColores.getSelectedItem().toString(); etiResultado.setText(mensaje);
9. Este cdigo hace lo siguiente: a. Crea una variable de cadena. b. Concatena dentro de ella el mensaje El color elegido es con el color seleccionado. c. Observa el mtodo getSelectedItem, se usa para saber el elemento seleccionado del combo. Es necesario convertirlo a texto con toString. d. Finalmente se coloca el mensaje en la etiqueta. 10. Ejecuta el programa y comprueba su funcionamiento. Por ejemplo, si elegimos el color verde, el aspecto del programa ser el siguiente:
19
11. Los cuadros combinados pueden funcionar tambin como cuadros de texto. Es decir, pueden permitir que se escriba texto dentro de ellos. Para hacer esto, basta con cambiar su propiedad editable y activarla.
12. Ejecuta el programa y observa como se puede escribir dentro del combo. Al pulsar Enter, el programa funciona igualmente con el texto escrito.
20
Se escribe aqu y se pulsa enter
CONCLUSIN
Los combos son listas desplegables donde se puede elegir una de las opciones propuestas.
Los combos pueden funcionar tambin como cuadros de textos, si se activa la opcin editable.
A travs del mtodo getSelectedItem se puede extraer la opcin seleccionada o el texto escrito en el combo.
21
Prof. Juregui Sotelo Julio Cesar 05 EJERCICIO GUIADO. JAVA: MODELOS DE CUADRO DE LISTA 1. Realiza un nuevo proyecto. 2. En la ventana principal debes aadir lo siguiente: a. Una etiqueta con borde llamada etiResultado. 3. Aade un cuadro de lista al formulario (JList).
4. Borra todo el contenido de la lista (propiedad model) y cmbiale el nombre a la lista. La lista se llamar lstNombres. Recuerda que las listas aparecen dentro de un objeto del tipo JScrollPane.
22
5. Aade dos botones al formulario. Uno de ellos tendr el texto Curso 1 y se llamar btnCurso1 y el otro tendr el texto Curso 2 y se llamar btnCurso2.
6. En el evento actionPerformed del botn Curso 1 programa lo siguiente: DefaultListModel modelo = new DefaultListModel(); modelo.addElement("Juan"); modelo.addElement("Mara"); modelo.addElement("Luis"); lstNombres.setModel(modelo);
7. En el evento actionPerformed del botn Curso 2 programa lo siguiente: DefaultListModel modelo = new DefaultListModel(); modelo.addElement("Ana"); modelo.addElement("Marta"); modelo.addElement("Jose"); lstNombres.setModel(modelo); 23
8. Explicacin de los cdigos anteriores: a. Lo que hace cada botn es rellenar el cuadro de lista con una serie de nombres. En el caso del botn Curso 1, la lista se rellena con los nombres Juan, Mara y Luis, mientras que en el caso del botn Curso 2, la lista se rellena con los nombres Ana, Marta y Jose. b. El contenido de un cuadro de lista es lo que se denomina un modelo. El modelo es un objeto que contiene el listado de elementos de la lista. c. Los modelos de las listas son objetos del tipo DefaultListModel. d. Lo que hace el programa es crear un modelo. Luego rellena el modelo con datos, y finalmente asocia el modelo al cuadro de lista. Veamos como se hace todo esto. e. Primero se crea el modelo, a travs de la siguiente instruccin (ser necesario aadir el import correspondiente, atento a la bombillita): DefaultListModel modelo = new DefaultListModel();
f.
El modelo tiene un mtodo llamado addElement que permite introducir datos dentro de l. As pues usamos este mtodo para aadir los datos al modelo.
modelo.addElement("Ana"); modelo.addElement("Marta"); modelo.addElement("Jose");
g. Finalmente asociamos el modelo creado al cuadro de lista de la siguiente forma: lstNombres.setModel(modelo);
h. As pues, aqu tienes una forma de cambiar el contenido de un cuadro de lista desde el propio programa.
24
Prof. Juregui Sotelo Julio Cesar 9. Prueba a ejecutar el programa. Observa como cuando pulsas cada botn cambia el contenido de la lista:
Click y cambia el listado.
10. Ahora aade el siguiente cdigo al evento mouseClicked del cuadro de lista:
etiResultado.setText(lstNombres.getSelectedValue().toString());
Esta instruccin hace que al seleccionar un elemento del cuadro de lista ste aparezca en la etiqueta etiResultado. Recuerda que el mtodo getSelectedValue permite recoger el elemento seleccionado (hay que convertirlo a cadena con toString)
11. Ejecuta el programa:
25
Click y aparece el elemento seleccionado en la etiqueta.
12. Una propuesta. Aada un botn Vaciar llamado btnVaciar. Este botn vaciar el contenido de la lista. Para esto lo nico que tiene que hacer es crear un modelo y, sin introducir ningn valor en l, asociarlo al cuadro de lista.
CONCLUSIN
Un cuadro de lista es un objeto que contiene a su vez otro objeto denominado modelo.
El objeto modelo es el que realmente contiene los datos de la lista.
Cuadro de lista Modelo Datos
Se puede crear un modelo y luego introducir datos en l. Luego se puede asociar ese modelo a la lista. De esta manera se puede cambiar el contenido de la lista en cualquier momento.
26
Prof. Juregui Sotelo Julio Cesar 06 EJERCICIO GUIADO. JAVA: MODELOS DE CUADRO DE LISTA
1. Realiza un nuevo proyecto. 2. En la ventana principal debes aadir lo siguiente: a. b. c. d. Un combo llamado cboNumeros. Un botn Pares llamado btnPares. Un botn Impares llamado btnImpares. Una etiqueta con borde llamada etiResultado.
3. Elimina todos los elementos que contenga el combo. Recuerda, debes usar la propiedad model del combo para cambiar sus elementos. 4. Despus de haber hecho todo esto, tu ventana debe quedar ms o menos as:
5. En el evento actionPerformed del botn Pares, programa lo siguiente:

int i;
DefaultComboBoxModel modelo = new DefaultComboBoxModel();
for (i=0;i<10;i+=2) { modelo.addElement("N "+i);
27

}
cboNumeros.setModel(modelo);
6. Observa lo que hace este cdigo: a. Crea un objeto modelo para el combo. Al igual que pasa con los cuadros de lista, los combos tienen un objeto modelo que es el que realmente contiene los datos. En el caso de los combos, para crear un objeto modelo se usar esta instruccin:
DefaultComboBoxModel modelo = new DefaultComboBoxModel();
b. A continuacin, se usa el objeto modelo creado y se rellena de datos. Concretamente, se rellena con los nmeros pares comprendidos entre 0 y 10. c. Observa el uso de la propiedad addElement para aadir un elemento al modelo del combo. d. Se ha usado un bucle for para hacer la introduccin de datos en el modelo ms fcil. e. Finalmente, se asocia el modelo al combo a travs de la siguiente lnea, con lo que el combo aparece relleno con los elementos del modelo:
cboNumeros.setModel(modelo);
7. Ejecuta el programa y observa el funcionamiento del botn Pares.
28
Se pulsa y se rellena automticamente
8. El botn Impares es similar. Programa su actionPerformed como sigue:

int i; DefaultComboBoxModel modelo = new DefaultComboBoxModel();
for (i=1;i<10;i+=2) { modelo.addElement("N "+i); } cboNumeros.setModel(modelo);
9. La nica diferencia de este cdigo es el for, que est diseado para que se introduzcan los nmeros impares comprendidos entre 0 y 10 dentro del modelo.
10. Finalmente se programar el actionPerformed del combo para que al seleccionar un elemento este aparezca en la etiqueta. Esto se hace con una simple instruccin:
etiResultado.setText(cboNumeros.getSelectedItem().toString());
29
Prof. Juregui Sotelo Julio Cesar Recuerda el uso de getSelectedItem() para recoger el elemento seleccionado, y el uso de toString() para convertirlo a texto.
11. Prueba el programa. Prueba los botones Pares e Impares y prueba el combo.
12. Sera interesante aadir un botn Vaciar llamado btnVaciar que vaciara el contenido del combo. Esto se hara simplemente creando un modelo vaco y asignarlo al combo. Se anima al alumno a que realice esta mejora.
CONCLUSIN
Un combo, al igual que los cuadros de lista, es un objeto que contiene a su vez otro objeto denominado modelo.
El objeto modelo es el que realmente contiene los datos del combo.
Combo Modelo Datos
Se puede crear un modelo y luego introducir datos en l. Luego se puede asociar ese modelo al combo. De esta manera se puede cambiar el contenido del combo en cualquier momento. 30
Prof. Juregui Sotelo Julio Cesar 07 EJERCICIO GUIADO. JAVA: TOGGLEBUTTONS
1. Realiza un nuevo proyecto. 2. Crears una ventana como la que sigue teniendo en cuenta lo siguiente: a. Se aadir una etiqueta con el texto Precio Base. No hace falta cambiarle su nombre. b. Se aadir un cuadro de texto llamado txtPrecioBase. c. Se crear un botn Calcular, llamado btnCalcular. d. Se crear una etiqueta vaca y con borde llamada etiTotal. Use la propiedad font de esta etiqueta para hacer que el texto tenga un mayor tamao.
e. Debes aadir tambin tres botones, con el texto Instalacin, Formacin y Alimentacin BD respectivamente. Estos botones no son botones normales, son botones del tipo JToggleButton. Usa este tipo de objeto para crearlos.
Estos botones, se diferencian de los botones normales en que se quedan pulsados cuando se hace un clic sobre ellos, y no vuelven a su estado normal hasta que no se vuelve a hacer clic sobre ellos.
31
Prof. Juregui Sotelo Julio Cesar Los tres botones se llamarn respectivamente: tbtnInstalacion, tbtnFormacion, tbtnAlimentacionBD.
f.
Aade finalmente tres etiquetas conteniendo los nmeros 40, 200, 200. La primera se llamar etiPrecioInstalacion, la segunda etiPrecioFormacion y la tercera etiPrecioAlimentacionBD.
3. Prueba el programa y comprueba el funcionamiento de los botones JToggleButton:
Observa como al pulsar los JToggledButton estos se quedan pulsados.
Si se vuelven a activar se despulsan.
4. Se pretende que el programa funcione de la siguiente forma: a. b. c. d. El usuario introducir un precio base para el servicio que se vende. A continuacin, si el cliente quiere la instalacin, activar el botn Instalacin. Si el cliente quiere la formacin, activar el botn Formacin. Si el cliente quiere la Alimentacin de Base de Datos, activar el botn Alimentacin BD. e. Ten en cuenta que el cliente puede querer una o varias de las opciones indicadas. f. Finalmente se pulsar el botn calcular y se calcular el precio total. Este precio se calcula de la siguiente forma: 32
Prof. Juregui Sotelo Julio Cesar Precio Total = Precio Base + Precio Extras.
El precio de los Extras depender de las opciones elegidas por el usuario. Por ejemplo, si el usuario quiere Instalacin y Formacin, los extras costarn 240 euros.
5. As pues, se programar el actionPerformed del botn Calcular de la siguiente forma:

double precio_base; double precio_instal; //precio instalacin double precio_for; //precio formacion double precio_ali; //precio alimentacion
//Recojo datos desde la ventana:
precio_base = Double.parseDouble(txtPrecioBase.getText()); precio_instal = Double.parseDouble(etiPrecioInstalacion.getText()); precio_for = Double.parseDouble(etiPrecioFormacion.getText()); precio_ali = Double.parseDouble(etiPrecioAlimentacionBD.getText());
//Ahora que tengo los datos, puedo hacer clculos.
//Al precio base se le van aadiendo precio de extras //segn estn o no activados los JToggleButtons
double precio_total;
precio_total = precio_base;
if (tbtnInstalacion.isSelected()) { //Si se seleccion instalacin precio_total = precio_total+precio_instal; }
33

if (tbtnFormacion.isSelected()) { //Si se seleccion formacin precio_total = precio_total+precio_for; }
if (tbtnAlimentacionBD.isSelected()) { //Si se seleccion Alimentacin BD precio_total = precio_total+precio_ali; }
//Finalmente pongo el resultado en la etiqueta etiTotal.setText(precio_total+" ");
6. Veamos una explicacin del cdigo: a. Primero se crean variables doubles (ya que se admitirn decimales) para poder hacer los clculos. b. Se extraern los datos de la ventana y se almacenarn en dichas variables. Para ello, hay que convertir desde cadena a double:
precio_base = Double.parseDouble(txtPrecioBase.getText()); precio_instal = Double.parseDouble(etiPrecioInstalacion.getText()); precio_for = Double.parseDouble(etiPrecioFormacion.getText()); precio_ali = Double.parseDouble(etiPrecioAlimentacionBD.getText());
c. Una vez obtenidos los datos en forma numrica, ya se pueden hacer clculos con ellos. El programa declara una nueva variable precio_total donde se introducir el resultado. En primer lugar se introduce en esta variable el precio base.
double precio_total;
precio_total = precio_base;
34
d. A continuacin se le suma al precio_total los precios de los extras si el botn correspondiente est seleccionado. Esto se hace a travs de if. Por ejemplo, para sumar el extra por instalacin:
if (tbtnInstalacion.isSelected()) { //Si se seleccion instalacin precio_total = precio_total+precio_instal; }
Esto significa: Si el botn instalacin est seleccionado, aade al precio total el precio por instalacin
Observa el uso del mtodo isSelected para saber si el botn tbtnInstalacion ha sido seleccionado.
e. Finalmente el resultado se muestra en la etiqueta de total.
7. Comprueba el funcionamiento del programa
Introduce una cantidad (usa el punto para los decimales)
Selecciona los extras que desees.
Pulsa Calcular y obtendrs el resultado.
35
8. Supongamos que normalmente (en el 90 por ciento de los casos) la instalacin es solicitada por el usuario. Podra ser interesante que el botn Instalacin ya saliera activado al ejecutarse el programa. Para ello, aade en el Constructor la siguiente lnea.
tbtnInstalacion.setSelected(true);
Esta lnea usa el mtodo setSelected para activar al botn tbtnInstalacin.
Comprueba esto ejecutando el programa.
CONCLUSIN
Los JToggleButton son botones que pueden quedarse pulsados.
A travs del mtodo isSelected podemos saber si un JToggleButton est seleccionado.
Tambin puedes usar el mtodo setSelected para seleccionar o no un botn de este tipo.
Realmente, estos botones no suelen ser muy usados, ya que pueden ser sustituidos por Cuadros de Verificacin (JCheckBox) que son ms conocidos.
36
Prof. Juregui Sotelo Julio Cesar 08 EJERCICIO GUIADO. JAVA: SLIDERS
Introduccin a los JSliders
La clase JSlider permite crear objetos como el siguiente:
Estos elementos tienen un pequeo recuadro que se puede arrastrar a derecha o izquierda. Segn la posicin del recuadro, el JSlider tendr un valor concreto.
El JSlider se puede configurar para que muestre los distintos valores que puede tomar:
Tambin se puede configurar de forma que los valores mnimo y mximo sean distintos:
El valor que tiene un JSlider es el valor al que apunta el recuadro del JSlider. En la imagen anterior, el JSlider tiene un valor de 85.
Se ver a continuacin las caractersticas ms interesantes de los JSlider y como programarlos. 37
Ejercicio guiado
1. Crea un nuevo proyecto. 2. Aade en l un JSLider. Su nombre ser slDeslizador.
3. Aade una etiqueta con borde. Su nombre ser etiValor. 4. La ventana tendr el siguiente aspecto:
38
Prof. Juregui Sotelo Julio Cesar 5. Un JSlider tiene un valor mnimo y un valor mximo. El valor mnimo es el valor que tiene cuando el recuadro est pegado a la parte izquierda, mientras que el valor mximo es el valor que tiene cuando el recuadro est pegado a la parte derecha. El valor mnimo y mximo del JSlider se puede cambiar. Busca las propiedades maximum y minimum del JSlider y asigna los siguientes valores:
Mximo: 500 Mnimo: 100
6. Se puede asignar un valor inicial al JSlider a travs de su propiedad value. Busque esta propiedad y asigne un valor de 400. Observe donde se sita el recuadro del JSlider.
7. Se puede mejorar el JSlider definiendo unas divisiones (medidas) Por ejemplo, haremos que cada 50 unidades aparezca una divisin. Para ello use la propiedad majorTickSpacing y asigne un 50.
39
Prof. Juregui Sotelo Julio Cesar 8. Esto, en realidad, no produce ningn cambio en el JSlider. Para que las divisiones se vean, es necesario que active tambin la propiedad paintTicks. Esta propiedad pintar divisiones en el JSlider:
Medidas cada 50 unidades
9. An se puede mejorar la presentacin del JSlider, si hacemos que aparezca el valor de cada divisin. Para ello debes activar la propiedad paintLabel.
10. Ejecuta el programa para ver el funcionamiento del Deslizador y su aspecto. Debe ser parecido al siguiente:
40
Prof. Juregui Sotelo Julio Cesar 11. Bien. Ahora se pretende que cuando el usuario arrastre el deslizador, en la etiqueta aparezca el valor correspondiente. Para ello tendr que programar el evento stateChanged del JSlider. El evento stateChanged sucede cuando el usuario arrastra el recuadro del deslizador.
En este evento programe lo siguiente:
etiValor.setText("El valor es: "+slDeslizador.getValue());
12. Ejecute el programa y observe lo que sucede cuando arrastra el deslizador. 13. La explicacin del cdigo es la siguiente: a. El mtodo getValue del deslizador nos devuelve el valor que tiene actualmente el deslizador. b. Este valor es concatenado a la cadena El valor es: y es mostrado en la etiqueta a travs del conocido setText.
Movemos aqu.
Y aparece el valor correspondiente aqu.
14. A continuacin se mencionan otras propiedades interesantes de los JSlider que puedes probar por tu cuenta: orientation Permite cambiar la orientacin del JSlider. Podras por ejemplo hacer que el JSlider estuviera en vertical. 41
minorTickSpacing Permite asignar subdivisiones a las divisiones ya asignadas. Prueba por ejemplo a asignar un 10 a esta propiedad y ejecuta el programa. Observa las divisiones del JSlider.
snapToTicks Cuando esta propiedad est activada, no podrs colocar el deslizador entre dos divisiones. Es decir, el deslizador siempre estar situado sobre una de las divisiones. Prueba a activarla.
paintTrack Esta propiedad permite pintar o no la lnea sobre la que se desliza el JSlider. Prueba a desactivarla.
CONCLUSIN
Los JSliders son objetos deslizadores. Permiten elegir un valor arrastrando un pequeo recuadro de derecha a izquierda o viceversa.
El valor de un JSliders puede ser obtenido a travs de su mtodo getValue.
Si quieres programar el cambio (el arrastre) en el deslizador, tienes que programar el evento llamado stateChanged.
42
Prof. Juregui Sotelo Julio Cesar 09 EJERCICIO GUIADO. JAVA: SPINNER
Introduccin a los JSpinner
La clase JSpinner permite crear cuadros como el siguiente:
Son elementos muy comunes en los programas. A travs de los dos botones triangulares se puede hacer que el valor del cuadro aumente o disminuya. Tambin se puede escribir directamente un valor dentro del cuadro.
Ejercicio guiado
1. Crea un nuevo proyecto. 2. Aade en l un JSpinner. Su nombre ser spiValor.
3. Aade una etiqueta con borde. Su nombre ser etiValor. 4. La ventana tendr el siguiente aspecto: 43
5. Interesa que cuando cambie el JSpinner (ya sea porque se pulsaron los botones triangulares o porque se escribi dentro) aparezca el valor correspondiente dentro de la etiqueta. Para ello, tendr que programar el evento stateChanged del JSpinner. En el evento stateChanged introduzca el siguiente cdigo:
etiValor.setText("El valor es: "+spiValor.getValue().toString());
6. Como puedes observar, lo que hace el programa es recoger el valor que tiene el JSpinner a travs del mtodo getValue y luego se lo asigna a la etiqueta con el clsico setText. (Es muy parecido a los deslizadores) Debes tener en cuenta que el valor devuelto no es un nmero ni una cadena, as que en el ejemplo se ha usado el mtodo toString() para convertirlo a una cadena.
7. Prueba el programa y observa su funcionamiento:
El usuario modifica el valor del JSpinner...
Y aqu aparece el valor seleccionado.
44
8. Observa como los valores del JSpinner aumentan o disminuyen en 1. Por otro lado, no parece haber un lmite para los valores del JSpinner. La pregunta ahora es: Se puede modificar el contenido del JSpinner de forma que tenga unos valores concretos? La respuesta es s. Veamos como hacerlo.
9. Entra dentro del cdigo del programa y, dentro del constructor, aade este cdigo debajo de initComponents:
SpinnerNumberModel nm = new SpinnerNumberModel(); nm.setMaximum(10); nm.setMinimum(0); spiValor.setModel(nm);
10. Este cdigo hace lo siguiente: a. El JSpinner, al igual que los JList y los JComboBox, es un objeto que contiene otro objeto modelo, y es el objeto modelo el que contiene los nmeros visualizados en el JSpinner. b. En el cdigo anterior se crea un modelo para el JSpinner, se definen los valores que contendr, y luego se asigna al JSpinner. Estudiemos las lneas del cdigo. c. La primera lnea crea un modelo llamado nm. Los modelos de los JSpinner son del tipo SpinnerNumberModel. Necesitars incluir el import correspondiente (atento a la bombilla) d. En la segunda lnea se define como valor mximo del modelo el 10, a travs de un mtodo llamado setMaximum. e. En la tercera lnea se define como valor mnimo del modelo el 0, a travs de un mtodo llamado setMinimum. f. Finalmente se asigna el modelo creado al JSpinner. 45
g. Este cdigo, en definitiva, har que el JSpinner muestre los valores comprendidos entre 0 y 10.
11. Prueba el programa y observa los valores que puede tomar el JSpinner.
Ahora los valores estn comprendidos entre 0 y 10
12. Vamos a aadir otra mejora. Cambie el cdigo del constructor por este otro. (Observa que solo se ha aadido una lnea):
SpinnerNumberModel nm = new SpinnerNumberModel(); nm.setMaximum(10); nm.setMinimum(0); nm.setStepSize(2); spiValor.setModel(nm);
13. La lnea aadida es:

nm.setStepSize(2);
Esta lnea usa un mtodo del modelo del JSpinner que permite definir el valor de cambio del JSPinner. Dicho de otra forma, esta lnea hace que los valores del JSpinner salten de 2 en 2.
14. Ejecuta el programa de nuevo y observa como cambian los valores del JSpinner. 46
15. El modelo del JSpinner tiene tambin un mtodo llamado setValue que permite asignar un valor inicial al modelo. Pruebe a usar este mtodo para hacer que el JSpinner muestre desde el principio el valor 4.
CONCLUSIN
Los JSpinners son objetos que permiten seleccionar un nmero, ya sea escribindolo en el recuadro, o bien a travs de dos botones triangulares que permiten aumentar o disminuir el valor actual.
Los JSpinners son objetos con modelo. Es decir, este objeto contiene a su vez otro objeto modelo que es el que realmente contiene los datos.
Datos Modelo JSpinner
Para definir el contenido del JSpinner es necesario crear un modelo del tipo SpinnerNumberModel. Se le asigna al modelo los nmeros deseados, y finalmente se une el modelo con el JSpinner.
El objeto modelo del JSpinner permite definir el valor mnimo y el valor mximo, as como el intervalo de aumento de los valores.
47
10 EJERCICIO GUIADO. JAVA: SCROLLBARS
Introduccin a las JscrollBars (Barras de desplazamiento)
La clase JScrollBar permite crear barras de desplazamiento independientes, como la que se muestra a continuacin:
La barra tiene un valor mnimo, que se consigue haciendo que el recuadro de la barra de desplazamiento est pegado a la parte izquierda.
Valor mnimo
Cuando se pulsa algunos de los botones de la barra de desplazamiento, el valor de la barra se incrementa / decrementa poco a poco. A este incremento / decremento lo llamaremos incremento unitario.
Decrementa el valor poco a poco (incremento unitario)
Incrementa el valor poco a poco (incremento unitario)
48
Cuando se pulsa directamente sobre la barra, el valor de la barra se incrementa / decrementa en mayor cantidad. A este incremento / decremento lo llamaremos incremento en bloque.
Al pulsar directamente sobre la barra se decrementa en mayor cantidad (incremento en bloque)
Al pulsar directamente sobre la barra se incremente en mayor cantidad (incremento en bloque)
Ejercicio guiado
1. Para comprender mejor el funcionamiento de las barras de desplazamiento se crear un proyecto nuevo. 2. Aade en el proyecto una barra de desplazamiento (JScrollBar) y llmala desValor.
3. La barra de desplazamiento aparecer en vertical. Use la propiedad de la barra llamada Orientation para hacer que la barra aparezca en posicin horizontal.
49
4. Aade tambin una etiqueta con borde y llmala etiValor. 5. La ventana debe quedar ms o menos as:
6. Interesa que cuando el usuario cambie de alguna manera la barra de desplazamiento, en la etiqueta aparezca el valor de la barra. Para ello, se debe programar el evento AdjustmentValueChanged de la barra de desplazamiento.
En este evento programa lo siguiente:
etiValor.setText("El valor es: "+desValor.getValue());
7. Como ves, se coloca en la etiqueta el valor de la barra. El valor de la barra se obtiene con el mtodo getValue. Ejecuta el programa para ver su funcionamiento.
Pulsa aqu y observa como el valor cambia poco a poco
50
Pero si pulsas aqu el valor cambia en mayor cantidad
8. Sigamos estudiando el programa. Se pide que cambies las siguientes propiedades de tu barra: Minimum Permite asignar el valor mnimo de la barra. Escribe un 50 Maximum Permite asignar el valor mximo de la barra. Escribe un 150
UnitIncrement Permite cambiar el incremento unitario. Escribe un 2.
BlockIncrement Permite cambiar el incremento en bloque. Escribe un 20.
51
Prof. Juregui Sotelo Julio Cesar VisibleAmount Permite cambiar el ancho del recuadro de la barra. Escribe un 5.
9. Ejecuta ahora el programa y comprueba su funcionamiento:
Si pulsas aqu, el valor se incrementa de 2 en 2, ya que el incremento unitario se configur en 2.
Si pulsas aqu, el valor se incrementa de 20 en 20, ya que el incremento en bloque es de 20.
Si llevas la barra de desplazamiento al mnimo, su valor ser de 50, ya que se configur as con la propiedad minimum
52
Observa lo que sucede cuando llevas la barra de desplazamiento al mximo: aparece un valor de 145, cuando el valor mximo que asignamos fue de 150 por qu?
10. Tal como se ha indicado anteriormente, pasa algo raro con la barra de desplazamiento cuando esta est al mximo. Se esperaba que alcanzara el valor 150, y sin embargo, el valor mximo alcanzado fue de 145. La explicacin es la siguiente:
Valor mximo (150)
***
Valor de la barra (145) **
* Nuestra barra tiene un valor mximo de 150.
** Sin embargo, el valor de la barra viene indicado por el lado izquierdo del recuadro interno.
53
Prof. Juregui Sotelo Julio Cesar *** Como el recuadro interno tiene un ancho definido a travs de la propiedad VisibleAmount, el valor mximo que la barra puede alcanzar es de:
Valor = ValorMximo Ancho del recuadro.
Es decir,
Valor alcanzable = 150 5 = 145
11. A travs del mtodo setValue de la barra de desplazamiento se puede asignar un valor inicial a la barra. Programe en el constructor de su programa lo necesario para que la barra de desplazamiento tenga un valor de 70 al empezar el programa.
CONCLUSIN
Las JScrollBars son barras de desplazamiento independientes. Al igual que los JSliders, las JScrollBars tienen un valor concreto, que puede ser obtenido a travs del mtodo getValue.
Entre las caractersticas programables de una barra de desplazamiento, tenemos las siguientes:
- Valor mnimo (propiedad Minimum) - Valor mximo (propiedad Maximum) - Incremento unitario (propiedad UnitIncrement) - Incremento en bloque (propiedad BlockIncrement) - Tamao del recuadro de la barra (propiedad VisibleAmount)
54
Prof. Juregui Sotelo Julio Cesar 11 EJERCICIO GUIADO. JAVA: BARRA DE MENUS
Barras de Mens
La barra de mens nos permitir acceder a las opciones ms importantes del programa. Todo programa de gran envergadura suele tener una barra de mens.
Ejercicio guiado
1. Veamos como aadir una barra de mens a nuestras aplicaciones. En primer lugar, crea un proyecto con el NetBeans. 2. Aade a tu ventana un objeto JMenuBar
3. En la parte superior de tu ventana aparecer esto:
4. En el inspector (parte inferior izquierda) observars como aparece un objeto JMenuBar, y, dentro de l, un objeto del tipo JMenu. Los objetos JMenu representan las opciones principales contenidas dentro de la barra de mens. 55
5. Aprovecha el Inspector para cambiar el nombre al objeto JMenuBar. Llmalo barraMenus. 6. Cambia tambin el nombre al objeto JMenu. Asgnale el nombre menuArchivo. El Inspector tendr el siguiente aspecto:
7. Ahora, la nica opcin de la barra de mens muestra el texto Menu. Esto se puede cambiar seleccionndola y cambiando su propiedad text. Asgnale el texto Archivo a la opcin del men:
8. Ahora el aspecto de la barra de mens ser el siguiente:
56
Prof. Juregui Sotelo Julio Cesar 9. Puedes aadir ms opciones principales a la barra de mens haciendo clic con el derecho sobre el objeto de la barra de mens y activando la opcin Aadir JMenu.
10. Aada dos opciones ms a la barra de mens. El inspector debe tener ahora el siguiente aspecto:
11. Y la barra de mens presentar este otro aspecto:
12. Cambia los nombres de las dos nuevas opciones. Sus nombres sern: menuEdicion y menuInsertar.
57
13. Cambia los textos de ambas opciones. Sus textos sern: Edicin e Insertar.
14. Ya tenemos creada la barra de mens (JMenuBar) con sus opciones principales (JMenu). Ahora se tendrn que definir las opciones contenidas en cada opcin principal. Por ejemplo, crearemos las opciones contenidas en el men Archivo. 15. Haz clic con el botn derecho sobre el objeto menuArchivo y activa la opcin Aadir JMenuItem.
Los JMenuItem son objetos que representan las opciones contenidas en los mens desplegables de la barra de mens. 16. Aade un JMenuItem ms al menuArchivo y luego cambia el nombre a ambos. Sus nombres sern menuItemAbrir y menuItemGuardar. El aspecto del Inspector ser el siguiente:
58
17. Usa ahora la propiedad Text de ambos JMenuItem para asignarles un texto. El primero tendr el texto Abrir y el segundo el texto Guardar. 18. Ya podemos ejecutar el programa para ver que es lo que se ha conseguido. Use el men:
Observa como la opcin Archivo se despliega mostrando dos submens: Abrir y Guardar.
19. Seguiremos aadiendo elementos al men. Ahora haga clic con el derecho sobre el elemento menuArchivo y aada un JSeparator.
59
Los JSeparator son objetos que definen una separacin entre las opciones de un men. Cmbiele el nombre y llmelo separador1:
20. Aada un nuevo JMenuItem al men Archivo y ponle el nombre menuSalir. El texto de esta opcin ser Salir (use su propiedad text) El aspecto del Inspector ser el siguiente:
21. Ejecuta el programa y observa el contenido de la opcin Archivo del men:
Observa el efecto que produce el separador.
22. Un JMenu representa las opciones principales de la barra de mens. A su vez, un JMenu contiene JMenuItem, que son las opciones contenidas en cada opcin principal, y que se ven cuando se despliega el men. Sin embargo, un JMenu puede contener a otros JMenu, que a su vez contendrn varios JMenuItem. Usando el botn derecho del ratn y la opcin Aadir, aade un JMenu dentro de menuEdicion:
60
23. Llama al nuevo JMenu menuColores y asignale el texto Colores.
24. Ahora aade dentro del menuColores tres JMenuItem llamados respectivamente: menuItemRojo, menuItemVerde, menuItemAzul. Sus textos sern Rojo, Verde y Azul.
61
25. Ejecuta el programa y observa como ha quedado el men Edicin:
La opcin Edicin (JMenu) contiene una opcin Colores (JMenu) que a su vez contiene las opciones Rojo, Verde y Azul (JMenuItems)
26. De nada sirve crear un men si luego este no reacciona a las pulsaciones del ratn. Cada objeto del men tiene un evento ActionPerformed que permite programar lo que debe suceder cuando se active dicha opcin del men. 27. Marque en el inspector el objeto menuItemRojo y acceda a su evento ActionPerformed. Dentro de l programe este sencillo cdigo: this.getContentPane().setBackground(Color.RED);
Este cdigo cambia el color de fondo de la ventana a rojo.
28. Compruebe el funcionamiento de la opcin Rojo del men ejecutando el programa. 62
29. Programa tu mismo las opciones Verde y Azul.
CONCLUSIN
Las barras de mens son un conjunto de objetos de distinto tipo que se contienen unos a los otros:
La barra en s est representada por un objeto del tipo JMenuBar.
La barra contiene opciones principales, representadas por objetos JMenu.
Las opciones principales contienen opciones que aparecen al desplegarse el men. Esta opciones son objetos del tipo JMenuItem.
Un JMenu tambin puede contener otros JMenu, que a su vez contendrn JMenuItems.
Tambin puede aadir separadores (JSeparator) que permiten visualizar mejor las opciones dentro de un men.
63
Prof. Juregui Sotelo Julio Cesar 12 EJERCICIO GUIADO. JAVA: BARRA DE HERRAMIENTAS
Barras de herramientas
Una barra de herramientas es bsicamente un contenedor de botones y otros elementos propios de la ventana.
A travs de estos botones se pueden activar de forma rpida las opciones del programa, las cuales suelen estar tambin incluidas dentro de la barra de mens.
Ejercicio guiado
1. Veamos como aadir una barra de herramientas a nuestras aplicaciones. En primer lugar, crea un proyecto con el NetBeans. 2. Aade a tu ventana un objeto JmenuBar (una barra de mens) 3. En la parte superior de tu ventana aparecer esto:
4. Debajo de la barra de mens colocaremos una barra de herramientas, as que aade un objeto del tipo JToolBar. Haz que la barra se coloque debajo de la barra de mens y que alcance desde la parte izquierda de la ventana a la parte derecha. La ventana quedar as:
64
5. Las barras de herramientas son simples contenedoras de objetos. Dentro de ellas se pueden colocar botones, combos, etiquetas, etc. Normalmente, las barras de herramientas contienen botones. As que aade cuatro botones (JButton) dentro de la barra. Solo tienes que colocarlos dentro de ella.
65
Prof. Juregui Sotelo Julio Cesar 6. Puedes ver si los botones estn bien colocados observando el Inspector: Observa como los botones colocados se encuentran dentro de la barra.
7. Aprovecharemos el inspector para cambiar el nombre a la barra y a cada botn. A la barra la llamaremos barraHerramientas, y a los botones los llamaremos btnUno, btnDos, btnTres y btnCuatro:
8. Cambia el texto de los botones. Estos contendrn el texto: Uno, Dos, Tres y Cuatro. 9. Ejecuta el programa y observa el resultado.
10. La forma de programar cada botn no vara, aunque estos se encuentren dentro de la barra herramientas. Solo hay que seleccionar el botn y acceder a su evento actionPerformed.
66
Prof. Juregui Sotelo Julio Cesar 11. Solo como demostracin de esto ltimo, entra en el actionPerformed del primer botn y programa esto:
JOptionPane.showMessageDialog(null,"Activaste el botn uno");
Luego ejecuta el programa y comprueba el funcionamiento del botn. 12. Los botones de la barra de herramientas normalmente no contienen texto, sino que contienen un icono que representa la funcin que realiza. La forma de colocar un icono dentro de un botn es a travs de su propiedad icon. 13. A travs de la propiedad icon de un botn podr seleccionar un fichero de imagen que contenga la imagen a mostrar en el botn. 14. Activa la propiedad icon del primer botn. Luego elige la opcin Fichero y pulsa el botn Seleccionar Fichero para buscar un fichero con imagen. Nota: Busca un fichero de imagen que sea del tipo .gif o .jpg. Nota: Procura que la imagen sea pequea. Nota: Se recomienda buscar imgenes .gif en Internet para practicar.
67
15. Una vez colocadas las imgenes a los botones, se puede quitar el texto de estos. Un ejemplo de cmo podra quedar la barra de herramientas es este:
CONCLUSIN
Las barras de herramientas son simplemente contenedores de objetos. Normalmente botones.
Los elementos de la barra de herramientas se manejan de la misma forma que si no estuvieran dentro de la barra.
Lo normal es hacer que los botones de la barra no tengan texto y tengan iconos asociados.
68
Prof. Juregui Sotelo Julio Cesar 13 EJERCICIO GUIADO. JAVA: MENUS EMERGENTES
El evento mouseClicked
El evento mouseClicked es capaz de capturar un clic del ratn sobre un determinado elemento de la ventana.
Este evento recibe como parmetro un objeto del tipo MouseEvent, y gracias a l se puede conseguir informacin como la siguiente:
Qu botn del ratn fue pulsado. Cuantas veces (clic, doble clic, etc) En qu coordenadas fue pulsado el botn. Etc.
Se puede usar esta informacin para saber por ejemplo si se puls el botn derecho del ratn, y sacar en este caso un men contextual en pantalla.
En este ejercicio guiado se estudiarn las posibilidades del evento mouseClicked y se aplicarn a la creacin y visualizacin de mens contextuales (o emergentes)
Ejercicio guiado
1. Crea un nuevo proyecto. 2. No hace falta que aada nada a la ventana. 3. Programaremos la pulsacin del ratn sobre el formulario, as que haga clic sobre el formulario y active el evento mouseClicked. 4. Observe el cdigo del evento:
69

private void formMouseClicked(java.awt.event.MouseEvent evt) { // TODO add your handling code here:
Este evento recibe como parmetro un objeto llamado evt del tipo MouseEvent (en rojo en el cdigo) que nos permite saber en qu condiciones se hizo clic.
5. Dentro del evento programe lo siguiente:

if (evt.getButton()==1) { JOptionPane.showMessageDialog(null,"Pulso el izquierdo"); } else if (evt.getButton()==2) {
JOptionPane.showMessageDialog(null,"Pulso el central"); } else if (evt.getButton()==3) { JOptionPane.showMessageDialog(null,"Pulso el derecho"); }
6. Ejecuta el programa y haz clic sobre el formulario con el botn derecho, con el izquierdo y con el central. Observa el resultado. 7. Ahora quizs puedas comprender el cdigo anterior. En l, se usa el mtodo getButton del objeto evt para saber qu botn se puls. El mtodo getButton devuelve un entero que puede ser 1, 2 o 3 segn el botn pulsado.
8. Se puede aprovechar el mtodo getButton para controlar la pulsacin del botn derecho del ratn y as sacar un men contextual. Pero antes, es necesario crear el men. 9. Agrega a tu formulario un objeto del tipo JPopupMenu. Estos objetos definen mens emergentes. 70
Prof. Juregui Sotelo Julio Cesar 10. Los objetos JPopupMenu no se muestran en el formulario, pero puedes verlo en el Inspector dentro de la rama de Otros Componentes:
11. Aprovecharemos el inspector para cambiar el nombre al men. Llmalo menuEmergente. 12. Los mens emergentes se crean igual que las opciones de mens normales, aadiendo con el botn derecho del ratn objetos JMenuItem. 13. Aada al men emergente tres JMenuItem, y asgneles los siguientes nombres a cada uno: menuRojo, menuVerde, menuAzul. El inspector debera tener el siguiente aspecto:
14. Tienes que cambiar la propiedad text de cada opcin del men. Recuerda que esta propiedad define lo que aparece en el men. Asignars los siguientes textos: Rojo, Verde y Azul. 15. El men emergente ya est construido. Ahora tenemos que hacer que aparezca cuando el usuario pulse el botn derecho del ratn sobre el formulario. Para ello, entraremos de nuevo en el evento mouseClicked del formulario y cambiaremos su cdigo por el siguiente:
menuEmergente.show(this,evt.getX(),evt.getY());
71
Prof. Juregui Sotelo Julio Cesar 16. Este cdigo significa lo siguiente: El mtodo show le da la orden al menuEmergente para que se muestre. El mtodo show recibe tres elementos: por un lado la ventana donde acta (this) Por otro lado la posicin x donde debe mostrarse el men. Esta posicin es aquella donde se puls el ratn, y se puede conseguir gracias al mtodo getX del objeto evt. Por ltimo se necesita la posicin y. Esta posicin se puede conseguir gracias al mtodo getY del objeto evt. Es decir, decidimos mostrar el men emergente justo en las coordenadas donde se hizo clic.
17. Ejecuta el programa y observa el resultado.
Al hacer clic con el derecho se mostrar el men contextual.
18. Para hacer que al pulsarse una opcin suceda algo, solo hay que activar el mtodo actionPerformed del JMenuItem correspondiente. Por ejemplo, active el actionPerformed del menuRojo y dentro programe lo siguiente:
this.getContentPane().setBackground(Color.RED);
72
19. Ejecuta el programa y comprueba lo que sucede al pulsar la opcin Rojo del men contextual.
CONCLUSIN
Los mens contextuales son objetos del tipo JPopupMenu. Estos objetos contienen JMenuItem al igual que las opciones de men normales.
Cuando se asigna un JPopupMenu a un formulario, no aparece sobre la ventana, pero s en el inspector.
Para hacer que aparezca el men emergente, es necesario programar el evento mouseClicked del objeto sobre el que quiera que aparezca el me.
Tendr que usar el mtodo show del men emergente para mostrar dicho men.
73
Prof. Juregui Sotelo Julio Cesar 14 EJERCICIO GUIADO. JAVA: FILECHOOSER
Cuadros de dilogo Abrir y Guardar
Las opciones Abrir y Guardar son opciones muy comunes en las aplicaciones. Estas opciones permiten buscar en el rbol de carpetas del sistema un fichero en concreto y abrirlo, o bien guardar una informacin dentro de un fichero en alguna carpeta.
Java proporciona una clase llamada JFileChooser (elegir fichero) que permite mostrar la ventana tpica de Abrir o Guardar:
Ventana Abrir fichero:
(La ventana de guardar es la misma, solo que muestra en su barra de ttulo la palabra Guardar)
El objeto JFileChooser nos facilita la labor de elegir el fichero, pero no realiza la apertura o la accin de guardar la informacin en l. Esto tendr que ser programado.
74
Ejercicio guiado
1. Vamos a practicar con el JFileChooser. Para ello, crea un nuevo proyecto. 2. Aade en el proyecto los siguientes elementos: a. Una barra de mens. Llmala barraMenus. b. Dentro de ella una opcin Archivo llamada menuArchivo. c. Dentro de la opcin Archivo, introduce los siguientes elementos: i. Una opcin Abrir, llamada menuAbrir. ii. Un separador (llmalo como quieras) iii. Una opcin Salir, llamada menuSalir. 3. Una vez hecho esto tu formulario tendr la siguiente forma:
4. Si ejecutas el programa el men se ver as:
5. Si observas el Inspector, tendr un aspecto parecido al siguiente:
75
6. Para que al pulsar la opcin Abrir de nuestro programa aparezca el dilogo de apertura de ficheros, es necesario aadir a nuestro programa un objeto del tipo JFileChooser. Los objetos JFileChooser se aadirn el la zona de Otros Componentes del inspector.
7. Haz clic con el derecho sobre la zona de otros componentes y activa la opcin Agregar desde Paleta Swing JFileChooser:
76
Prof. Juregui Sotelo Julio Cesar 8. Aparecer entonces un objeto JFileChooser dentro de Otros Componentes. Aprovecha para cambiarle el nombre a este objeto. Su nombre ser elegirFichero. El inspector quedar as:
9. Una vez hecho esto, ya podemos programar la opcin Abrir del men. Activa el evento actionPerformed de la opcin Abrir y programa dentro de l lo siguiente:
int resp;
resp=elegirFichero.showOpenDialog(this);
if (resp==JFileChooser.APPROVE_OPTION) {
JOptionPane.showMessageDialog(null,elegirFichero.getSelectedFile().toString());
} else if (resp==JFileChooser.CANCEL_OPTION) {
JOptionPane.showMessageDialog(null,"Se puls la opcin Cancelar"); }
77
Prof. Juregui Sotelo Julio Cesar 10. Ejecuta el cdigo y prueba la opcin Abrir del men. Prueba a elegir algn fichero y abrirlo. Prueba a cancelar la ventana de apertura. Etc 11. Analicemos el cdigo anterior:
int resp;
resp=elegirFichero.showOpenDialog(this);
Estas dos lneas crean una variable entera resp (respuesta) y a continuacin hacen que se muestre la ventana Abrir Fichero. Observa que para conseguirlo hay que usar el mtodo showOpenDialog del objeto elegirFichero. Este mtodo lleva como parmetro la ventana actual (this) El mtodo showOpenDialog no solo muestra la ventana Abrir Fichero sino que tambin devuelve un valor entero segn el botn pulsado por el usuario en esta ventana. Esto es: botn Abrir o botn Calcelar. Se pueden usar dos if para controlar lo que sucede si el usuario puls el botn Abrir o el botn Calcelar de la ventana Abrir Fichero:
if (resp==JFileChooser.APPROVE_OPTION) {
JOptionPane.showMessageDialog(null,elegirFichero.getSelectedFile().toString());
} else if (resp==JFileChooser.CANCEL_OPTION) {
JOptionPane.showMessageDialog(null,"Se puls la opcin Cancelar"); }
En el primer if se compara la variable resp con la constante JFileChooser.APPROVE_OPTION, para saber si el usuario puls Abrir. En el segundo if se compara la variable resp con la constante JFileChooser.CANCEL_OPTION, para saber si el usuario puls Calcelar. En el caso de que el usuario pulsara Abrir, el programa usa el mtodo getSelectedFile del objeto elegirFichero para recoger el camino del fichero elegido. Este camino debe ser convertido a cadena con el mtodo toString.
78
Prof. Juregui Sotelo Julio Cesar El programa aprovecha esto para mostrar dicho camino en pantalla gracias al tpico JOptionPane. En el caso del que el usuario pulsara el botn Cancelar el programa muestra un mensaje indicndolo.
12. Hay que volver a dejar claro que el cuadro de dilogo Abrir realmente no abre ningn fichero, sino que devuelve el camino del fichero elegido usando el cdigo:
elegirFichero.getSelectedFile().toString()
Luego queda en manos del programador el trabajar con el fichero correspondiente de la forma que desee.
CONCLUSIN
Los objetos JFileChooser permiten mostrar el cuadro de dilogo Abrir Fichero o Guardar Fichero.
Estos objetos no abren ni guardan ficheros, solo permiten al usuario elegir el fichero a abrir o guardar de forma sencilla.
El JFileChooser devuelve el camino del fichero elegido, y luego el programador trabajar con dicho fichero como mejor le interese.
79
Prof. Juregui Sotelo Julio Cesar 15 EJERCICIO GUIADO. JAVA: PANELES DE DESPLAZAMIENTO
Paneles de Desplazamiento
Llamaremos paneles de desplazamiento a paneles que contienen elementos tan grandes que no pueden ser mostrados en su totalidad. Estos paneles contienen entonces dos barras de desplazamiento que permiten visualizar el interior del panel de desplazamiento correctamente.
Por ejemplo, un panel de desplazamiento podra contener una imagen tan grande que no se viera entera:
Los paneles de desplazamiento son objetos del tipo JScrollPane.
Ejercicio guiado 1
1. Vamos a practicar con los JScrollPane. Para ello, crea un nuevo proyecto. 2. Aade en el proyecto un JScrollPane. 3. Un JScrollPane, por s mismo, no contiene nada. Es necesario aadir dentro de l el objeto que contendr. Para nuestro ejemplo aadiremos dentro de l una etiqueta (JLabel) 4. El formulario debe tener ahora este aspecto:
80
5. Si observas el Inspector vers claramente la distribucin de los objetos:
Observa como tienes un JScrollPane que contiene una etiqueta.
6. Aprovechemos el Inspector para cambiar el nombre a cada objeto. Al JScrollPane le llamaremos scpImagen y a la etiqueta etiImagen.
7. Elimina el texto contenido en la etiqueta etiImagen. Solo tienes que borrar el contenido de la propiedad text.
81
Prof. Juregui Sotelo Julio Cesar 8. Luego introduciremos una imagen dentro de la etiqueta, a travs de la propiedad icon. La imagen la introduciremos desde fichero, y elegiremos la siguiente imagen de tu disco duro: Mis Documentos / Mis Imgenes / Imgenes de Muestra / Nenfares.jpg
9. Esta imagen es tan grande que no se podr ver entera dentro del panel de desplazamiento. Ejecuta el programa y observars el uso de las barras de desplazamiento dentro del panel.
10. Puedes mejorar el programa si agrandas el panel de desplazamiento de forma que ocupe todo el formulario:
82
De esta forma, cuando ejecutes el programa, al agrandar la ventana, se agrandar el panel de desplazamiento, vindose mejor la imagen contenida.
11. Ejecuta el programa y comprubalo.
Ejercicio guiado 2
Los JScrollPane no solo estn diseados para contener imgenes. Pueden contener cualquier otro elemento. Vamos a ver, con otro proyecto de ejemplo, otro uso de los JScrollPane.
1. Crea un nuevo proyecto. 2. Aade a la ventana una etiqueta con el texto Ejemplo 2 de JScrollPane y un JScrollPane de forma que est asociado a los lmites de la ventana. Observa la imagen:
83
3. Ahora aade dentro del JScrollPane un panel normal (JPanel). En la ventana no notars ninguna diferencia, pero en el Inspector debera aparecer esto:
4. Como ves, el JScrollPane contiene a un objeto JPanel. 5. Aprovechemos para cambiar el nombre a ambos objetos. Al JScrollPane lo llamaremos scpDatos y al JPanel lo llamaremos panelDatos.
6. Los JPanel son objetos contenedores. Es decir, pueden contener otros objetos como por ejemplo botones, etiquetas, cuadros de texto, etc. 84
Adems, los JPanel pueden ser diseados independientemente de la ventana. Haz doble clic sobre el panelDatos en el Inspector y observa lo que ocurre:
7. En la pantalla aparecer nicamente el JPanel, para que puede ser diseado aparte de la ventana completa:
8. Para distinguirlo de lo que es en s la ventana, haremos las siguientes cosas con el panel: Cambia el color de fondo y asgnale un color verde. Aade en l una etiqueta con el texto Panel de Datos. Aade varias etiquetas y cuadros de textos correspondientes a los das de la semana. Agranda el panel. El panel debera quedar as. Toma como referencia esta imagen:
85
Es muy interesante que observes el Inspector. En l podrs observar la distribucin de los objetos en la ventana. Podrs ver como el JFrame contiene un JScrollPane (scpDatos) que a su vez contiene un JPanel (panelDatos) que a su vez contiene una serie de etiquetas y cuadros de textos a los que an no les hemos asignado un nombre:
86
9. Haz doble clic sobre el JFrame (en el Inspector) para poder ver globalmente la ventana. En la pantalla debera aparecer esto:
Como ves, el JPanel contenido en el JScrollPane es ms grande que l, por lo que no se podr visualizar completamente. Ser necesario usar las barras de desplazamiento del JScrollPane.
10. Ejecuta el programa para entender esto ltimo.
CONCLUSIN
Los objetos JScrollPane son paneles de desplazamiento. Estos paneles pueden contener objetos mayores que el propio panel de desplazamiento. Cuando esto sucede, el panel muestra barras de desplazamiento para poder visualizar todo el contenido del panel.
Los JScrollPane son ideales para mostrar imgenes, paneles y otros elementos cuyo tamao pueda ser mayor que la propia ventana.
87
Prof. Juregui Sotelo Julio Cesar 16 EJERCICIO GUIADO. JAVA: VARIABLES GLOBALES
Variables Globales / Propiedades de la Clase
Las propiedades de la clase en java es el equivalente a las variables globales en lenguajes estructurados como el C.
Una propiedad es una variable que puede ser accedida desde cualquier evento programado. Esta variable se inicializa a un valor cuando se ejecuta el programa y los distintos eventos pueden ir cambiando su valor segn se necesite.
Veamos un ejemplo para entender el funcionamiento de las propiedades de la clase / variables globales.
Ejercicio guiado 1
1. Crea un nuevo proyecto llamado ProyectoParking. Dentro de l aade un paquete llamado paqueteParking. Y finalmente aade un JFrame llamado Parking. El aspecto de tu proyecto ser el siguiente:
Clase Principal
2. Tu clase principal es la clase Parking. 3. Se pretende hacer un pequeo programa que controle los coches que van entrando y van saliendo de un parking. En todo momento el programa debe decir cuantos coches hay dentro del parking. Para ello debes crear una ventana como la que sigue:
88
4. Esta ventana contiene lo siguiente: i. ii. iii. iv. v. Un botn Entr un coche llamado btnEntro. Un botn Sali un coche llamado btnSalio. Un botn Reiniciar llamado btnReiniciar. Una etiqueta con el texto Coches en el Parking. Una etiqueta con borde llamada etiCoches que contenga un 0.
5. Se pretende que el programa funcione de la siguiente forma: a. Cuando el usuario pulse el botn Entr un coche, el nmero de coches del parking aumenta en 1, mostrndose en la etiqueta etiCoches. b. Si el usuario pulsa el botn Sali un coche, el nmero de coches del parking disminuye en 1, mostrndose en la etiqueta etiCoches. c. El botn Reiniciar coloca el nmero de coches del parking a 0.
6. Para poder controlar el nmero de coches en el Parking, es necesario que nuestra clase principal Parking tenga una propiedad (variable global) a la que llamaremos coches. Esta variable ser entera (int). Esta variable contendr en todo momento los coches que hay actualmente en el Parking. Esta variable podr ser usada desde cualquier evento.
7. Para crear una variable global haz clic en el botn Origen para acceder al cdigo:
89
8. Luego busca, al comienzo del cdigo una lnea que comenzar por public class
Seguida del nombre de tu clase principal Parking.
Debajo de dicha lnea es donde se programarn las propiedades de la clase (las variables globales)
Aqu se declaran las variables globales, tambin llamadas propiedades de la clase.
9. En dicho lugar declarars la variable coches de tipo int:
Declaracin de una variable global int llamada coches.
10. Cuando el programa arranque, ser necesario que la variable global coches tenga un valor inicial. O dicho de otra forma, ser necesario inicializar la variable. Para inicializar la variable iremos al constructor. Aade lo siguiente al cdigo: 90
Inicializacin de la propiedad coches.
Inicializamos a cero ya que se supone que cuando arranca el programa no hay ningn coche dentro del parking.
11. Ahora que ya tenemos declarada e inicializada la variable global coches, esta puede ser usada sin problemas desde cualquier evento que programemos. Por ejemplo, empezaremos programando la pulsacin del botn Entr un coche. Acceda a su evento actionPerformed y programe esto:
coches=coches+1; etiCoches.setText(+coches);
Como ves, se le aade a la variable coches uno ms y luego se coloca su valor actual en la etiqueta.
12. Ejecuta el programa y prueba este botn varias veces.
91
Pulsas, y aparece aqu el valor de la propiedad coches.
13. Ahora programaremos el botn Sali un coche de la siguiente forma:
if (coches>0) { coches=coches-1; etiCoches.setText(+coches); }
Como ves, se accede igualmente a la propiedad coches pero esta vez para restarle una unidad. Luego se muestra el valor actual de coches en la etiqueta correspondiente.
Se usa un if para controlar que no pueda restarse un coche cuando el parking est vaco. (Si hay cero coches en el parking no se puede restar uno)
14. Ejecuta el programa y prueba los dos botones. Observa como la cantidad de coches del parking aumenta o disminuye.
92
Al pulsar aqu aumentas en uno la propiedad coches.
Al pulsar aqu disminuyes en uno la propiedad coches.
Lo realmente interesante de esto es que desde dos eventos distintos (desde dos botones) se puede usar la variable coches. Esto es as gracias a que ha sido creada como variable global, o dicho de otro modo, ha sido creada como propiedad de la clase Parking.
15. Finalmente se programar el botn Reiniciar. Este botn, al ser pulsado, debe colocar la propiedad coches a cero. Programa dentro de su actionPerformed lo siguiente:
coches=0; etiCoches.setText(0);
Simplemente introduzco el valor cero en la variable global y actualizo la etiqueta.
16. Ejecuta el programa y comprueba el funcionamiento de este botn.
CONCLUSIN Las variables globales, tambin llamadas propiedades de la clase, son variables que pueden ser usadas desde cualquier evento del programa. Estas variables mantienen su valor hasta que otro evento lo modifique. Las variables globales se declaran justo despus de la lnea public class. La inicializacin de estas variables se realiza en el constructor.
93
17 EJERCICIO GUIADO. JAVA: CENTRALIZAR CDIGO
El problema de la repeticin de cdigo
Es muy habitual en Java que varios eventos tengan que ejecutar el mismo cdigo. En este caso se plantea la necesidad de copiar y pegar ese cdigo en los distintos eventos a programar:
Evento 1
Cdigo A
Evento 2
Cdigo A
Cdigo A Evento 3
Esta es una mala forma de programacin, ya que se necesitara modificar el cdigo, sera necesario realizar la modificacin en cada copia del cdigo. Es muy fcil que haya olvidos y aparezcan errores en el programa que luego son muy difciles de localizar.
Lo mejor es que el cdigo que tenga que ser ejecutado desde distintos eventos aparezca solo una vez, y sea llamado desde cada evento:
Evento 1 Cdigo A
Evento 2
Evento 3
94
Veamos algunos ejemplos en los que el cdigo se puede repetir y como evitar esta repeticin.
Ejercicio guiado 1
1. Crea un nuevo proyecto en java que se llame ProyectoCalculos. Este proyecto tendr un paquete llamado PaqueteCalculos. Y dentro de l crear un JFrame llamado VentanaCalculos. El proyecto tendr el siguiente aspecto:
2. La VentanaCalculos debe estar diseada de la siguiente forma:
95
Prof. Juregui Sotelo Julio Cesar Esta ventana contiene los siguientes elementos:
Una barra de mens a la que puede llamar menuBarra. La barra de mens contiene un JMenu con el texto Calcular y que se puede llamar menuCalcular El menuCalcular contendr tres JMenuItem, llamados respectivamente: menuSumar, menuRestar, menuBorrar y con los textos Sumar, Restar y Borrar. Una etiqueta con el texto Nmero 1. (no importa su nombre) Una etiqueta con el texto Nmero 2. (no importa su nombre) Un cuadro de texto con un 0 y con el nombre txtNumero1. Un cuadro de texto con un 0 y con el nombre txtNumero2. Una etiqueta con el nombre etiResultado. Un botn Sumar con el nombre btnSumar. Un botn Restar con el nombre btnRestar. Un botn Borrar con el nombre btnBorrar.
3. Aqu puedes ver la ventana en ejecucin con el men Calcular desplegado:
4. El objetivo de programa es el siguiente: a. b. c. d. e. f. El usuario introducir dos nmeros en los cuadros de texto. Si pulsa el botn Sumar, se calcular la suma. Si pulsa el botn Restar, se calcular la resta. Si pulsa el botn Borrar, se borrarn ambos cuadros de texto. Si elige la opcin del men Calcular-Sumar entonces se calcular la suma. Si elige la opcin del men Calcular-Restar entonces se calcular la resta. 96
Prof. Juregui Sotelo Julio Cesar g. Si elige la opcin del men Calcular-Borrar entonces se borrarn ambos cuadros de texto. h. Si se pulsa enter en alguno de los dos cuadros de texto se debera calcular la suma.
5. Este es un ejemplo en el que al activarse uno de varios eventos distintos se tiene que ejecutar el mismo cdigo. Observa el caso de la suma:
Pulsar Botn Sumar
Activar Calcular Sumar en el men
Calcular la suma y mostrarla en la etiqueta de resultado
Pulsar enter en el primer cuadro de texto
Pulsar enter en el segundo cuadro de texto
6. Para que el cdigo est centralizado, es decir, que aparezca solo una vez, ser necesario construir en la clase un mtodo. Un mtodo en java es el equivalente de una funcin o procedimiento en C. Veamos como hacerlo:
7. Accede al cdigo de tu programa a travs del botn Origen.
8. Un buen sitio para programar tus procedimientos puede ser debajo del constructor. Puedes distinguir fcilmente al constructor porque tiene el mismo nombre que la clase que ests programando, o dicho de otro modo, tiene el mismo nombre que la ventana que ests programando: VentanaCalculos.
97
Este es el constructor
Este es un buen sitio para crear tus propios procedimientos
9. Se va a programar un procedimiento que se encargue de recoger los valores de los cuadros de texto. Calcular la suma de dichos valores, y luego mostrar la suma en la etiqueta de resultados. Los procedimientos en java tienen prcticamente la misma estructura que en C. Programe lo siguiente:
Este es el procedimiento que tienes que introducir en el programa.
98
10. Si observas el cdigo, es el tpico procedimiento de C, cuya cabecera comienza con void y el nombre que le hayas asignado (en nuestro caso Sumar) void Sumar() { .... }
Si estudias las lneas del cdigo, vers que lo que hace es recoger el contenido de los dos cuadros de texto en dos variables de cadena llamadas cad1 y cad2.
Luego convierte dichas cadenas en nmeros que almacena en dos variables enteras llamadas a y b.
Finalmente calcula la suma en una variable s y presenta el resultado en la etiqueta etiResultado.
11. Hay que destacar que este cdigo no pertenece ahora mismo a ningn evento en concreto, por lo que no tiene efecto ninguno sobre el programa. Ser necesario pues asociar los eventos correspondientes con este procedimiento. 12. Interesa que al pulsar el botn Sumar se ejecute la suma, as pues entre en el evento actionPerformed del botn Sumar y aada la siguiente lnea:
Sumar();
13. Como tambin interesa que al pulsar la opcin del men Calcular-Sumar se ejecute la suma, entre en el evento actionPerformed de la opcin del men Sumar y aade de nuevo la siguiente lnea:
Sumar();
14. Tambin se quiere que al pulsar la tecla enter en el cuadro de texto del nmero 1 se ejecute la suma. Por lo tanto, en el evento actionPerformed del cuadro de texto txtNumero1 hay que aadir la siguiente lnea:
Sumar();
99
15. Y como tambin se quiere que al pulsar la tecla enter en el cuadro de texto del nmero 2 se ejecute la suma, tambin habr que introducir en su actionPerformed la siguiente lnea:
Sumar();
16. Antes de continuar, ejecute el programa, introduzca dos nmeros, y compruebe como se calcula la suma al pulsar el botn Sumar, o al activar la opcin del men CalcularSumar, o al pulsar Enter en el primer cuadro de texto, o al pulsar Enter en el segundo cuadro de texto. En cada uno de los eventos hay una llamada al procedimiento Sumar, que es el que se encarga de realizar la suma.
actionPerformed btnSumar
actionPerformed menuSumar
Procedimiento
Sumar() actionPerformed txtNumero1
actionPerformed txtNumero2
17. En el caso de la resta sucede igual. Tenemos que varios eventos distintos deben provocar que se realice una misma operacin. En este caso tenemos lo siguiente:
Pulsar Botn Restar Activar Calcular Restar en el men Calcular la resta y mostrar el resultado.
100
18. Para centralizar el cdigo, crearemos un mtodo Restar que se encargar de hacer la resta de los nmeros introducidos en los cuadros de texto. Este mtodo se puede colocar debajo del anterior mtodo Sumar:
Programa este procedimiento.
19. El cdigo de este procedimiento es prcticamente idntico al del procedimiento Sumar, as que no se comentar. 20. Ahora, es necesario que cuando se activen los eventos indicados antes, estos hagan una llamada al procedimiento Restar para que se efecte la resta. As pues, entre en el evento actionPerformed del botn Restar y aada esta lnea de cdigo: Restar();
21. Igualmente, entre en el evento actionPerformed de la opcin del men Calcular Restar y aada la misma llamada:
101
Prof. Juregui Sotelo Julio Cesar Restar();
22. Ejecute el programa y compruebe como funciona el clculo de la resta, da igual que lo haga pulsando el botn Restar o la opcin del men Restar. Ambos eventos llaman al mismo mtodo:
actionPerformed btnRestar Procedimiento actionPerformed menuRestar
Restar()
23. Finalmente se programar el borrado de los cuadros de texto a travs del botn Borrar y de la opcin del men Borrar. En primer lugar, programa el siguiente mtodo (puedes hacerlo debajo del mtodo Restar):
Programa el procedimiento Borrar...
102
24. Ahora programa las llamadas al procedimiento borrar desde los distintos eventos. En el evento actionPerformed del botn Borrar y en el evento actionPerformed de la opcin del men Borrar programa la siguiente llamada: Borrar();
25. Ejecuta el programa y prueba su funcionamiento.
CONCLUSIN
En java se pueden programar procedimientos al igual que en C. Normalmente, estos procedimientos se programarn debajo del constructor, y tienen la misma estructura que en C.
Se puede llamar a un mismo procedimiento desde distintos eventos, evitando as la repeticin de cdigo.
103
18 EJERCICIO GUIADO. JAVA: LAYOUTS
El problema de la distribucin de elementos en las ventanas
Uno de los problemas que ms quebraderos de cabeza da al programador es el diseo de las ventanas y la situacin de los distintos componentes en ellas.
Para disear ms cmodamente las ventanas, Java proporciona una serie de objetos denominados Layouts, que definen la forma que tendrn los elementos de situarse en las ventanas.
As pues, un Layout define de qu forma se colocarn las etiquetas, botones, cuadros de textos y dems componentes en la ventana que diseamos.
Ejercicio guiado
Diseo Libre
12. Crea un nuevo proyecto en java. 13. Aade una etiqueta y un botn. Muvelos a la posicin que se indica en la imagen. Deben aparecer las lneas gua de color azul que se muestran:
104
14. Las lneas azules que aparecen indican con qu otro elemento est relacionado un componente de la ventana. La situacin de un elemento depender siempre de la situacin del otro. Dicho de otra forma, las lneas azules indican las distancias que siempre se respetarn. Observa la siguiente imagen:
Tanto el botn como la etiqueta estarn siempre a esta distancia del borde derecho de la ventana
El botn siempre estar a esta distancia de la etiqueta
El botn siempre estar a esta distancia del borde inferior de la ventana
105
Prof. Juregui Sotelo Julio Cesar 15. Ejecuta el programa y prueba a ensanchar (o achicar) la ventana por el lado derecho y por el lado inferior. Debes observar como la etiqueta y el botn mantienen sus distancias relativas entre s y con los bordes derecho e inferior de la ventana.
Siempre se mantienen las distancias relativas definidas en el diseo aunque el tamao de la ventana cambie.
16. Este comportamiento de los elementos en la ventana viene dado por una opcin del NetBeans llamada Diseo Libre (Free Design) El Diseo Libre permite que los elementos de una ventana mantengan una distribucin relativa da igual el tamao que tenga la ventana. Dicho de otra forma, los elementos se redistribuyen al cambiar el tamao de la ventana.
El problema del Diseo Libre es el poco control que se tiene sobre los elementos que se aaden a la ventana.
Se puede observar como a veces los elementos no se colocan en la posicin que deseamos o como cambian de tamao de forma inesperada. Todo esto es debido a la necesidad de dichos elementos de mantener unas distancias relativas con otros elementos de la ventana. Cuantos ms elementos tengamos en una ventana, ms difcil ser el colocarlos usando el Diseo Libre. AboluteLayout. Posiciones Absolutas
17. El Diseo Libre es la opcin que est activada por defecto cuando se crea un proyecto en NetBeans. Sin embargo, esta opcin se puede cambiar por distintos Layouts o Distribuciones.
106
Prof. Juregui Sotelo Julio Cesar 18. En el Inspector de tu proyecto pulsa el botn derecho del ratn sobre el objeto JFrame y activa la opcin Establecer Disposicin AbsoluteLayout.
19. El Inspector tendr la siguiente forma ahora:
Como ves, aparece un objeto dentro del JFrame llamado AbsoluteLayout. Este objeto define otra forma de situar los elementos en la ventana. Concretamente, la distribucin AbsoluteLayout permite al programador colocar cada elemento donde l quiera, sin restricciones, sin tener en cuenta distancias relativas.
107
Prof. Juregui Sotelo Julio Cesar 20. Sita la etiqueta y el botn donde quieras. Observa que no aparece ninguna lnea gua que defina distancias relativas:
21. La ventana de definir una distribucin AbsoluteLayout es la facilidad para colocar cada elemento en la ventana (no tendrs los problemas del Diseo Libre). Sin embargo, la desventaja es que los elementos no mantienen una distribucin relativa respecto al tamao de la ventana. 22. Ejecuta el programa y reduce su ancho. Observa lo que ocurre:
Vers que los elementos de la ventana son inamovibles aunque la ventana cambie de tamao. En cambio, en el Diseo Libre los elementos intentaban siempre estar dentro de la ventana.
108
Distribucin en lnea. FlowLayout
23. Practiquemos ahora con otro tipo de distribucin. Accede al Inspector y pulsa el botn derecho del ratn sobre el objeto JFrame. Activa la opcin Establecer Disposicin FlowLayout.
24. Observa como el layout AbsoluteLayout es sustituido por la distribucin FlowLayout. Una elemento solo puede tener un tipo de distribucin a la vez.
109
Prof. Juregui Sotelo Julio Cesar 25. Observa la ventana. Los elementos se han colocado uno detrs de otro. Se han colocado en lnea. Esto es lo que hace el FlowLayout. Fuerza a los distintos elementos a que se coloquen en fila.
26. Si seleccionas el FlowLayout en el Inspector, podrs acceder a sus propiedades (los layout son objetos como los dems) Una de las propiedades del FlowLayout se llama alineacin y permite que los elementos estn alineados a la izquierda, derecha o centro. El FlowLayout tiene una alineacin centro por defecto.
27. El FlowLayout no permite controlar la posicin de los elementos en la ventana, pero s procura que los elementos estn siempre visibles aunque la ventana se cambie de tamao. Ejecuta el programa y observa el comportamiento del FlowLayout al agrandar o achicar la ventana:
En el FlowLayout, los elementos intentan siempre estar dentro de la ventana, aunque esta se cambie de tamao
Distribucin en rejilla. GridLayout
28. Otra distribucin que se puede usar es la distribucin GridLayout. Esta distribucin coloca a los elementos en filas y columnas, como si formaran parte de una tabla. Al aadir esta distribucin es necesario indicar cuantas filas y columnas tendr la rejilla. 29. Cambia el layout del JFrame por un GridLayout: 110
30. Marca el GridLayout y cambia sus propiedades Filas y Columnas. Asigna a la propiedad Filas un 2 y a la propiedad Columnas un 3.
31. Al asignar 2 filas y 3 columnas al GridLayout, conseguiremos que los elementos de la ventana se distribuyan en una tabla como la siguiente:
111
Los distintos elementos se adaptarn al espacio que tienen asignado, y cambiarn de tamao.
32. Ya que solo tienes dos elementos en la ventana (una etiqueta y un botn), aade otros cuatro elementos ms (cuatro botones) para observar como se distribuyen en la cuadrcula.
33. En un GridLayout, los elementos estarn situados siempre en una casilla de la rejilla, ocupando todo su espacio. El programador no tiene mucho control sobre la disposicin de los elementos. 34. Ejecuta el programa y agranda y achica la ventana. Observa como los elementos siempre mantienen su disposicin en rejilla y siempre aparecen dentro de la ventana aunque el tamao de esta vare.
112
Con un GridLayout los elementos aparecen en filas y columnas.
Siempre aparecen dentro de la ventana aunque el tamao de esta cambie.
BorderLayout
35. Otra de las distribuciones posibles es la llamada BorderLayout. Esta distribucin coloca los elementos de la ventana en cinco zonas: i. ii. iii. iv. v. Zona norte (parte superior de la ventana) Zona sur (parte inferior de la ventana) Zona este (parte derecha de la ventana) Zona oeste (parte izquierda de la ventana) Zona centro.
36. Haz clic con el derecho sobre el JFrame y asigna una distribucin BorderLayout.
113
37. Para poder entender el funcionamiento del BorderLayout, se recomienda que el JFrame contenga nicamente 5 botones (elimine los elementos que tiene ahora y aada cinco botones) La ventana tendr un aspecto parecido al siguiente:
114
38. Como se puede observar, cada botn se ha colocado en una zona, y su tamao ha variado hasta ocupar la zona entera. Tenemos un botn en el norte, otro al sur, uno al este, otro al oeste y uno en el centro. El programador no tiene mucho control sobre la disposicin de los elementos en la ventana al usar esta distribucin.
39. Ejecuta el programa y observa como los elementos siempre se mantienen dentro de la ventana aunque esta cambie de tamao.
Con un GridLayout los elementos aparecen zonas.
Siempre aparecen dentro de la ventana aunque el tamao de esta cambie.
115
CONCLUSIN
El diseo de la ventana viene definido por los Layouts o distribuciones.
Diseo Libre Esta distribucin viene activada por defecto en el NetBeans, y define una distribucin de componentes en la que se respetan las distancias entre ellos cuando la ventana cambia de tamao.
AbsoluteLayout En esta distribucin el programador puede colocar cada elemento en la posicin que desee de la ventana. Los distintos elementos mantienen su posicin aunque la ventana cambie de tamao, lo que puede hacer que si la ventana se reduce de tamao algunos elementos no se vean.
FlowLayout En esta distribucin los elementos se colocan uno detrs de otro. Los elementos intentarn estar dentro de la ventana aunque esta se reduzca de tamao.
GridLayout Esta distribucin coloca a los elementos en filas y columnas. Los elementos siempre estarn dentro de la ventana aunque esta se reduzca de tamao.
BorderLayout Esta distribucin coloca a los elementos en zonas. Los elementos siempre estarn dentro de la ventana aunque esta se reduzca de tamao.
116
Prof. Juregui Sotelo Julio Cesar 19 EJERCICIO GUIADO. JAVA: LAYOUTS Y PANELES
Tcnicas de distribucin de elementos en las ventanas
A la hora de disear una ventana se tienen en cuenta dos cosas:
La facilidad a la hora de colocar muchos componentes en la ventana. Que dichos componentes estn siempre visibles independientemente del tamao de la ventana.
La distribucin AbsoluteLayout por ejemplo nos da mucha facilidad a la hora de colocar los elementos en la ventana, pero sin embargo los componentes no se adaptan a los cambios de tamao.
El Diseo Libre en cambio permite crear ventanas en las que sus componentes se recolocan segn el tamao de estas pero a cambio crece la dificultad del diseo.
Para aprovechar las ventajas de los distintos layouts y minimizar sus inconvenientes, es habitual en java crear una estructura de paneles cada uno de ellos con un layout distinto, segn nuestras necesidades.
Normalmente, al JFrame se le asigna un layout que lo divida en zonas, como puede ser el BorderLayout o el GridLayout. Luego, dentro de cada una de estas zonas se introduce un panel (objeto JPanel). Y a cada uno de estos paneles se le asigna el layout que ms le convenga al programador (FlowLayout, Diseo Libre, AbsoluteLayout, etc) Finalmente, dentro de cada panel se aaden los componentes de la ventana.
117
JFrame (BorderLayout o GridLayout)
etc
JPanel 1 (Diseo Libre, AbsoluteLayout o FlowLayout) JPanel 2 (Diseo Libre, AbsoluteLayout o FlowLayout)
Componentes
Componentes
Ejercicio guiado
1. Crea un nuevo proyecto en java. Se pretende crear un proyecto con una ventana de diseo complejo. Para ello sigue los siguiente pasos:
2. En primer lugar, asigna un BorderLayout al JFrame:
118
Prof. Juregui Sotelo Julio Cesar 3. El BorderLayout divide la ventana principal en zonas. Ahora aade un panel (JPanel) a la zona norte de la ventana.
Panel en la zona norte.
4. Cambia el nombre a este panel y llmalo panelTitulo, ya que contendr el nombre del programa.
5. Aade otro panel, esta vez a la parte central. El panel se llamar panelDatos:
119
6. Aade un nuevo panel en la parte sur de la ventana. Su nombre ser panelEstado.
NOTA. A veces resulta complicado agregar un panel en una zona de la ventana cuando tenemos un BorderLayout. Puedes entonces hacer clic con el derecho sobre JFrame en el Inspector y activar la opcin Agregar desde paleta Swing JPanel.
120
7. Si el panel no se coloca en el sitio deseado, se puede seleccionar en el Inspector y activar su propiedad Direccin, e indicar la zona donde se quiere colocar:
El panel debera estar situado finalmente en el sur de la ventana:
121
8. El Inspector tendr la siguiente forma ahora:
9. Aade ahora tu solo un panel en la zona oeste llamado panelBotonera y otro en la zona esta llamado panelVerificacion. El Inspector debera tener la siguiente forma al finalizar:
122
10. Cada panel puede ser diseado de forma individual, simplemente haciendo doble clic sobre l. As pues, empezaremos diseando el panel panelBotonera. Haz doble clic sobre l. 11. En la parte izquierda del NetBeans aparecer nicamente el panelBotonera. Agrndalo para que tenga la siguiente forma:
12. A cada panel se le puede asignar un Layout distinto. A este panel le asignaremos un AbsoluteLayout para poder colocar cada elemento donde quiera. Asigna un AbsoluteLayout al panel haciendo clic con el derecho sobre l en el Inspector. El Inspector debera quedar as:
123
Prof. Juregui Sotelo Julio Cesar 13. Ahora aade cuatro botones al panel. Observa como tienes libertad total para colocar cada botn donde quieras. Procura que el panel quede as:
(No nos vamos a preocupar en este ejercicio de los nombres de los componentes) 14. Ahora disea el panel panelVerificacin haciendo doble clic sobre l. 15. Asgnale tambin un layout AbsoluteLayout. 16. Coloca en l cuatro casillas de verificacin. El aspecto del panel al terminar debe ser parecido al siguiente:
Y el Inspector debe tener un estado similar a este:
124
17. Ahora se disear el panelTitulo. Haz doble clic sobre l. 18. En este caso se le aadir un FlowLayout. Recuerda que este layout hace que cada elemento se coloque uno detrs de otro. 19. Aade al panel dos etiquetas como las que siguen. Ponle un borde a cada una:
El Inspector tendr este aspecto en lo que se refiere al panelTitulo...
20. El panelEstado lo disearemos sin asignar ningn layout, es decir, usando el Diseo Libre. En l aadiremos tres etiquetas de forma que estas mantengan una distancia relativa con respecto al 125
Prof. Juregui Sotelo Julio Cesar lmite derecho del panel. Dicho de otra forma, que siempre estn pegadas a la parte derecha del panel:
Observa las lneas gua. Indican que las etiquetas dependen de la parte derecha del panel. A su vez cada una depende de la otra. Es como si estuvieran enganchadas, como los vagones de un tren.
21. El panelDatos lo vamos a complicar un poco. Haz doble clic sobre l para disearlo y asgnale un GridLayout.
22. Marca el GridLayout y asgnale 2 filas y 2 columnas, para que interiormente tenga forma de una rejilla como esta:
23. A cada una de las divisiones del GridLayout del panelDatos le asignaremos un nuevo panel. Aade al panelDatos cuatro paneles. Esto lo puedes hacer fcilmente haciendo clic con el botn derecho del ratn sobre el panelDatos en el Inspector y eligiendo la opcin Aadir desde paleta Swing JPanel. El aspecto del inspector debera ser como el que sigue, en lo que se refiere al panelDatos:
126
24. Asignaremos a cada uno de los cuatro paneles los siguientes nombres: panelEtiqueta1, panelCuadro1, panelEtiqueta2, panelCuadro2. El panel quedar as en el Inspector.
As pues, el panel panelDatos tiene forma de rejilla con cuatro celdas, y en cada celda hay un panel. Puede imaginarse el panelDatos as:
panelDatos
PanelEtiqueta1 PanelCuadro1 PanelEtiqueta2 PanelCuadro2
25. Ahora aada al panelEtiqueta1 y al panelEtiqueta2 sendas etiquetas. Y al panelCuadro1 y panelCuadro2 sendos cuadros de textos. El panel panelDatos debe quedar as:
127
26. Finalmente ejecuta el programa y comprueba como se comportan los elementos segn el panel donde se encuentre y el layout asignado a cada uno.
CONCLUSIN
Para el diseo de ventanas muy complejas, ser suelen definir layouts que dividan en zonas el JFrame, como por ejemplo el BorderLayout o el GridLayout.
Dentro de cada una de dichas zonas se aade un JPanel, al que se le asigna un AbsoluteLayout, un FlowLayout o se mantiene el Diseo Libre.
Es posible asignar a un panel un layout de zonas, como el GridLayout, y, a su vez, introducir en l nuevos paneles, y as sucesivamente.
128
Prof. Juregui Sotelo Julio Cesar 20 EJERCICIO GUIADO. JAVA: DILOGOS
Cuadros de Dilogo
Un cuadro de dilogo es un cuadro con opciones que aparece normalmente cuando se activa una opcin del men principal del programa.
Los cuadros de dilogo tienen forma de ventana aunque no poseen algunas caractersticas de estas. Por ejemplo, no pueden ser minimizados ni maximizados.
Los cuadros de dilogo, aparte de las opciones que muestran, suelen contener dos botones tpicos: el botn Aceptar y el botn Cancelar. El primero de ellos da por vlidas las opciones elegidas y cierra el cuadro de dilogo. El segundo simplemente cierra el cuadro de dilogo sin hacer ninguna modificacin.
He aqu algunos ejemplos de cuadros de dilogo del programa Word:
129
Para crear cuadros de dilogo en Java, se usa un tipo de objetos llamado JDialog. Estos objetos pueden ser diseados como si fueran ventanas, aunque representan realmente cuadros de dilogo.
Ejercicio guiado
1. Crea un nuevo proyecto en java. 2. Disea el JFrame de forma que la ventana tenga el siguiente aspecto:
Los elementos de la ventana tendrn los siguientes nombres:
Cuadro de texto de unidades: txtUnidades. Cuadro de texto de precio: txtPrecio. Etiqueta con borde del total: etiTotal. Botn Calcular: btnCalcular. Botn Configuracin: btnConfiguracion.
3. Se pretende que cuando se pulse el botn Calcular se calcule el total de la venta (esto se har luego) Para hacer el clculo se tendrn en cuenta el IVA y el Descuento a aplicar. Estos dos valores sern variables globales, ya que se usarn en distintos lugares del programa.
130
Prof. Juregui Sotelo Julio Cesar 4. As pues entra en el cdigo y declara una variable global iva y otra descuento tal como se indica a continuacin (recuerda que las variables globales se colocan justo despus de la lnea donde se define la clase principal public class):
Variables globales
5. Cuando el programa arranque, interesar que el iva por defecto sea 0, y que el descuento por defecto sea 0 tambin, as que en el constructor, inicializaremos las variables globales iva y descuento a 0:
Inicializacin de variables globales
6. Estamos ya preparados para programar el botn btnCalcular. Entra en su actionPerformed y all se programar la realizacin del clculo de la siguiente forma:
double unidades;
131

double precio; double total; double cantiva; double cantdes; //total //cantidad iva //cantidad descuento
double totalsiniva; //total sin iva
//Recojo los datos de los cuadros de textos (convirtiendolos a nmeros) unidades = Double.parseDouble(txtUnidades.getText()); precio = Double.parseDouble(txtPrecio.getText());
//Calculo el total sin iva, la cantidad de iva y la cantidad de descuento totalsiniva=precio*unidades; cantiva=totalsiniva*iva/100; cantdes=totalsiniva*descuento/100;
//Ahora calculo el precio total: total = totalsiniva+cantiva-cantdes;
//Coloco el total en la etiqueta: etiTotal.setText(""+total);
7. Puedes ya ejecutar el programa y comprobar que el botn Calcular funciona, aunque el clculo que realiza lo hace con un iva 0 y un descuento 0. 8. A continuacin se programar el botn Configuracin de forma que nos permita decidir qu iva y qu descuento queremos aplicar. Este botn mostrar un CUADRO DE DILOGO que permita al usuario configurar estos datos.
132
Prof. Juregui Sotelo Julio Cesar 9. Para aadir un cuadro de dilogo al proyecto, se tiene que aadir un objeto del tipo JDialog sobre el JFrame.
10. Los JDialog son objetos ocultos, es decir, objetos que se colocan en la parte del Inspector llamada Otros Componentes, al igual que sucede con los mens contextuales o los JFileChooser. Observa tu inspector, all vers el JDialog que has aadido:
11. Cmbiale el nombre. Lo llamaremos dialogoConfiguracion. 12. Los dilogos normalmente traen por defecto el layout BorderLayout. Para nuestro ejemplo cambiaremos el layout del JDialog por el Diseo Libre:
133
13. Los JDialog se pueden disear independientemente, al igual que los JPanel. Solo tienes que hacer doble clic sobre el dialogoConfiguracion (en el inspector) y este aparecer en el centro de la ventana. 14. As pues debes disear el dialogoConfiguracion para que quede de la siguiente forma:
Los elementos del cuadro de dilogo tienen los siguientes nombres:
El cuadro de texto del Iva: txtIva. El cuadro de texto del Descuento: txtDescuento. El botn Aceptar: btnAceptar. El botn Cancelar: btnCancelar. Si observas el Inspector debe tener el siguiente aspecto:
134
Prof. Juregui Sotelo Julio Cesar 15. Se ha dicho que cuando se pulse el botn Configuracin en la ventana principal, debe aparecer el cuadro de dilogo dialogoConfiguracion, que acabas de disear:
Haces clic sobre Configuracin y aparece el dilogo
16. Para conseguir esto, debes programar el actionPerformed del botn btnConfiguracion de la siguiente forma:
dialogoConfiguracion.setSize(250,200); dialogoConfiguracion.setLocation(100,100); dialogoConfiguracion.setVisible(true);
17. El cdigo anterior hace lo siguiente: 135
Prof. Juregui Sotelo Julio Cesar i. ii. iii. A travs del mtodo setSize se asigna un tamao de 250 x 200 al cuadro de dilogo. A travs del mtodo setLocation se determina que el cuadro de dilogo aparecer en la posicin (100, 100) de la pantalla. A travs del mtodo setVisible hacemos que el cuadro de dilogo se muestre.
18. Ejecuta el programa y observa lo que sucede cuando pulsas el botn Configurar. Debera aparecer el cuadro de dilogo en la posicin programada y con el tamao programado:
19. Los botones Aceptar y Cancelar del cuadro de dilogo an no hacen nada. As que los programaremos. Empezaremos por el ms sencillo, el botn Cancelar. 20. El botn Cancelar de un cuadro de dilogo simplemente cierra dicho cuadro de dilogo. Para ello, debes aadir el siguiente cdigo en el actionPerformed del botn Cancelar del dilogo:
dialogoConfiguracion.dispose();
136
El mtodo dispose se usa para cerrar un cuadro de dilogo. Tambin se puede usar con un JFrame para cerrarlo.
21. Ejecuta el programa de nuevo y comprueba el funcionamiento del botn Cancelar del cuadro de dilogo. 22. Ahora se programar el botn Aceptar. Cuando el usuario pulse este botn, se confirmar el valor del iva y del descuento que haya introducido. Es decir, se traspasarn los valores introducidos en los cuadros de texto txtIva y txtDescuento a las variables globales iva y descuento. Una vez que se haya hecho esto, el cuadro de dilogo se debe cerrar.
23. Este es el cdigo que hace lo anterior. Debe programarlo en el actionPerformed del botn Aceptar:
iva = Double.parseDouble(txtIva.getText()); descuento=Double.parseDouble(txtDescuento.getText()); dialogoConfiguracion.dispose();
24. Observe el cdigo. Primero se traspasa los valores de los cuadros de texto a las variables globales y luego se cierra el cuadro de dilogo. 25. Compruebe el funcionamiento del programa de la siguiente forma: a. Ejecute el programa. b. Introduzca 5 unidades y 20 de precio. c. Si pulsa calcular, el total ser 100. (No hay ni iva ni descuento al empezar el programa) d. Ahora pulse el botn Configuracin, e introduzca un iva del 16. El descuento djelo a 0. Acepte. e. Ahora vuelva a calcular. Observe como ahora el total es 116, ya que se tiene en cuenta el iva configurado. f. Pruebe a configurar un descuento y vuelva a calcular.
26. Se pretende ahora mejorar un poco el cuadro de dilogo, aadindole un ttulo. Seleccione el cuadro de dilogo en el Inspector y luego busque su propiedad title. En ella escriba Configuracin de iva y descuento. 27. Vuelva a ejecutar el programa. Observe la barra de ttulo del cuadro de dilogo: 137
28. Ahora se estudiar el concepto de cuadro de dilogo modal y cuadro de dilogo no modal.
Un cuadro de dilogo no modal. Es aquel que permite activar la ventana desde la que apareci. Los cuadros de dilogo aadidos a un proyecto son por defecto no modales.
29. Ejecuta el programa y prueba a hacer lo siguiente: a. Pulsa el botn Configurar. Aparecer el cuadro de dilogo. b. Pulsa sobre la ventana.
Pulsa sobre la ventana.
138
Prof. Juregui Sotelo Julio Cesar c. Observars que la ventana se activa, colocndose sobre el cuadro de dilogo.
La ventana se activa colocndose por encima del cuadro de dilogo.
d. Esto es posible gracias a que el cuadro de dilogo es no modal. e. A veces, puede ser interesante que se active la ventana pero que el cuadro de dilogo siga delante de ella. Para conseguir esto, es necesario activar la propiedad del cuadro de dilogo llamada alwaysOnTop. Activa esta propiedad:
f.
Ahora ejecuta el programa de nuevo y haz que se visualice el cuadro de dilogo de configuracin. Podrs comprobar que se puede activar la ventana e incluso escribir en sus cuadros de textos, y que el cuadro de dilogo sigue visible:
139
Se puede activar la ventana trasera, e incluso escribir en ella. Esto es gracias a que el cuadro de dilogo es no modal.
Por otro lado, el cuadro de dilogo sigue mostrndose delante de la ventana. Esto es gracias a la propiedad alwaysOnTop
g. Es muy comn, cuando tenemos un cuadro de dilogo no modal, usar la propiedad alwaysOnTop, para que siempre aparezca delante de la ventana.
30. Ahora se estudiar el concepto de cuadro de dilogo modal.
Un cuadro de dilogo modal es aquel que no permite que se active otra ventana hasta que este no se haya cerrado.
31. Para convertir nuestro cuadro de dilogo en modal, ser necesario que lo selecciones en el inspector y busques la propiedad modal. Debes activar esta propiedad.
32. Ahora ejecuta el programa comprueba lo siguiente: 140
Prof. Juregui Sotelo Julio Cesar a. Haz que se visualice el cuadro de dilogo de configuracin. b. A continuacin intenta activar la ventana haciendo clic sobre ella. Vers como no es posible activarla. Es ms, intenta escribir en sus cuadros de texto. No ser posible hacerlo. (Incluso observars un parpadeo en el cuadro de dilogo avisndote de ello). Esto es debido a que ahora nuestro cuadro de dilogo es modal.
Aunque intentes activar la ventana o escribir en ella, no podrs, ya que el cuadro de dilogo es modal.
Incluso vers un parpadeo en el cuadro de dilogo cuando intentas activar la otra ventana.
Se podra decir que un cuadro de dilogo modal es un acaparador, y que no te deja usar otro elemento hasta que no acabes con l.
Solo cuando cierres el cuadro de dilogo podrs seguir trabajando con la ventana.
c. Solo cuando pulses, Aceptar, o Cancelar, o cierres el cuadro de dilogo, podrs seguir trabajando con tu ventana.
141
Prof. Juregui Sotelo Julio Cesar CONCLUSIN
Los Cuadros de Dilogo son ventanas simplificadas que muestran distintas opciones al usuario.
Los objetos JDialog son los que permiten la creacin y uso de cuadros de dilogo en un proyecto java.
Para visualizar un JDialog ser necesario llamar a su mtodo setVisible. Tambin son interesantes los mtodos setSize para asignarles un tamao y setLocation para situar el cuadro de dilogo en la pantalla.
Para cerrar un JDialog ser necesario invocar a su mtodo dispose.
Existen dos tipos de cuadros de dilogo: los modales y no modales.
Los cuadros de dilogo modales no permiten que se active otra ventana hasta que el cuadro de dilogo no se haya cerrado.
Los cuadros de dilogo no modales permiten trabajar con otra ventana a pesar de que el propio cuadro de dilogo no haya sido cerrado.
142
Prof. Juregui Sotelo Julio Cesar 21 EJERCICIO GUIADO. JAVA: DISEO DE FORMULARIOS DESDE CDIGO
La Ventana de Diseo
La ventana de diseo es una gran herramienta que nos permite disear formularios de forma relativamente sencilla. Simplemente tenemos que aadir los componentes del formulario: botones, etiquetas, cuadros de textos, etc, y cambiar sus propiedades segn nos interese.
Todo esto tiene un cdigo asociado que se genera de forma automtica, y del que no nos hemos preocupado hasta el momento.
Por ejemplo, cada vez que aades un botn o una etiqueta, se generan automticamente las instrucciones de cdigo que permiten crear dicho botn o dicha etiqueta. Tambin se genera el cdigo que permite cambiar el texto del botn, o cambiar el texto de la etiqueta.
Un buen ejercicio para comprobar esto puede ser el siguiente:
Ejercicio guiado 1.
1. Crea un proyecto y aade en su ventana un botn (JButton), una etiqueta (JLabel) y un cuadro de texto (JTextField). 2. El nombre del botn ser btnBoton, el de la etiqueta etiEtiqueta y el del cuadro de texto txtCuadroTexto. 3. A continuacin asigna un texto a cada elemento. La ventana final podra tener un aspecto como el que sigue:
143
4. Todas estas operaciones que has realizado tienen asociado unas instrucciones de cdigo que se han generado automticamente. Para estudiar estas instrucciones, activa el botn Origen en la parte superior de la pantalla:
5. En el cdigo, observars una lnea llamada Cdigo Generado. Esta lnea est sealada en color azul (al igual que todas las instrucciones generadas automticamente) Observars que tiene un + en la parte izquierda. Si haces clic sobre el signo + aparecer el cdigo generado automticamente:
144
Haz clic en el + para ver el cdigo generado.
6. El cdigo generado (sealado en azul) no puede ser modificado, sin embargo es interesante estudiarlo para entenderlo. En l puedes encontrar como se crean los componentes, como se asigna el texto a stos etc.
Aqu se crea el botn, la etiqueta y el cuadro de texto
Aqu se asigna el texto a cada elemento
145
ETC
En esta explicacin guiada, se disear el formulario entero directamente desde cdigo, sin usar la ventana de diseo. De esta forma, se podr entender mejor la generacin de cdigo del NetBeans y se tendr ms control sobre los componentes.
Ejercicio guiado 2
A. CREACIN DEL PROYECTO
1. Crear un nuevo proyecto con las siguientes caractersticas: a. El nombre del proyecto ser OPERACIONES. b. El nombre del paquete ser VENTANAS. c. El nombre del formulario ser VENTANAPRINCIPAL. El aspecto que tendr la ventana de proyectos debe ser el siguiente:
Nombre del proyecto.
Nombre del paquete.
Nombre del formulario.
146
2. Una vez creado el proyecto, iremos directamente a la ventana de cdigo, pulsando el botn Origen. No usaremos la ventana de diseo en este proyecto.
B. ESTRUCTURA DEL CDIGO (estructura de una clase)
3. Analizaremos el cdigo del programa ahora. Empezaremos por arriba:
En la parte superior del cdigo vers un comentario.
En este comentario aparece el nombre del fichero que contiene el cdigo, que como puedes observar tiene el mismo que el del JFrame.
Observars tambin fecha de creacin del fichero. Tambin aparece la una instruccin que indica que este fichero (ventanaprincipal.java) pertenece al paquete ventanas.
Tambin vers otro comentario donde aparece el nombre del autor. Este comentario se puede cambiar para que aparezca tu nombre.
4. Un proyecto en java est formado por mdulos denominados CLASES. El proyecto que acabamos de crear tiene un solo mdulo: el JFrame que define la ventana principal, llamado precisamente ventanaprincipal. Por tanto, se puede decir que nuestro proyecto tiene una clase llamada ventanaprincipal.
147
El proyecto operaciones tiene una clase llamada ventanaprincipal, que pertenece al paquete ventanas.
5. Para programar una clase se sigue la siguiente sintaxis: public class nombredelaclase {
programacin de la clase }
6. Esto lo puedes observar claramente en el cdigo de tu proyecto:
148
Programacin de la clase ventanaprincipal
7. Dentro de la clase, tenemos una serie de funciones y procedimientos llamados MTODOS. Es en los mtodos donde se programan los eventos que pueden suceder sobre el formulario. 8. Hay un mtodo especial muy importante denominado CONSTRUCTOR. Dentro de este mtodo se programa el diseo de la ventana y las caractersticas iniciales de la ventana. El constructor se puede distinguir fcilmente porque tiene el mismo nombre que la clase. En nuestro ejemplo, ventanaprincipal.
149
Prof. Juregui Sotelo Julio Cesar Observars que el constructor contiene una llamada a un mtodo llamado initComponents. El mtodo initComponents define caractersticas iniciales de la ventana, y es cdigo generado automticamente. Si quieres verlo, solo tienes que desplegar la parte de Cdigo Generado:
Clic aqu para ocultar el cdigo generado
El mtodo initComponents al que hace referencia el constructor es un mtodo generado automticamente, y no puede ser modificado.
Puedes verlo dentro de la seccin de Cdigo Generado.
Este mtodo define algunas caractersticas iniciales de la ventana.
El contenido del mtodo initComponents no resulta interesante para el ejercicio que estamos realizando, as que puedes ocultar de nuevo el Cdigo Generado, haciendo clic en el smbolo menos -
9. Otro mtodo importante que hay que mencionar es el mtodo main. Este mtodo es el que se ejecuta cuando arranca el programa. Se puede decir que el programa parte de aqu. La tarea que desempea este mtodo es la de generar la ventana principal y mostrarla en pantalla. 150
El mtodo main, es similar a la funcin main del lenguaje C. En el caso del java, el NetBeans genera automticamente el mtodo main, de forma que no tendremos que hacer cambios en l.
C. DISEO DE LA VENTANA DESDE CDIGO
Vamos ahora a disear la ventana de nuestro programa (sin usar la ventana de diseo, solo a partir de cdigo). Al final de esta explicacin, la ventana del proyecto tendr el siguiente aspecto:
Para conseguir esto, sigue los siguientes pasos:
10. Para realizar el diseo de la ventana, crearemos un mtodo propio al que llamaremos por ejemplo CreacionVentana. Un buen sitio para colocar este mtodo puede ser debajo del constructor:
El mtodo donde disearemos nuestra ventana
11. Lo primero que se va a hacer es definir caractersticas propias de la ventana, como por ejemplo su ttulo, tamao, etc. Recuerda que la forma de hacer referencia a la propia ventana es a travs de la palabra reservada this.
151
Prof. Juregui Sotelo Julio Cesar As pues, programa lo siguiente dentro del mtodo CreacionVentana:
Este cdigo hace lo siguiente:
Usa el mtodo setTitle de la ventana para definir el texto de la barra de ttulo. Usa el mtodo setSize de la ventana para definir un tamao de 500x300. Usa el mtodo setLocation de la ventana para definir la posicin de la ventana en la posicin (100,100) de la pantalla.
Con setTitle cambias la barra de ttulo
Con setLocation decides la posicin de la ventana
Con setSize defines el ancho y alto de la ventana
152
Prof. Juregui Sotelo Julio Cesar 12. Para que esto tenga efecto, es necesario que el mtodo CrearVentana sea llamado desde el constructor, al igual que sucede con el mtodo initComponents:
13. Ya puedes ejecutar el programa. En el momento en que se ejecuta el programa, el constructor llama al mtodo CreacionVentana y se definen las caractersticas programadas.
14. Ahora vamos a empezar a aadir componentes a la ventana. Concretamente, empezaremos creando la etiqueta que contiene el texto Nmero 1: y luego definiremos algunas caractersticas propias para finalmente situarla en la ventana. Al comienzo de la clase, despus del public class, donde se suelen definir las variables globales, aade el siguiente cdigo:
Este cdigo declara una variable de tipo JLabel (etiqueta) y le da el nombre etiNum1.
153
Prof. Juregui Sotelo Julio Cesar 15. Al escribir este cdigo, aparecer un error en la lnea, ya que ser necesario importar la librera donde se encuentra el tipo de objeto JLabel. Podrs usar la bombilla del NetBeans para agregar el import correspondiente automticamente. 16. Los imports aparecern en la parte superior del cdigo. Puedes observarlo:
Importacin de la librera para el objeto JLabel, que define las etiquetas.
(Agregada automticamente al pulsar la bombilla del NetBeans)
17. Ahora agrega este cdigo a tu mtodo CreacionVentana:
18. La explicacin del cdigo es la siguiente: La primera lnea construye la etiqueta llamada etiNum1 que fue delarada antes. etiNum1 = new JLabel();
Generalizando: para crear un objeto llamado xxx del tipo tipoobjeto, se tendr que hacer lo siguiente: o En la zona de las variables globales se declarar la variable del objeto de la siguiente forma: 154
Prof. Juregui Sotelo Julio Cesar tipoobjeto xxx;
Luego, dentro de la clase, se construye el objeto siguiendo la siguiente sintaxis: xxx = new tipoobjeto();
En el ejemplo, la etiqueta creada, cuyo nombre es etiNum1, tiene que contener el texto Nmero 1:. Esto lo hacemos con el tpico mtodo setText: etiNum1.setText(Nmero 1: );
Hay que definir la posicin que tendr el objeto y el tamao. Para ello, se usar el mtodo setBounds. Este mtodo recibe la posicin (x, y) del objeto y el ancho y el alto. En el ejemplo, la etiqueta est situada en la posicin (10,10) de la ventana y tiene un ancho de 100 y un alto de 20: etiNum1.setBounds(10,10,100,20);
Finalmente, hay que colocar la etiqueta en el panel de contenidos de la ventana. Para ello, se usa el mtodo add del panel de contenidos. Recuerda que para obtener este panel se usa el mtodo getContentPane: this.getContentPane().add(etiNum1);
19. Es buena idea que ejecutes el programa para ver el aspecto de la ventana ahora.
20. Hemos aadido una etiqueta. Ahora aadiremos la siguiente. Para ello, primero tienes que declarar la etiqueta en la zona de las variables globales:
155
Prof. Juregui Sotelo Julio Cesar 21. Luego, en el mtodo ConstruirVentana, aadiremos el siguiente cdigo:
22. Este cdigo es prcticamente igual al anterior. En l se constuye la etiqueta declarada antes con el nombre etiNum2. Luego se le asigna el texto Nmero 2:, luego se usa el mtodo setBounds para situarla en la posicin (10, 60) y asignarle un ancho de 100 y un alto de 20. Finalmente se aade la etiqueta al panel de contenidos de la ventana. 23. Ejecuta el programa y observa el aspecto de la ventana ahora:
24. Sigamos aadiendo elementos. Ahora aadiremos un cuadro de texto llamado txtNum1. Primero declara la variable del cuadro de dilogo en la zona de variables globales:
156
Tendrs que agregar el import correspondiente para el tipo de objeto JTextField.
25. Luego aade el siguiente cdigo en el mtodo CreacionVentana:
26. Este cdigo realiza lo siguiente: La primera lnea construye el cuadro de texto llamado txtNum1. Los JTextField son objetos del tipo cuadro de texto. Esta lnea se subrayar en rojo ya que ser necesario aadir el import para la librera de los JTextField. La siguiente lnea introduce la cadena 0 dentro del cuadro de texto. La siguiente lnea asigna la posicin y el tamao a travs del mtodo setBounds. Y finalmente, la ltima lnea aade el cuadro de texto al panel de contenidos de la ventana.
27. Ejecuta el programa y comprueba el funcionamiento de este cdigo. 28. Ahora se aadir un nuevo cuadro de texto llamado txtNum2. El cdigo es similar. Declara la variable global:
157
29. Y ahora aade el cdigo que construye el objeto en el mtodo ConstruirVentana. Este cdigo es similar al del cuadro de texto anterior. Solo cambia el nombre del objeto y la posicin donde se colocar:
30. Ejecuta el programa y comprueba como va el diseo de la ventana:
158
Prof. Juregui Sotelo Julio Cesar 31. Ahora le toca el turno a los botones. Primero declararemos una variable del tipo JButton en la zona de variables globales (ser necesario aadir el import correspondiente a la clase JButton a travs de la bombilla). El botn se llamar btnSumar:
32. Y a continuacin construiremos y le daremos forma al botn, aadiendo el siguiente cdigo en el mtodo ConstruirVentana:
33. La explicacin del cdigo anterior es similar a los anteriores: La primera lnea construye el botn btnSumar. A continuacin se asigna el texto Sumar al botn. Luego se asigna la posicin y el tamao del botn con el mtodo setBounds. Finalmente se aade el botn al panel de contenido de la ventana.
34. Ejecuta el programa y observa el aspecto de la ventana. 35. Ahora se aadir otro botn llamado btnRestar. Declara la variable JButton:
159
36. Tienes que escribir el siguiente cdigo:
37. El cdigo es prcticamente igual que el del primer botn. Solo cambia el nombre del botn, el texto y la posicin y tamao del botn. 38. Ejecuta el programa para ver como queda la ventana.
160
161
Prof. Juregui Sotelo Julio Cesar CONCLUSIN
La ventana de diseo de NetBeans es una herramienta que nos permite disear las ventanas sin tener que programar cdigo.
Es posible prescindir de la ventana de diseo y realizar todo el diseo de la ventana programando.
El diseo de la ventana se tiene que hacer en el constructor de la clase.
Los componentes de una ventana son variables globales cuyo tipo se corresponde a distintas clases de objetos: JLabel, JTextField, JButton, etc...
Para construir un objeto hay que declararlo como una variable global:
TipoObjeto NombreObjeto;
Y luego, dentro de la clase, construirlo, usando la siguiente sintaxis:
NombreObjeto = new TipoObjeto();
Luego se pueden usar distintos mtodos del objeto para trabajar con l.
162

Tutorial de Swing

Transféré par

Informations du document

Titre original

Copyright

Formats disponibles

Partager ce document

Partager ou intégrer le document

Options de partage

Avez-vous trouvé ce document utile ?

Ce contenu est-il inapproprié ?

Droits d'auteur :

Formats disponibles

Tutorial de Swing

Transféré par

Droits d'auteur :

Formats disponibles

Prof.

Juregui Sotelo Julio Cesar

Prof. Juregui Sotelo Julio Cesar

String mensaje="Animales elegidos: "; if (chkPerro.isSelected()) { mensaje=mensaje+"Perro "; }

if (chkGato.isSelected()) { mensaje=mensaje+"Gato "; }

if (chkRaton.isSelected()) { mensaje=mensaje+"Raton "; }

Prof. Juregui Sotelo Julio Cesar

Prof. Juregui Sotelo Julio Cesar

02 EJERCICIO GUIADO. JAVA: BOTONES DE OPCIN

Prof. Juregui Sotelo Julio Cesar

5. Tu ventana debe quedar ms o menos as:

Prof. Juregui Sotelo Julio Cesar

e. Haz lo mismo con los botones optVerde y optAzul.

El mtodo setSelected hace que se pueda activar o desactivar un botn de opcin.

Prueba el programa. Observa como la opcin Rojo est activada inicialmente.

Prof. Juregui Sotelo Julio Cesar String mensaje="Color elegido: ";

if (optRojo.isSelected()) { mensaje=mensaje+"Rojo"; } else if (optVerde.isSelected()) { mensaje=mensaje+"Verde"; } else if (optAzul.isSelected()) { mensaje=mensaje+"Azul"; }

Prof. Juregui Sotelo Julio Cesar

03 EJERCICIO GUIADO. JAVA: CUADROS DE LISTA

Prof. Juregui Sotelo Julio Cesar

Prof. Juregui Sotelo Julio Cesar

mensaje="El color seleccionado es: "+lstColores.getSelectedValue().toString(); etiResultado.setText(mensaje);

Prof. Juregui Sotelo Julio Cesar

if (lstColores.getSelectedIndex()==-1) { mensaje="No hay un color seleccionado.";

Prof. Juregui Sotelo Julio Cesar

7. Ejecuta el programa y observa el funcionamiento del desplegable...

Prof. Juregui Sotelo Julio Cesar

String mensaje="El color elegido es ";

Prof. Juregui Sotelo Julio Cesar

Prof. Juregui Sotelo Julio Cesar

Se escribe aqu y se pulsa enter

Prof. Juregui Sotelo Julio Cesar

Prof. Juregui Sotelo Julio Cesar

modelo.addElement("Ana"); modelo.addElement("Marta"); modelo.addElement("Jose");

g. Finalmente asociamos el modelo creado al cuadro de lista de la siguiente forma: lstNombres.setModel(modelo);

Click y cambia el listado.

11. Ejecuta el programa:

Prof. Juregui Sotelo Julio Cesar

Click y aparece el elemento seleccionado en la etiqueta.

El objeto modelo es el que realmente contiene los datos de la lista.

Cuadro de lista Modelo Datos

5. En el evento actionPerformed del botn Pares, programa lo siguiente:

DefaultComboBoxModel modelo = new DefaultComboBoxModel();

for (i=0;i<10;i+=2) { modelo.addElement("N "+i);

Prof. Juregui Sotelo Julio Cesar

DefaultComboBoxModel modelo = new DefaultComboBoxModel();

7. Ejecuta el programa y observa el funcionamiento del botn Pares.

Prof. Juregui Sotelo Julio Cesar

Se pulsa y se rellena automticamente

8. El botn Impares es similar. Programa su actionPerformed como sigue:

for (i=1;i<10;i+=2) { modelo.addElement("N "+i); } cboNumeros.setModel(modelo);

El objeto modelo es el que realmente contiene los datos del combo.

Combo Modelo Datos

Prof. Juregui Sotelo Julio Cesar 07 EJERCICIO GUIADO. JAVA: TOGGLEBUTTONS

3. Prueba el programa y comprueba el funcionamiento de los botones JToggleButton:

Observa como al pulsar los JToggledButton estos se quedan pulsados.

Si se vuelven a activar se despulsan.

5. As pues, se programar el actionPerformed del botn Calcular de la siguiente forma:

//Recojo datos desde la ventana:

precio_base = Double.parseDouble(txtPrecioBase.getText()); precio_instal = Double.parseDouble(etiPrecioInstalacion.getText()); precio_for = Double.parseDouble(etiPrecioFormacion.getText()); precio_ali = Double.parseDouble(etiPrecioAlimentacionBD.getText());

//Ahora que tengo los datos, puedo hacer clculos.

if (tbtnInstalacion.isSelected()) { //Si se seleccion instalacin precio_total = precio_total+precio_instal; }

Prof. Juregui Sotelo Julio Cesar