Android: Tipos de Layouts

Hablaremos sobre los LinearLayouts y RelativeLayouts

Tipos de Layouts

A la hora de realizar nuestra parte gráfica del Activity, nuestro XML, en Android utilizamos algo llamado Layouts que son elementos dentro de los cuales van a estar nuestras imágenes, botones, checks, textos, etc…. En Android si o si hay que utilizar algún tipo de layout para mostrar. Existen tres tipos: LinearLayout, RelativeLayout y (a partir de la versión 2.2 de Android Studio) ConstraintLayout.

Sea del tipo que sea el layout siempre se le deben definir dos atributos fundamentales: Ancho (android:layout_width) y Largo (android:layout_height). Los mismos pueden ser de dos (o tres) tipos:

  1. wrap_content: Le indicamos a la vista que se ajuste al contenido, es decir, si nuestra vista tiene 1 botón dentro, el ancho va a ser de un botón…si tiene 3 botones, va a ser de tres botones
  2. match_parent: Le indicamos a la vista que ajuste a lo máximo posible que le permita su vista padre. Es decir, si tenemos nuestra vista contenida dentro de otra vista, le dirá que se expanda lo maximo que esa vista le permite. NOTA: Si estamos en la vista padre, la primera de las vistas, tienen que ir generalmente match_parent así la vista padre se expande al tamaño máximo de la pantalla del dispositivo.
  3. fill_parent: Si investigas un poco vas a encontrarte con está opción, está opción ya no se usa, fue reemplazada por el match_parent. Si te da curiosidad, cumple la misma función que match_parent.

LinearLayout

El LinearLayout agrupa la vista en una única dirección, o todas vertical o todas horizontal

Para definir la orientación que va a tener el LinearLayout se utiliza android:orientation=”vertical” o android:orientation=”horizontal”

Si vamos a la solapa design vamos a ver una vista de cómo se vería nuestro layout:

Pero, que pasaría si metemos más TextView dentro de mi LinearLayout (TextView es por ejemplo el texto que aparece en pantalla, más adelante se explicará en detalle)?

No se nos mostrará de forma correcta ya que Android Studio no sabe cómo mostrar los 3 TextView por que no sabe cómo distribuirlos. Por suerte, existe algo llamado weight el cual le da un peso determinado a cada Layout lo que permite al IDE acomodarlo. El atributo se llama poniendo android:layout_weight

Dándonos como resultado la siguiente vista ya que la orientación, en este caso, está puesta como horizontal. En el caso de que la orientación fuera vertical se vería como la segunda imagen.

RelativeLayout

La principal característica del RelativeLayout es que nos permite especificar la posición de un objeto en base a otro. Por ejemplo, si tenemos un texto y un botón y queremos que el botón esté por debajo del texto, nos permitirá poner su “posición relativa sobre determinado objeto” y si movemos el texto, el botón se moverá con el.

A diferencia del LinearLayout, este no lleva orientación

Como dijimos, para poder ubicar elementos tenemos que relacionarlos con otros elementos, y para poder lograr esto se utilizan dos propiedades  android:id=”@+id/textView” y android:layout_below=”@+id/textView” 

  1. android:id básicamente le da un id al elemento, ya sea un Texto, un botón, una imagen, etc.. es un código de referencia único con el cual vamos a identificar al objeto. se coloca: android:id=”@+id/nombredelID
  2. android:layout_below le indica al objeto que debe colocarse debajo del elemento que tenga ese id, por ejemplo:

Le estamos indicando al Button que se ubique debajo del elemento cuyo id es “mensaje”

De está manera es como vamos a ir organizando nuestros objetos en un RelativeLayout, por supuesto hay muchísimas propiedades para manejar los objetos, pero como este es un manual básico no los vamos a nombrar…le toca investigar por su cuenta!