Layout en Android II: Relative Layout

Escrito por Condesa | Saturday, July 16, 2011 a las 1:43 pm | 4 Comentarios

El segundo contenedor del que disponemos para crear interfaces en Android es el Relative Layout. Su principal característica es que los widgets que estén dentro de este contenedor basarán su posición en  relación con los otros elementos. De esta forma, podemos definir que el widget X quede debajo del widget Y y que éste a su vez se alinie verticalmente con el widget Z.

 

Conceptos y propiedades

Cabe mencionar que además de posicionar un elemento con respecto a otro del mismo nivel también podemos hacerlo con respecto al área que corresponde al RelativeLayout.

Este tipo de contenedor es una herramienta muy poderosa para cumplir con la tarea de diseñar interfaces de usuario ya que permite eliminar ViewGroups anidados, lo cuál es útil para reemplazar un diseño en el que tenemos una gran cantidad de grupos dentro de un contenedor de tipo LinearLayout y hacerlo más eficiente utilizando un RelativeLayout.

Entre los atributos que nos sirven para posicionar los elementos con respecto a otros están:

• android:layout_above indica que el elemento se posicionará justo arriba del elemento que tiene el ID definido como valor de este atributo.
• android:layout_toLeftOf indica que el elemento se posionará a la izquierda del elemento cuyo ID coincida con el definido en el valor de este atributo.
• android:layout_toRightOf posiciona al elemento a la derecha del elemento cuyo ID coincida con el proporcionado en el valor de este atributo.
• android:layout_bottom posiciona al elemento debajo del que tenga la ID proporcionada en el valor del atributo.

En el listado anterior tendremos que proporcionar siempre un ID de otro elemento, ejemplo: android:layout_toLeftOf=”@id/ok” dónde el elemento cuyo id es Ok ya se definió anteriormente en el archivo XML.

De la misma forma existen atributos cuyo valor se maneja con true y false y que nos sirven a posicionar a los elementos con respecto al contenedor en el que se encuentran, entre ellos tenemos:

• android:layout_alignParentTop que le indica al widget que su borde superior deberá estar alineado con el borde superior del contenedor.
• android:layout_alignParentBottom que le indica al widget que su borde inferior deberá estar alineado con el borde inferior del contenedor.
• android:layout_alignParentLeft que le indica al widget que su borde izquierdo deberá estar alineado con el borde izquierdo del contenedor.
• android:layout_alignParentRight que le indica al widget que su borde derecho deberá estar alineado con el borde derecho del contenedor.
• android:layout_centerHorizontal permite centrar horizontalmente al widget con respecto a su contenedor.
• android:layout_centerVertical permite centrar verticalmente al widget con respecto a su contenedor.

Existen más atributos que puedes utilizar y que puedes consultar desde la página oficial de Android developers.

 

Cosas a considerar

Para que podamos trabajar con los atributos listados arriba, es necesario que cuides dos puntos muy importantes:

1. Definir identificadores (id’s) por medio del atributo android:id en cada uno de los elementos que estarán dentro del contenedor principal RelativeLayout. En esta parte el valor de los atributos irá con el formato android:id=”@+id/[miId]“.
2. Poner la referencia correcta hacia otros elementos del layout con la ayuda del formato “@id/elIdDelOtroElemento”, NOTA QUE AQUÍ OMITIMOS EL SIGNO DE +. Por ejemplo: android:layout_alignTop=”@id/ok”.

 

Orden en que se acomodan los elementos

Algunas veces puede resultar complicado alinear todos los elementos según el diseño que queramos obtener y esto se debe a orden de evaluación que toma Android para llevar a cabo esta tarea. Android hace una sola revisión a través del archivo XML y calcula el tamaño y posición de cada uno de los elementos que va encontrando en la definición del layout. Por lo que a la hora de trabajar con este tipo de contenedor tienes que saber que:

1. No puedes hacer referencia a un elemento que aún no ha sido definido. Es decir, si por ejemplo ocupamos un EditText para comodar un botón, el EditText deberá estar definido antes de hacer el llamado en el atributo del Button porque sino Android lo tomará como un error.
2. Hay que tener cuidado a la hora de utilizar el valor fill_parent para los atributos android:layout_width y android:layout_height para evitar que un elemento termine acaparándose el espacio que le corresponda a algún elemento posterior que dependa de éste para mostrarse.