Administradores de diseño


Hay dos factores determinantes del aspecto que tendrá el applet:

  1. El orden en el que añadimos (add) los componentes al panel (recordar que el applet es un tipo de panel). En el siguiente ejemplo el applet simplemente contiene cinco botones con nombres de personas. Su aspecto es:
    applet


    En el código fuente puedes ver que los botones aparecen en función del orden con el que se añaden (add) al applet:

    
    public class admin_disenio extends Applet {
        JButton b_juan = new JButton();
        JButton b_pedro = new JButton();
        JButton b_pablo = new JButton();
        JButton b_santiago = new JButton();
        JButton b_mateo = new JButton();
    
        /**** Inicializar el applet ****/
        public void init() {
    	try {
    	    jbInit();
    	}
    	catch(Exception e) {
    	    e.printStackTrace();
    	}
        }
    
        /******** Inicialización de componentes ************/
        private void jbInit() throws Exception {
    	b_juan.setText("Juan");
    	b_pedro.setText("Pedro");
    	b_pablo.setText("Pablo");
    	b_santiago.setText("Santiago");
    	b_mateo.setText("Mateo");
    	add(b_juan);
    	add(b_pedro);
    	add(b_pablo);
    	add(b_santiago);
    	add(b_mateo);
        }
    }
    
  2. El segundo factor es el administrador de diseño del panel. Un administrador de diseño determina la forma en que se presentarán los componentes y contenedores. Con un administrador el programador no tiene que definir la posición (x,y) de cada elemento gráfico, lo que implica la molestia de redefinir la posición cada vez que la aplicación cambia de tamaño con la ventana.

¿Qué es un administrador de diseño?

Los administradores nos ahorran el trabajo de dar a cada elemento su posición (x,y). En vez de ello, un administrador define una disposicíón u orden para todo el conjunto de elementos. Imaginemos una situación cotidiana: si tienes que organizar un grupo de personas en una habitación supón que tienes dos opciones: la primera es la más usual, decir a cada persona la posición exacta que debe ocupar. La segunda opción es más "abstracta" y más interesante, les digo a todos que se organicen en función de un cierto orden, por ejemplo, en filas paralelas empezando desde la izquierda, o en diagonal, etc. En la segunda opción lo único que tienes que hacer es ordenar a todos los elementos que se organicen de una forma determinada y suponemos que todos los elementos tienen la suficiente "inteligencia" como para adoptar ese orden. Esto es algo muy semejante a lo que hacen nuestros administradores de diseño.

Vamos a ver los administradores de diseño más comunes en AWT: FlowLayout, BorderLayout y GridLayout..

¿Cómo se define el administrador de diseño? Por medio de la llamada a la función setLayout.

Esta llamada se realiza desde jbInit:


	setLayout( new TIPO_DE_ADMINISTRADOR_DE_DISEÑO() );

Donde TIPO_DE_ADMINISTRADOR_DE_DISEÑO es cualquiera de los tipos antes señalados: FlowLayout, BorderLayout, GridLayout y GridBagLayout.

FlowLayout

Por defecto un applet tiene como administrador de diseño a FlowLaout, que organiza los elementos de izquierda a derecha y de arriba hacia abajo. Por defecto la alineación es centrada. En el siguiente ejemplo hemos puesto un FlowLayout con una alineación a la izquierda (LEFT):


	private void jbInit() throws Exception {
		setLayout( new FlowLayout( FlowLayout.LEFT ) );
		....
	}

Las versiones del constructor de FlowLayout son:

En el siguiente ejemplo hemos usado setLayout( new FlowLayout( FlowLayout.LEFT, 20, 10 ) ):

applet


BorderLayout

Este administrador organiza los elementos por zonas: Norte, Sur, Este, Oeste y Centro. Veamos el siguiente ejemplo, en el que la zona se indica en el segundo argumento de la llamada a a add():


    private void jbInit() throws Exception {
	this.setLayout( new BorderLayout( ) );
	b_juan.setText("Juan");
	b_pedro.setText("Pedro");
	b_pablo.setText("Pablo");
	b_santiago.setText("Santiago");
	b_mateo.setText("Mateo");

	add(b_juan, BorderLayout.NORTH);
	add(b_pedro, BorderLayout.CENTER);
	add(b_pablo, BorderLayout.SOUTH);
	add(b_santiago, BorderLayout.EAST);
	add(b_mateo, BorderLayout.WEST);
    }

El aspecto final es:

applet

Observe dos características importantes: cada elemento (en este caso botones) se expande sobre la zona asignada. Además el último elemento de una zona oculta a los anteriores elementos de esa zona. Para entender esto, supongamos que incluimos un botón, denominado b_judas, y lo añadimos a la misma zona (NORTH) que b_juan:


    private void jbInit() throws Exception {
	....
	add(b_juan, BorderLayout.NORTH);
	add(b_judas, BorderLayout.NORTH);
	....
    }

¿Cuál es el botón que se observa?¿Cuál se oculta?

Las versiones del constructor de BorderLayout son:

GridLayout

La disposición o aspecto que indica este administrador de diseño es la típica un eje cartesiano, como una hoja de cálculo estructurada en filas y columnas. Proseguimos con nuestro ejemplo de los botones aplicando este nuevo administrador:

applet


Para usar GridLayout debe especificar las filas y columnas a la hora de construirlo. Los elementos se añaden al applet con el orden izquierda-derecha y arriba-abajo:


    private void jbInit() throws Exception {
	this.setLayout( new GridLayout( 2, 3 ) ); // Dos filas y tres columnas

	b_juan.setText("Juan");
	b_pedro.setText("Pedro");
	b_pablo.setText("Pablo");
	b_santiago.setText("Santiago");
	b_mateo.setText("Mateo");

	add(b_juan);
	add(b_pedro);
	add(b_pablo);
	add(b_santiago);
	add(b_mateo);
    }

Existe un segundo tipo de constructor que permite especificar la distancia horizontal y vertical de los elementos:


	GridLayout(int rows, int cols, int hgap, int vgap)



Volver al índice