Capitulo 21 ➜ LinearLayout

LinearLayout es uno de los layouts más utilizados en Android para organizar elementos de la interfaz de usuario de forma lineal, ya sea horizontal o verticalmente. Es un layout flexible y fácil de usar que te permite posicionar elementos uno al lado del otro o uno encima del otro.

Para usar un LinearLayout en Android Studio, sigue estos pasos:

1. Agrega la dependencia de androidx.appcompat:appcompat a tu proyecto:

Asegúrate de tener la dependencia de androidx.appcompat:appcompat en tu archivo build.gradle (Módulo: aplicación). Esta dependencia es necesaria para usar algunas de las propiedades de LinearLayout.

dependencies {
    implementation 'androidx.appcompat:appcompat:1.3.1'
    // ...
}

2. Crea un LinearLayout en tu archivo de diseño XML:

Utiliza la siguiente etiqueta XML para definir un LinearLayout en tu archivo de diseño XML:

XML

<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">

    </LinearLayout>

En este ejemplo, se crea un LinearLayout vertical que ocupa todo el ancho y alto de la pantalla. Puedes cambiar la orientación a horizontal si deseas que los elementos se dispongan de forma horizontal.

3. Agrega elementos a tu LinearLayout:

Puedes agregar cualquier tipo de vista a tu LinearLayout, como TextViews, ImageViews, Buttons, etc. Por ejemplo, puedes agregar el siguiente código XML para agregar un TextView y un ImageView a tu LinearLayout:

XML

<TextView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:text="Título de la vista"
    android:textSize="18sp"
    android:layout_margin="16dp" />

<ImageView
    android:layout_width="match_parent"
    android:layout_height="150dp"
    android:src="@drawable/image"
    android:layout_below="@id/textView" />

En este ejemplo, se agrega un TextView con el texto "Título de la vista" y un ImageView con la imagen "image.jpg" al LinearLayout.

4. Personaliza la apariencia de tu LinearLayout:

Puedes personalizar la apariencia de tu LinearLayout utilizando los siguientes atributos XML:

• android:layout_width: Establece el ancho del LinearLayout. Puede ser match_parent, wrap_content o un valor de dimensión en píxeles.
• android:layout_height: Establece la altura del LinearLayout. Puede ser match_parent, wrap_content o un valor de dimensión en píxeles.
• android:orientation: Establece la orientación del LinearLayout. Puede ser vertical o horizontal.
• android:weightSum: Establece la suma total de pesos para la distribución del espacio entre los elementos del LinearLayout.
• android:layout_weight: Establece el peso de un elemento individual para la distribución del espacio dentro del LinearLayout.
• android:padding: Establece el relleno alrededor del contenido del LinearLayout.
• android:layout_margin: Establece los márgenes alrededor del LinearLayout.

Ejemplo de código completo:

XML

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:padding="16dp">

    <TextView
        android:id="@+id/textView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Título de la vista"
        android:textSize="18sp"
        android:layout_margin="16dp" />

    <ImageView
        android:layout_width="match_parent"
        android:layout_height="150dp"
        android:src="@drawable/image"
        android:layout_below="@id/textView" />

</LinearLayout>