INTERFAZ GRÁFICO DE USUARIO

Transcripción

1 Programación JAVA INTERFAZ GRÁFICO DE USUARIO 2 - Referencia Bibliográfica Autor Adolfo Aladró García Publicado en la revista Solo Programadores num. 118 Ejemplos copiados del libro Java 2 - Curso de Programación Fco. Javier Ceballos. RA-MA Sumario JFC/Swing cuenta con administradores de diseño (layout managers) que eximen al programador de resolver aspectos tales como la colocación de los elementos en el espacio disponible, la redistribución de éstos cuando la ventana principal cambia de tamaño, etc. Índice de Contenidos 2 - Creacion de interfaces con JFC/Swing [II] 2.1 Administradores de diseño BorderLayout BoxLayout FlowLayout CardLayout GridBagLayout GridLayout Codigo Completo del ejercicio sobre BorderLayout 2.2 Utilización de varios administradores de diseño Codigo Completo del ejercicio sobre JViewHTMLCode t 2.3 Conclusiones 1

2 2.1 Administradores de diseño Tal y como se adelantó en la entrega anterior los administradores de diseño son los encargados del tamaño y ubicación de los componentes que conforman una interfaz. Por lo general una interfaz está formada por varios componentes agrupados dentro de un contenedor. A su vez cada uno de esos componentes puede ser contenedor de más componentes. Todos los contenedores cuentan con un administrador de diseño que se aplica cuando no se ha definido otro. De esta manera la aplicación JFC/Swing se construye y determina la forma en la que cada elemento se coloca en la ventana principal teniendo en cuenta aspectos tales como el tamaño disponible, la resolución del monitor o las características del sistema de ventanas de la plataforma donde se ejecuta. Además, cuando el usuario cambia el tamaño de la ventana, por ejemplo, los distintos administradores de diseño son responsables de redistribuir y adaptar el tamaño de cada uno de los componentes. La clase java.awt.container, de la que heredan todos los contenedores, cuenta con el método que se define de la siguiente forma: Public void setlayout(layoutmanager mgr) Éste permite establecer el administrador de diseño que desea emplearse. Todas las clases correspondientes a administradores de diseño implementan la interfaz java.awt.layoutmanager. Así por ejemplo se puede establecer el administrador de diseño de un contenedor del tipo JPanel de la siguiente forma: JPanel pnpanel = new Jpanel(); FlowLayout fl = new FlowLayout(); PnPanel.setLayout(fl); Los administradores de diseño más importantes del API estándar de JFC/Swing son los siguientes:. BorderLayout BoxLayout CardLayout FlowLayout GridBagLayout GridLayout Seguidamente se estudiarán todos ellos con el fin de conocer todas las posibilidades que existen a la hora de "diseñar" (no sólo el aspecto sino además el comportamiento) las interfaces BorderLayout Este contenedor establece cinco zonas dentro del área disponible denominadas PAGE_START, PAGE_END, LINE_START, LINE_END y CENTER. Estos nombres se corresponden con propiedades de la clase. En el listado 1 se define un array de componentes de tipo JLabel, componente que sirve para mostrar etiquetas. 2

3 Listado 1 jlabel[0] = new JLabel("Etiqueta 1"); contentpane.add(jlabel[0]); jlabel[1] = new JLabel("Etiqueta 2");... Cada etiqueta del ejemplo muestra la cadena de texto correspondiente al lugar que ocupa dicho componente según el administrador de diseño. Además se emplean los métodos setbackground, sethorizontalaligment y setopaque para establecer el color de fondo, la alineación del texto y la opacidad de la etiqueta respectivamente. Después de definir los componentes se obtiene una referencia al contenedor principal de la aplicación utilizando el método setcontentpane. Inmediatamente después se crea una nueva instancia de la clase BorderLayout y se pasa como parámetro en el método setlayout del contenedor: Container contentpane= getcontentepane(); BorderLayout bl = new BorderLayout(); ContentPane.setLayout(bl); Finalmente se van añadiendo los componentes con el método add y usando en cada paso la constante que define qué lugar ocupa dentro del área principal atendiendo al administrador de diseño: contentpane.add(jlabel[0]); BorderLayout.PAGE_START); contentpane.add(jlabel[1]); BorderLayout.PAGE_START); contentpane.add(jlabel[2]); BorderLayout.PAGE_START); contentpane.add(jlabel[3]); BorderLayout.PAGE_START); contentpane.add(jlabel[4]); BorderLayout.PAGE_START); Tal y como se puede apreciar el área central (BorderLayout.CENTER) intenta ocupar la mayor parte del área disponible. En cambio el resto de las zonas ocupan simplemente el espacio imprescindible para mostrar los componentes que contienen. Este comportamiento, característico de este administrador de diseño, se puede comprobar simplemente cambiando el tamaño de la ventana de la aplicación. 3

4 Listado borderlayoutsetting public void borderlayoutsetting() jlabel[0] = new JLabel("PAGE_START"); jlabel[1] = new JLabel("LINE_START"); jlabel[2] = new JLabel("CENTER"); jlabel[2].setbackground(color.orange); jlabel[2].sethorizontalalignment(jlabel.horizontal); jlabel[2].setopaque(true); jlabel[3] = new JLabel("LINE_END"); jlabel[3].setbackground(color.magenta); jlabel[3].sethorizontalalignment(jlabel.horizontal); jlabel[3].setopaque(true); jlabel[4] = new JLabel("PAGE_END"); jlabel[4].setbackground(color.yellow); jlabel[4].sethorizontalalignment(jlabel.horizontal); jlabel[4].setopaque(true); BorderLayout borderlayout = new BorderLayout(); contentpane.setlayout(borderlayout); // contentpane.add(jlabel[0], BorderLayout.PAGE_START); // contentpane.add(jlabel[1], BorderLayout.LINE_START); contentpane.add(jlabel[2], BorderLayout.CENTER); // contentpane.add(jlabel[3], BorderLayout.LINE_END); contentpane.add(jlabel[4], BorderLayout.PAGE_END); Imagen jfcswing0201.gif Interfaz simple que emplea el administrador de diseño BorderLayout 4

5 No es necesario definir un componente para todas las zonas preestablecidas por el administrador de diseño. Dependiendo de la interfaz puede ser conveniente, por ejemplo, determinar únicamente dos zonas, PAGE_START y CENTER. Si se hace así el administrador de diseño determina que los componentes se muestren dentro del contenedor atendiendo a la misma filosofía: el componente que se coloque en la zona central ocupará el mayor tamaño disponible (anchura y altura) y el componente situado en la parte superior utilizará toda la anchura disponible y sólo lo necesario para mostrar su contenido en lo que a la altura respecta. Imagen jfcswing0202.gif Interfaz simple que emplea el administrador de diseño BorderLayout Cuando no se usa alguna de las zonas predefinidas el resto ocupa todo el espacio disponible siguiendo el comportamiento fijado por el administrador de diseño BoxLayout Este administrador de diseño se emplea para colocar los elementos uno detrás de otro de arriba abajo formando una pila o bien de izquierda a derecha formando una cola. Cada uno de los componentes de la pila o de la cola ocupa únicamente el tamaño necesario. Imagen jfcswing0203.gif En el ejemplo del listado 2 las etiquetas se apilan de arriba abajo. El constructor de la clase BoxLayout recibe dos parámetros: el primero es el contenedor y el segundo es un valor numérico que determina si se va a formar una pila (eje X) o una cola (eje Y). Listado 2 public void boxlayoutsetting() jlabel[0] = new JLabel("PAGE_START"); 5

6 jlabel[1] = new JLabel("LINE_START"); jlabel[2] = new JLabel("CENTER"); jlabel[2].setbackground(color.orange); jlabel[2].sethorizontalalignment(jlabel.horizontal); jlabel[2].setopaque(true); jlabel[3] = new JLabel("LINE_END"); jlabel[3].setbackground(color.magenta); jlabel[3].sethorizontalalignment(jlabel.horizontal); jlabel[3].setopaque(true); jlabel[4] = new JLabel("PAGE_END"); jlabel[4].setbackground(color.yellow); jlabel[4].sethorizontalalignment(jlabel.horizontal); jlabel[4].setopaque(true); BoxLayout boxlayout = new BoxLayout(contentPane, BoxLayout.Y_AXIS); contentpane.setlayout(boxlayout); contentpane.add(jlabel[0]); contentpane.add(jlabel[1]); contentpane.add(jlabel[2]); contentpane.add(jlabel[3]); contentpane.add(jlabel[4]); FlowLayout El administrador de diseño FlowLayout es el más simple y puede verse además como una versión básica del administrador de diseño BoxLayout. Simplemente agrupa los componentes formando una cola. La mayor parte de los contenedores emplean este administrador de diseño cuando no se indica otro CardLayout El administrador de diseño CardLayout se emplea cuando se desea realizar una interfaz con pestañas. Este tipo de interfaces constan por lo general de dos áreas: En la primera el usuario cuenta con una serie de pestañas (en forma de colección botones, lista, etc.) y la segunda muestra un panel de componentes u otro en función de la pestaña seleccionada. El ejemplo que se describe a continuación ilustra la utilización de este administrador de diseño para una interfaz que consta de dos pestañas. 6

7 Imagen jfcswing0204.gif Primeramente se definen dos botones que serán los elementos que se empleen para decidir qué es lo que se muestra en el área principal: JButton jbutton1 = new JButton("Pestaña 1"); jbutton2.addactionlistener( Los dos botones se agrupan dentro de un panel: JPanel jpanelbuttonbar = new JPanel(); jpanelbuttonbar.add(jbutton1); jpanelbuttonbar.add(jbutton2); Seguidamente se fija el contenido de cada una de las dos pestañas. Con el fin de no complicar el ejemplo, en este caso concreto cada pestaña contiene simplemente una etiqueta (véase el listado 3). Listado 3 jlabel[0] = new JLabel("Pestaña 1"); jlabel[1] = new JLabel("Pestaña 2"); jpanelcardscontainer = new JPanel(); jpanelcardscontainer.setlayout(new CardLayout()); jpanelcardscontainer.add(jlabel[0], "Pestaña 1"); jpanelcardscontainer.add(jlabel[1], "Pestaña 2"); Como se puede observar en dicho listado, todas las pestañas se agrupan también dentro de un panel, jpanelcardscontainer. Este elemento es el que recibe una instancia de la clase CardLayout. El segundo parámetro del método add es el nombre que identifica a la pestaña. Ese nombre se emplea posteriormente para cambiar la pestaña visible. Visualmente la interfaz se va a diseñar empleando a su vez otro administrador de diseño, BorderLayout: en el área denominada PAGE_START se agrupan los botones que sirven para seleccionar la pestaña visible; en el área denominada CENTER se muestran las pestañas. El código que programa estas acciones es el mostrado en el listado 4. 7

8 Listado 4 BorderLayout borderlayout = new BorderLayout(); contentpane.setlayout(borderlayout); contentpane.add(jpanelbuttonbar, BorderLayout.PAGE_START); contentpane.add(jpanelcardscontainer, BorderLayout.CENTER); Finalmente cuando el usuario hace clic en alguno de los botones hay que cambiar la pestaña visible. Esto se lleva a cabo en el código que maneja el evento correspondiente de cada botón y que se encuentra en el listado 5. Listado 5 jbutton1.addactionlistener( new ActionListener() public void actionperformed(actionevent e) CardLayout cardlayout = (CardLayout)jPanelCardsContainer.getLayout(); ); cardlayout.show(jpanelcardscontainer, "Pestaña 1"); El método getlayout del panel principal permite obtener el administrador de diseño. Éste cuenta con el método show que permite fijar la pestaña visible. El primer parámetro que recibe es el contenedor y el segundo es el nombre de la pestaña que ha de mostrarse. cardlayoutsetting public void cardlayoutsetting() JButton jbutton1 = new JButton("Pestaña 1"); jbutton1.addactionlistener( new ActionListener() public void actionperformed(actionevent e) CardLayout cardlayout = (CardLayout)jPanelCardsContainer.getLayout(); ); cardlayout.show(jpanelcardscontainer, "Pestaña 1"); 8

9 JButton jbutton2 = new JButton("Pestaña 2"); jbutton2.addactionlistener( new ActionListener() public void actionperformed(actionevent e) CardLayout cardlayout = (CardLayout)jPanelCardsContainer.getLayout(); ); cardlayout.show(jpanelcardscontainer, "Pestaña 2"); JPanel jpanelbuttonbar = new JPanel(); jpanelbuttonbar.add(jbutton1); jpanelbuttonbar.add(jbutton2); jlabel[0] = new JLabel("Pestaña 1"); jlabel[1] = new JLabel("Pestaña 2"); jpanelcardscontainer = new JPanel(); jpanelcardscontainer.setlayout(new CardLayout()); jpanelcardscontainer.add(jlabel[0], "Pestaña 1"); jpanelcardscontainer.add(jlabel[1], "Pestaña 2"); BorderLayout borderlayout = new BorderLayout(); contentpane.setlayout(borderlayout); contentpane.add(jpanelbuttonbar, BorderLayout.PAGE_START); contentpane.add(jpanelcardscontainer, BorderLayout.CENTER); GridBagLayout GridBagLayout es el administrador de diseño más complejo de todos. A grandes rasgos se puede decir que permite colocar los componentes en filas y columnas formando una tabla, permitiendo además que algunas celdas se expandan horizontal o verticalmente, o fijando anchuras o alturas preferidas con valores absolutos o porcentajes. La clase GridBagConstraints se emplea para fijar las características de cada una de las celdas que constituyen la cuadrícula de diseño. Las propiedades de esta clase permiten determinar distintos aspectos relacionados con el tamaño, la posición y el comportamiento del componente: gridx, gridy: Controla la celda que ocupa el componente en la cuadrícula. gridwidth, gridheight: Controla el número de celdas sobre las que se extiende el componente, horizontal o verticalmente. 9

10 weightx, weighty: Controla cómo se asigna al componente el espacio adicional. ipadx, ipady: Determina el espacio existente entre el componente y los extremos del área que ocupa. anchor: Si existe espacio adicional, controla la posición del componente dentro de dicho espacio. instes: Controla los márgenes del componente. Seguidamente se va a mostrar un ejemplo en el que se distribuyen cinco etiquetas en una cuadrícula. Imagen Imagen jfcswing0205.gif El administrador de diseño GridBagLayout establece una cuadrícula en cuyas celdas se colocan los componentes. En primer lugar se establece que el administrador de diseño del contenedor principal sea del tipo Grid BagLayout y además se crea una instancia de la clase GridBagConstraints: contentpane.setlayout(new GridBagLayout()); GridBagConstraints gridbagconstraints = new GridBagConstraints(); A partir de este momento los componentes se van creando, se establecen los valores de las propiedades de la instancia de la clase GridBagConstraints que fijan su aspecto en la cuadrícula, y se van añadiendo al contenedor principal, vea esto en el listado 6. Listado 6 jlabel[0] = new JLabel("Etiqueta 1"); gridbagconstraints.gridx = 0; gridbagconstraints.gridy = 0; contentpane.add(jlabel[0], gridbagconstraints); Como se puede deducir por el código del listado 6 la primera etiqueta ocupa la celda situada en la posición (0,0). El método add en este caso recibe como segundo parámetro la instancia de la clase GridBagConstraints que determina las características de diseño de ese componente. 10

11 La siguiente etiqueta ocupa la posición (1,0) de la cuadrícula y además se establece que el componente se extienda u ocupe un espacio adicional de 20 unidades horizontalmente y 40 verticalmente. 'Esto puede verse en el listado 7. Listado 7 jlabel[1] = new JLabel("Etiqueta 2"); gridbagconstraints.gridx = 1; gridbagconstraints.gridy = 0; gridbagconstraints.ipadx += 20; gridbagconstraints.ipady += 40; contentpane.add(jlabel[1], gridbagconstraints); Obsérvese que se está utilizando el mismo GridBagConstraints objeto para configurar el diseño de cada uno de los componentes que forman la cuadrícula por lo que es preciso deshacer los cambios introducidos antes de pasar al siguiente elemento de la interfaz. gridbagconstraints.ipadx -= 20; gridbagconstraints.ipady -= 40; El resto de las etiquetas se disponen de la siguiente forma. Por ejemplo, la última de las etiquetas utiliza el atributo gridwidth para que ocupe dos celdas de la cuadrícula, como muestra el listado 8. Listado 7 jlabel[4] = new JLabel("Etiqueta 5"); jlabel[4].setbackground(color.yellow); jlabel[4].sethorizontalalignment(jlabel.horizontal); jlabel[4].setopaque(true); gridbagconstraints.gridx = 1; gridbagconstraints.gridy = 1; gridbagconstraints.gridwidth = 2; gridbagconstraints.fill = GridBagConstraints.BOTH; contentpane.add(jlabel[4], gridbagconstraints); Listado gridbaglayoutsetting public void gridbaglayoutsetting() contentpane.setlayout(new GridBagLayout()); GridBagConstraints gridbagconstraints = new GridBagConstraints(); jlabel[0] = new JLabel("Etiqueta 1"); gridbagconstraints.gridx = 0; gridbagconstraints.gridy = 0; contentpane.add(jlabel[0], gridbagconstraints); 11

12 jlabel[1] = new JLabel("Etiqueta 2"); gridbagconstraints.gridx = 1; gridbagconstraints.gridy = 0; gridbagconstraints.ipadx += 20; gridbagconstraints.ipady += 40; contentpane.add(jlabel[1], gridbagconstraints); gridbagconstraints.ipadx -= 20; gridbagconstraints.ipady -= 40; jlabel[2] = new JLabel("Etiqueta 3"); jlabel[2].setbackground(color.orange); jlabel[2].sethorizontalalignment(jlabel.horizontal); jlabel[2].setopaque(true); gridbagconstraints.gridx = 2; gridbagconstraints.gridy = 0; contentpane.add(jlabel[2], gridbagconstraints); jlabel[3] = new JLabel("Etiqueta 4"); jlabel[3].setbackground(color.magenta); jlabel[3].sethorizontalalignment(jlabel.horizontal); jlabel[3].setopaque(true); gridbagconstraints.gridx = 0; gridbagconstraints.gridy = 1; contentpane.add(jlabel[3], gridbagconstraints); jlabel[4] = new JLabel("Etiqueta 5"); jlabel[4].setbackground(color.yellow); jlabel[4].sethorizontalalignment(jlabel.horizontal); jlabel[4].setopaque(true); gridbagconstraints.gridx = 1; gridbagconstraints.gridy = 1; gridbagconstraints.gridwidth = 2; gridbagconstraints.fill = GridBagConstraints.BOTH; contentpane.add(jlabel[4], gridbagconstraints); 12

13 2.1.6 GridLayout Este administrador de diseño es similar al anterior si bien los componentes se colocan en una tabla que tiene el mismo número de columnas para cada una de las filas. Además los componentes ocupan todo el espacio disponible. Imagen jfcswing0206.gif Aspecto que presenta una interfaz simple que muestra cinco etiquetas utilizando el administrador de diseño GridLayout sin parámetros en el constructor Cuando se emplea el constructor de la clase GridLayout sin parámetros se aplica una cuadrícula formada por una sola fila: Container contentpane = getcontentpane () ; GridLayout gridlayout = new GridLayout () ; contentpane.setlayout(gridlayout) ; Así, cada vez que se ejecuta el método add del contenedor se crea una nueva columna en la fila y el componente se ubica ahí. Ahora bien, el constructor puede recibir dos parámetros, concretamente dos valores numéricos: el primero es el número de filas y el segundo el número de columnas. De esta forma si se modifica la declaración anterior de la siguiente manera: Container contentpane = getcontentpane () ; GridLayout gridlayout = new GridLayout (0, 2); contentpane.setlayout(gridlayout) ; Se obtiene una cuadrícula formada por dos columnas y tantas filas como el número de componentes demande. Listado gridlayoutsetting public void gridlayoutsetting() GridLayout gridlayout = new GridLayout(); contentpane.setlayout(gridlayout); 13

14 jlabel[0] = new JLabel("Etiqueta 1"); contentpane.add(jlabel[0]); jlabel[1] = new JLabel("Etiqueta 2"); contentpane.add(jlabel[1]); jlabel[2] = new JLabel("Etiqueta 3"); jlabel[2].setbackground(color.orange); jlabel[2].sethorizontalalignment(jlabel.horizontal); jlabel[2].setopaque(true); contentpane.add(jlabel[2]); jlabel[3] = new JLabel("Etiqueta 4"); jlabel[3].setbackground(color.magenta); jlabel[3].sethorizontalalignment(jlabel.horizontal); jlabel[3].setopaque(true); contentpane.add(jlabel[3]); jlabel[4] = new JLabel("Etiqueta 5"); jlabel[4].setbackground(color.yellow); jlabel[4].sethorizontalalignment(jlabel.horizontal); jlabel[4].setopaque(true); contentpane.add(jlabel[4]); 14

15 2.1.7 Código Completo del ejercicio sobre BorderLayout Código Completo del ejercicio sobre BorderLayout import javax.swing.*; import java.awt.*; import java.awt.event.*; public class JApplication2 extends JFrame int iwidth = 800; int iheight = 600; JLabel[] jlabel; JPanel jpanelcardscontainer; public JApplication2() super("introducción a la creación de interfaces con JFC/Swing (2 de 4)"); setsize(iwidth, iheight); jlabel = new JLabel[5]; //borderlayoutsetting(); //boxlayoutsetting(); //cardlayoutsetting(); //gridbaglayoutsetting(); gridlayoutsetting(); public void gridlayoutsetting() GridLayout gridlayout = new GridLayout(); contentpane.setlayout(gridlayout); jlabel[0] = new JLabel("Etiqueta 1"); contentpane.add(jlabel[0]); jlabel[1] = new JLabel("Etiqueta 2"); contentpane.add(jlabel[1]); jlabel[2] = new JLabel("Etiqueta 3"); jlabel[2].setbackground(color.orange); jlabel[2].sethorizontalalignment(jlabel.horizontal); jlabel[2].setopaque(true); contentpane.add(jlabel[2]); 15

16 jlabel[3] = new JLabel("Etiqueta 4"); jlabel[3].setbackground(color.magenta); jlabel[3].sethorizontalalignment(jlabel.horizontal); jlabel[3].setopaque(true); contentpane.add(jlabel[3]); jlabel[4] = new JLabel("Etiqueta 5"); jlabel[4].setbackground(color.yellow); jlabel[4].sethorizontalalignment(jlabel.horizontal); jlabel[4].setopaque(true); contentpane.add(jlabel[4]); public void gridbaglayoutsetting() contentpane.setlayout(new GridBagLayout()); GridBagConstraints gridbagconstraints = new GridBagConstraints(); jlabel[0] = new JLabel("Etiqueta 1"); gridbagconstraints.gridx = 0; gridbagconstraints.gridy = 0; contentpane.add(jlabel[0], gridbagconstraints); jlabel[1] = new JLabel("Etiqueta 2"); gridbagconstraints.gridx = 1; gridbagconstraints.gridy = 0; gridbagconstraints.ipadx += 20; gridbagconstraints.ipady += 40; contentpane.add(jlabel[1], gridbagconstraints); gridbagconstraints.ipadx -= 20; gridbagconstraints.ipady -= 40; jlabel[2] = new JLabel("Etiqueta 3"); jlabel[2].setbackground(color.orange); jlabel[2].sethorizontalalignment(jlabel.horizontal); jlabel[2].setopaque(true); gridbagconstraints.gridx = 2; gridbagconstraints.gridy = 0; contentpane.add(jlabel[2], gridbagconstraints); jlabel[3] = new JLabel("Etiqueta 4"); jlabel[3].setbackground(color.magenta); jlabel[3].sethorizontalalignment(jlabel.horizontal); jlabel[3].setopaque(true); gridbagconstraints.gridx = 0; gridbagconstraints.gridy = 1; contentpane.add(jlabel[3], gridbagconstraints); jlabel[4] = new JLabel("Etiqueta 5"); jlabel[4].setbackground(color.yellow); jlabel[4].sethorizontalalignment(jlabel.horizontal); 16

17 jlabel[4].setopaque(true); gridbagconstraints.gridx = 1; gridbagconstraints.gridy = 1; gridbagconstraints.gridwidth = 2; gridbagconstraints.fill = GridBagConstraints.BOTH; contentpane.add(jlabel[4], gridbagconstraints); public void cardlayoutsetting() JButton jbutton1 = new JButton("Pestaña 1"); jbutton1.addactionlistener( new ActionListener() public void actionperformed(actionevent e) CardLayout cardlayout = (CardLayout)jPanelCardsContainer.getLayout(); cardlayout.show(jpanelcardscontainer, "Pestaña 1"); ); JButton jbutton2 = new JButton("Pestaña 2"); jbutton2.addactionlistener( new ActionListener() public void actionperformed(actionevent e) CardLayout cardlayout = (CardLayout)jPanelCardsContainer.getLayout(); cardlayout.show(jpanelcardscontainer, "Pestaña 2"); ); JPanel jpanelbuttonbar = new JPanel(); jpanelbuttonbar.add(jbutton1); jpanelbuttonbar.add(jbutton2); jlabel[0] = new JLabel("Pestaña 1"); jlabel[1] = new JLabel("Pestaña 2"); jpanelcardscontainer = new JPanel(); jpanelcardscontainer.setlayout(new CardLayout()); jpanelcardscontainer.add(jlabel[0], "Pestaña 1"); jpanelcardscontainer.add(jlabel[1], "Pestaña 2"); BorderLayout borderlayout = new BorderLayout(); contentpane.setlayout(borderlayout); contentpane.add(jpanelbuttonbar, BorderLayout.PAGE_START); contentpane.add(jpanelcardscontainer, BorderLayout.CENTER); 17

18 public void boxlayoutsetting() jlabel[0] = new JLabel("PAGE_START"); jlabel[1] = new JLabel("LINE_START"); jlabel[2] = new JLabel("CENTER"); jlabel[2].setbackground(color.orange); jlabel[2].sethorizontalalignment(jlabel.horizontal); jlabel[2].setopaque(true); jlabel[3] = new JLabel("LINE_END"); jlabel[3].setbackground(color.magenta); jlabel[3].sethorizontalalignment(jlabel.horizontal); jlabel[3].setopaque(true); jlabel[4] = new JLabel("PAGE_END"); jlabel[4].setbackground(color.yellow); jlabel[4].sethorizontalalignment(jlabel.horizontal); jlabel[4].setopaque(true); BoxLayout boxlayout = new BoxLayout(contentPane, BoxLayout.Y_AXIS); contentpane.setlayout(boxlayout); contentpane.add(jlabel[0]); contentpane.add(jlabel[1]); contentpane.add(jlabel[2]); contentpane.add(jlabel[3]); contentpane.add(jlabel[4]); public void borderlayoutsetting() jlabel[0] = new JLabel("PAGE_START"); jlabel[1] = new JLabel("LINE_START"); jlabel[2] = new JLabel("CENTER"); jlabel[2].setbackground(color.orange); jlabel[2].sethorizontalalignment(jlabel.horizontal); jlabel[2].setopaque(true); jlabel[3] = new JLabel("LINE_END"); jlabel[3].setbackground(color.magenta); jlabel[3].sethorizontalalignment(jlabel.horizontal); jlabel[3].setopaque(true); jlabel[4] = new JLabel("PAGE_END"); 18

19 jlabel[4].setbackground(color.yellow); jlabel[4].sethorizontalalignment(jlabel.horizontal); jlabel[4].setopaque(true); BorderLayout borderlayout = new BorderLayout(); contentpane.setlayout(borderlayout); // contentpane.add(jlabel[0], BorderLayout.PAGE_START); // contentpane.add(jlabel[1], BorderLayout.LINE_START); contentpane.add(jlabel[2], BorderLayout.CENTER); // contentpane.add(jlabel[3], BorderLayout.LINE_END); contentpane.add(jlabel[4], BorderLayout.PAGE_END); public static void main(string[] args) JFrame jframe = new JApplication2(); jframe.addwindowlistener( new WindowAdapter() public void windowclosing(windowevent e) System.exit(0); ); jframe.addkeylistener( new KeyAdapter() public void keypressed(keyevent e) if (e.getkeycode() == KeyEvent.VK_ESCAPE) System.exit(0); ); jframe.setvisible(true); 19

20 2.2 Utilización de varios administradores de diseño Las aplicaciones y los applets JFC/Swing "reales" normalmente se componen de varios componentes que a su vez hacen de contenedores de más componentes y así hasta llegar a interfaces realmente tan complicadas como sea necesario. Cada vez que hay un contenedor se puede aplicar un administrador de diseño diferente. A continuación se va a desarrollar una pequeña aplicación completa que básicamente consta de tres componentes: un campo de texto donde el usuario puede introducir una URL, un botón que al hacer clic sobre él hace que la aplicación se conecte a Internet en busca del contenido que proporciona dicha dirección y finalmente otro campo de texto donde se muestra el código HTML obtenido. Imagen Imagen jfcswing0207.gif Aplicación JFC/Swing completa que lee código HTML de una URI y lo muestra en un campo de texto. El contenedor principal de la aplicación utiliza un administrador de diseño del tipo BoxLayout: BorderLayout borderlayout = new BorderLayout(); contentpane.setlayout(borderlayout); En el centro (BorderLayout.CENTER) se sitúa el campo de texto responsable de mostrar el código HTML y en la zona inferior (BorderLayout.PAGE_END) se encuentran los otros dos componentes: contentpane.add(jscrollpane, BorderLayout.CENTER); contentpane.add(jpanel, BorderLayout.PAGE_END); El componente correspondiente al campo de texto destinado a mostrar el código HTML tiene barras de desplazamiento, lo que en JFC/Swing significa que se ha empleado otro componente, JScrollPane, para contener al campo de texto y que es ese otro componente el que se añade con el método add al contenedor principal: 20

21 jtextareahtmlcode = new JTextArea(); jtextareahtmlcode.setlinewrap(true);... JScrollPane jscrollpane = new JScrollPane(jTextAreaHTMLCode); La caja de texto donde el usuario introduce la URL y el botón se agrupan en un nuevo panel, jpanel, que además emplea un administrador de diseño del tipo GridBagLayout (véase el listado 9). Listado 9 JPanel jpanel = new JPanel(); jpanel.setlayout(new GridBagLayout()); GridBagConstraints gridbagconstraints = new GridBagConstraints(); gridbagconstraints.weightx = 1.0; gridbagconstraints.fill = GridBagConstraints.BOTH; gridbagconstraints.gridx = 0; gridbagconstraints.gridy = 0; gridbagconstraints.anchor = GridBagConstraints.WEST; jpanel.add(jtextfieldurl, gridbagconstraints); gridbagconstraints.gridx = 1; gridbagconstraints.gridy = 0; gridbagconstraints.anchor = GridBagConstraints.EAST; jpanel.add(jbuttongethtmlcode, gridbagconstraints); Ambos componentes (la caja de texto y el botón) conforman una cuadrícula de una sola fila y dos columnas, e intentan ocupar todo el espacio disponible anclándose además la caja de texto a la izquierda y el botón a la derecha. El último paso consiste en programar el evento clic del botón. Para ello se crea una clase que implemente la interfaz ActionListener (véase el listado 10). Listado 10 jbuttongethtmlcode.addactionlistener( new ActionListener() public void actionperformed(actionevent e).... ); El método actionperformed se ejecuta cada vez que el usuario hace clic en el botón. En ese momento se lee el valor de la caja de texto correspondiente a la URL: String surl = jtextfieldurl.gettext(); Y se intenta establecer una conexión HTTP para obtener el código HTML correspondiente, como se muestra en el listado

22 Listado 11 StringBuffer sbhtmlcode = null; BufferedReader br = null; try //" URL url = new URL(sURL); URLConnection urlconnection = url.openconnection(); sbhtmlcode = new StringBuffer(); br = new BufferedReader( new InputStreamReader(urlConnection.getInputStream())); char[] buffer = new char[128]; int ireadchars; while ((ireadchars=br.read(buffer, 0, 128))!=-1) sbhtmlcode.append(buffer, 0, ireadchars); catch (Exception ex)... catch (Throwable t)... finally try if (br!=null) br.close(); catch(exception ex) ; Si la operación concluye con éxito la variable sbhtmlcode almacena una cadena de texto con el código HTML correspondiente a la página web cuya URL ha sido introducida por el usuario. Entonces se actualiza el texto del campo de área: if (sbhtmlcode!=null) jtextareahtmlcode.settext(sbhtmlcode.tostring()); 22