Jesus Tomás Gironés - El gran libro de Android

px (píxeles): estas dimensiones representan los píxeles en la pantalla.

mm (milímetros): distancia real medida sobre la pantalla.

in (pulgadas): distancia real medida sobre la pantalla.

pt (puntos): equivale a 1/72 pulgadas.

dp (píxeles independientes de la densidad): presupone un dispositivo de 160 píxeles por pulgada. Si luego el dispositivo tiene otra densidad, se realizará el correspondiente ajuste. A diferencia de otras medidas, como mm, in y pt, este ajuste se hace de forma aproximada, dado que no se utiliza la verdadera densidad gráfica, sino el grupo de densidad en que se ha clasificado el dispositivo (ldpi, mdpi, hdpi…). Esta medida presenta varias ventajas cuando se utilizan recursos gráficos en diferentes densidades. Por esta razón, Google insiste en que se utilice siempre esta medida. Desde un punto de vista práctico, un dp equivale aproximadamente a 1/160 pulgadas. Y en dispositivos con densidad gráfica mdpi, un dp es siempre un pixel.

sp (píxeles escalados): similar a dp, pero también se escala en función del tamaño de fuente que el usuario ha escogido en las preferencias. Indicado cuando se trabaja con fuentes.

Recursos adicionales: Tipos de vista y sus atributos

Consulta el anexo D para conocer una lista con todos los descendientes de la clase View y sus atributos.

Preguntas de repaso: Las vistas y sus atributos

Si queremos combinar varios elementos de tipo vista, tendremos que utilizar un objeto de tipo layout. Un layout es un contenedor de una o más vistas y controla su comportamiento y posición. Hay que destacar que un layout puede contener otro layout y que es un descendiente de la clase View.

La siguiente lista describe los layout más utilizados en Android:

LinearLayout: dispone los elementos en una fila o en una columna.

TableLayout: distribuye los elementos de forma tabular.

RelativeLayout: dispone los elementos con relación a otro o al padre.

AbsoluteLayout: Posiciona los elementos de forma absoluta.

FrameLayout: Permite el cambio dinámico de los elementos que contiene.

Dado que un ejemplo vale más que mil palabras, pasemos a mostrar cada uno de estos layouts en acción:

LinearLayout es uno de los layout más utilizado en la práctica. Distribuye los elementos uno detrás de otro, bien de forma horizontal o vertical.

TableLayout distribuye los elementos de forma tabular. Se utiliza la etiqueta cada vez que queremos insertar una nueva línea.

RelativeLayout permite comenzar a situar los elementos en cualquiera de los cuatro lados del contenedor e ir añadiendo nuevos elementos pegados a estos.

AbsoluteLayout permite indicar las coordenadas (x, y) donde queremos que se visualice cada elemento. No es recomendable utilizar este tipo de layout. La aplicación que estamos diseñando tiene que visualizarse correctamente en dispositivos con cualquier tamaño de pantalla. Para conseguirlo, no es una buena idea trabajar con coordenadas absolutas. De hecho, este tipo de layout ha sido marcado como obsoleto.

FrameLayout posiciona las vistas usando todo el contenedor, sin distribuirlas espacialmente. Este layout suele utilizarse cuando queremos que varias vistas ocupen un mismo lugar. Podemos hacer que solo una sea visible, o superponerlas. Para modificar la visibilidad de un elemento utilizaremos la propiedad visibility.

Vídeo[tutorial]: Los layouts en Android

Recursos adicionales: Propiedades de RelativeLayout

La lista de propiedades específicas de RelativeLayout es muy grande. Te recomendamos que la consultes en el anexo D.

Práctica: Uso de layouts

1.Utiliza un RelativeLayout para realizar un diseño similar al siguiente:

2.Utiliza un TableLayout para realizar un diseño similar al siguiente:

3.Utiliza un AbsoluteLayout para realizar un diseño similar al siguiente (¡Ojo! AbsoluteLayout lo encontrarás en la paleta Advanced, no en la de layouts. Trata de reutilizar el layout creado en el punto anterior):

4.Visualiza el resultado obtenido en el punto anterior en diferentes tamaños de pantalla. ¿Ha sido una buena idea usar AbsoluteLayout? ¿Se te ocurre otra forma de realizar este diseño de forma que se visualice correctamente en cualquier tipo de pantalla?

5.Trata de hacer el ejercicio anterior utilizando LinearLayout.

6.Visualiza el resultado obtenido en diferentes tamaños de pantalla. ¿Has resuelto el problema?

Preguntas de repaso: Los layouts

También podemos utilizar otras clases de layouts, que se describen a continuación:

ScrollView: visualiza una columna de elementos; cuando estos no caben en pantalla, se permite un deslizamiento vertical.

HorizontalScrollView: visualiza una fila de elementos; cuando estos no caben en pantalla, se permite un deslizamiento horizontal.

TabHost: proporciona una lista de ventanas seleccionables por medio de etiquetas que pueden ser pulsadas por el usuario para seleccionar la ventana que desea visualizar. Se estudia al final del capítulo.

ListView: visualiza una lista deslizable verticalmente de varios elementos. Su utilización es algo compleja. Se verá un ejemplo en el capítulo siguiente.