■ Java ► Elementos y Áreas (Layouts)

Cuando se trabaja con ventanas en Java dependiendo de lo que haga nuestro programa es necesario colocar elementos con los que interactuará el usuario, estos pueden ser botones, etiquetas, campos de texto, etc., y para acomodar estos elementos se usan los "layouts".

■ Layouts

Los layouts son formas de posicionar elementos en una ventana o panel, los paneles o la propia ventana son recipientes que pueden contener cualquier elemento que queramos mostrar en pantalla, incluso otro panel, es decir, un panel puede contener elementos y a su vez ese panel puede estar contenido en otro panel.

En la siguiente imagen se observan 2 paneles (rectángulos grises) contenidos en la ventana, uno tiene un texto que dice "NORTH" y el otro dice "SOUTH":

Una forma de acomodar elementos en la ventana es usando la característica "borderLayout" la cual permite acomodar elementos en la ventana o en un panel mediante tipo "puntos cardinales", donde "NORTH" es la parte superior, "SOUTH" es la parte inferior, "WEST" es la parte izquierda, "EAST" es la parte derecha y "CENTER" el centro de la ventana, en la imagen de arriba los paneles grises están situados en los puntos NORTH y SOUTH de la ventana.

Si agregáramos un tercer panel al centro, es decir, en la posición "CENTER", la ventana luciría así:

■ Tipos de Layouts

• BorderLayout

Una de las formas que nos permite acomodar elementos en la pantalla es borderLayout, como ya se mencionó en el ejemplo de arriba la forma de distribuir los elementos en la pantalla mediante borderLayout es indicando la posición del elemento de acuerdo a un punto en la pantalla, estos puntos solo pueden ser NORTH, SOUTH, WEST, EAST o CENTER, siendo la distribución de la siguiente forma:

Y a su vez dentro de cada panel, al agregar elementos se pueden distribuir de la misma manera, es decir, cada panel tiene un norte, sur, oeste, este y centro.

• BoxLayout

Este layout nos permite acomodar los elementos en forma lineal ya sea sobre el eje X o sobre el eje Y, es decir de forma vertical uno bajo el otro o de forma horizontal uno al lado del otro como se aprecia a continuación:

Eje X

Eje Y

• FlowLayout

Este tipo de layout lo que hace es colocar los elementos seguidos uno de otro de izquierda a derecha y el cómo se vean los elementos dependerá de su tamaño y de la distribución elegida, en este caso solo tiene tres opciones: CENTER, LEFT y RIGHT.

Por ejemplo si elegimos CENTER y los elementos son pequeños y caben varios a lo ancho de la ventana se centrarán así:

Y si los elementos miden de ancho lo mismo que la ventana entonces se acomodarán uno abajo del otro así:

Si elegimos LEFT y los elementos son pequeños se alinearán a la izquierda así:

Finalmente si elegimos RIGHT se alinearán a la derecha:

• GridLayout

Este tipo de layout sirve para acomodar los elementos como si se tratara de una tabla, es decir, en filas y columnas, al crearlo se le pasan dos parámetros, el primero es el número de filas y el segundo son las columnas, por ejemplo si le dijéramos que queremos los elementos en 3 filas por 2 columnas, se verían así:

Y si fuera al revés, 2 filas por 3 columnas, los elementos quedarían así:

■ ¿Cuál elegir?

Eso dependerá de cómo queramos distribuír los elementos en pantalla, dependiendo de nuestra necesidad uno podría ser mejor que otro, también está la posibilidad de combinarlos, por ejemplo crear 3 paneles al norte, centro y sur con borderLayout y los elementos de cada uno de esos paneles distribuirlos horizontalmente sobre X con boxLayout.