En este tutorial vamos a ver las características de un linear layout en Android Studio. Este componente te permite acomodar los componentes de la interfaz de usuario de manera lineal, puede ser tanto horizontal como vertical.
El linear layout se puede usar para ser el principal layout de tu UI o bien para ser una parte de la misma, o ambos casos. Es decir, es muy útil y lo puedes usar cuando desees, no solo al principio de tu código.
El linear layout se refiere a una de las maneras para acomodar los componentes de la UI. Y juega un papel muy importante junto con RelativeLayout y otros mas.
Linear layout permite acomodar los componentes de tu UI, de manera lineal. Es decir, acomodara los componentes uno enseguida de otro, así que es muy fácil saber que componente va enseguida de otro, a diferencia que el en Relative layout, en el cual tienes que especificar en donde irá cada componente. Aunque esto ultimo es mas dificil en el Relative layout, es una ventaja en cuanto a mas maneras de acomodar todo.
Orientación.
Uno de los aspectos fundamentales del linear layout es la orientación. Por default usa orientación horizontal. Y solo puedes alternar entre Horizontal y Vertical.
Si usas un linear layout, pero por mas que añades componentes, no aparecen en la vista previa de tu proyecto, entonces deverias echar un ojo a la orientación. Si no le tienes una orientación definida, se acomodaran de manera horizontal, es decir uno al lado de otro. Y si quieres que aparezcan debajo, por obvias razones no los veras debajo.
Dependiendo de la orientación que le des, se pueden acomodar por debajo del anterior ( si usas orientación vertical) o bien al lado derecho del anterior ( si usas orientación horizontal).
La instrucción es:
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
>
<!--Aquí va el contenido -->
</LinearLayout>Un ejemplo es el siguiente, donde colocamos 3 botones, y simplemente cambiando la orientación veremos diferentes resultados.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
android:orientation="vertical"
tools:context=".MainActivity">
<Button
android:id="@+id/id_boton"
android:layout_width="100dp"
android:layout_height="wrap_content"
android:text="A"
/>
<Button
android:layout_width="100dp"
android:layout_height="wrap_content"
android:text="B"
/>
<Button
android:layout_width="100dp"
android:layout_height="wrap_content"
android:text="C"
/>
</LinearLayout>Si dejamos la orientación como vertical, tendremos lo siguiente.
Si cambiamos la orientación a horizontal entonces se vera así:
android:orientation="horizontal"
Ajustando el tamaño.
Al igual que en todos los componentes, Linear Layout tiene la opción de ajustar su tamaño (alto y ancho). Con los comandos:
android:layout_width="match_parent" android:layout_height="wrap_content"
- Si quieres que cubra toda la pantalla usa “Match parent”, así se ajusta al componente Padre, y si es el Layout principal entonces cubrirá toda la pantalla.
- Para que el tamaño sea en base al contenido entonces usa: “Wrap content”
- Cuando necesites un tamaño especifico puedes colocar el valor seguido por “dp”.
android:layout_width="100dp" android:layout_height="wrap_content"
Color o imagen de fondo
Al igual que el resto de los componentes del xml en Android Studio. El linear layout puede tener un color de fondo o alguna imagen.
Para elegir esto se hace exactamente igual que en cualquier otro componente, usando el siguiente comando:
android:background="@color/colorPrimaryDark"
Puedes elegir cualquier color, hasta puedes usar código de colores por ejemplo, en el siguiente comando le damos un tono azul al fondo.
android:background="#00f"
Además puedes agregar imágenes en ves de colores, simplemente tomando la imagen de la carpeta donde este:
android:background="@drawable/ic_launcher_background"
Margenes.
Otro de los comandos importantes es el de añadir margen al layout.
Para añadir margen del lado derecho o bien del lado izquierdo se usa el comando, añadiendo un “dp” que es la unidad para el tamaño del margen:
android:layout_marginLeft="10dp" android:layout_marginRight="10dp"
Un margen superior o inferior se obtiene con:
android:layout_marginTop="20dp" android:layout_marginBottom="20dp"
Si quieres dar el mismo margen a todo el contorno entonces deberás usar:
android:padding="10dp"
Con este comando añadirás un margen alrededor del layout.
Linear layout tiene bastantes mas instrucciones, pero en este tutorial solo explicaremos las anteriores ya que las consideramos mas importantes.
Ve más tutoriales de Android aqui.