jueves, 24 de octubre de 2013

Componentes Gráficos Android: Layout

Buenas amigos, en temas anteriores estuvimos viendo como instalar android, crear un proyecto y como hacer una aplicación sencilla. En este tema ,y en los posteriores, vamos ir viendo algunos de los componentes gráficos más utilizados para nuestras aplicaciones android. Para comenzar a ver componentes vamos a empezar por la base que deben tener nuestras activitys, los layouts.

Los layout nos dan la posibilidad de añadir nuestros componentes en un determinado orden, o que contenga cierto sentido. Es decir, nos van a dar la capacidad de posicionar nuestros componentes en el lugar en concreto que nosotros elijamos. Existen distintos tipos de layout en android, aquí vamos a ver los más comunes:

RelativeLayout:

Este layout nos permite colocar nuestros componentes de forma relativa a otros componentes, es decir, encima de un componente y a la derecha de otro componente, etc. Para ello, este layout nos proporciona diferentes opciones para ir colocando nuestros componentes en cierto orden relativo:



  • android: layout_below: Posiciona el componente debajo del componente dado.
    • android: layout_below="@+id/textView1". Nos pondrá nuestro componente debajo de textView1.
  • android: layout_toEndOf: Posiciona el componente justamente después del componente dado.
    • android: layout_toEndOf="@+id/textView1".
  • android: layout_toLeftOf: Posiciona el componente a la izquierda del componente dado.
    • android: layout_toLeftOf="@+id/textView1"
  • android: layout_toRightOf: Posiciona el componente a la derecha del componente dado.
    • android:layout_toRightOf="@+id/textView1"
  • android: layout_toStartOf: Posiciona el componente justo al principio del componente dado.
    • android: layout_toStartOf="@+id/textView1"
  • android: layout_width: Ancho de nuestro componente respecto al layout.
    • android:layout_width="Valor numérico o constante"
  • android:layout_height: Alto de nuestro componente respecto al layout.
    • android: layout_height="Valor numérico o constante"
  • android:layout_alignParentLeft: Opción booleana:
    • True: Se alinea a la izquierda del layout.
      • android: layout_alignParentLeft="true"
    • False: No se alinea
      • android: layout_alignParentLeft="false"
  • android:layout_alignParentTop: Opción booleana:
    • True: Se alinea a la izquierda del layout.
      • android: layout_alignParentLeft="true"
    • False: No se alinea
      • android: layout_alignParentLeft="false"

Bien, solo hemos puestos unos pocos para que os vayáis haciendo una idea, hay más, podéis ir a mirar en la API.


LinearLayout:

Este layout va colocando los componentes uno seguido de otro, existen 2 versiones de este layout:

  1. Vertical: Pone los componentes uno tras otro de forma vertical
  2. Horizontal: Pone los componentes uno tras otro de forma horizontal

Los atributos más utilizados de este layout son:
  • android:orientation: Nos permite cambiar la orientación del layout
    • Horizontal
    • Vertical
  • android:gravity: Atributo que nos permite posicionar los componentes del layout. Algunas de las constantes mas utilizadas para este atributo son:
    • right
    • left
    • center
    • top
    • bottom
  • android:divider: Atributo que nos permite crear una separación entre los componentes del layout, pero para ello tendremos que crear un archivo xml para crear esa separación ciertamente, así que será explicada más adelante.
    • android:divider="@drawable/archivo"
FrameLayout:

Este tipo de layout coloca nuestros componentes en la parte superior izquierda. Podréis apreciar en vuestro IDE que nos amontona todos los componentes uno encima de otro.


Los atributos para este layout:
  • android: foreground: Atributo que define un fondo para el layout. Los fondos los debéis de guardar en la carpeta drawable.
    • android:foreground="@drawable/fondo"
  • android: gravityForeground: Atributo que marca la posición que va a tener nuestro fondo.
    • android:gravityForeground="center"
  • android: measureAllChildren: Atributo booleano. Determina si se tiene que entender en cuenta si el componente esta visible o invisible.
    • android:meassureAllChildren="true"
Bien amigos, hasta aquí los layout, hay algunos más, yo solo he puesto los más usados y los mejores para iniciarse. Existe también el TableLayout, que a los que han visto HTML les irá muy bien, ya que trabaja casi de la misma forma, pero le haré mención especial en un tema aparte.

Un saludo



No hay comentarios:

Publicar un comentario