Membuat tata letak linear

Mencoba cara Compose
Jetpack Compose adalah toolkit UI yang direkomendasikan untuk Android. Pelajari cara bekerja dengan tata letak di Compose.

LinearLayout adalah grup tampilan yang menyejajarkan semua turunan dalam satu arah, baik vertikal maupun horizontal. Anda dapat menentukan arah tata letak dengan atribut android:orientation.

Gambar yang menampilkan tata letak yang dibagi menjadi tiga bagian vertikal
Gambar 1. LinearLayout dengan tiga turunan berorientasi horizontal.

Semua turunan LinearLayout ditumpuk satu sama lain, sehingga daftar vertikal hanya memiliki satu turunan per baris, berapa pun lebarnya. Daftar horizontal hanya setinggi satu baris, dan tingginya adalah tinggi turunan yang tertinggi, ditambah padding. LinearLayout mematuhi margin antara turunan, dan gravitasi—penyelarasan kanan, tengah, atau kiri —setiap turunan.

Bobot tata letak

LinearLayout juga mendukung penetapan bobot ke masing-masing turunan dengan atribut android:layout_weight. Atribut ini menetapkan nilai "nilai penting" ke tampilan terkait seberapa banyak ruang yang ditempatinya di layar. Nilai bobot yang lebih besar memungkinkannya diperluas untuk mengisi ruang yang tersisa di tampilan induk. Tampilan turunan dapat menentukan nilai bobot, dan ruang yang tersisa dalam kelompok tampilan diberikan ke turunan secara proporsional, berdasarkan bobot yang dideklarasikan untuk mereka. Bobot defaultnya adalah nol.

Distribusi setara

Untuk membuat tata letak linier tempat setiap turunan menggunakan jumlah ruang yang sama di layar, setel android:layout_height setiap tampilan ke "0dp" untuk tata letak vertikal, atau android:layout_width setiap tampilan ke "0dp" untuk tata letak horizontal. Kemudian, setel android:layout_weight setiap tampilan ke "1".

Distribusi tidak setara

Anda juga dapat membuat tata letak linier tempat elemen turunan menggunakan jumlah ruang yang berbeda di layar. Perhatikan contoh berikut:

  • Misalnya, Anda memiliki tiga kolom teks: dua dengan nilai bobot 1, dan ketiga dengan nilai bobot default 0. Kolom teks ketiga, dengan nilai bobot 0, hanya menempati area yang diperlukan oleh kontennya. Dua kolom teks lainnya, dengan nilai bobot 1, akan diperluas secara seimbang untuk mengisi ruang yang tersisa setelah konten ketiga kolom diukur.
  • Jika Anda memiliki tiga kolom teks dengan dua kolom memiliki nilai bobot 1 dan kolom ketiga memiliki bobot 2, maka ruang yang tersisa setelah isi ketiga kolom diukur akan dialokasikan sebagai berikut: separuh untuk kolom dengan nilai bobot 2, dan separuh dibagi secara merata antara kolom dengan nilai bobot 1.

Gambar dan cuplikan kode berikut menunjukkan cara kerja bobot tata letak dalam aktivitas "kirim pesan". Kolom Kepada, baris Subjek, dan tombol Kirim masing-masing hanya mengambil ketinggian yang diperlukan. Area pesan mengambil sisa ketinggian aktivitas.

Gambar yang menampilkan tiga EditText dan satu Tombol dalam LinearLayout berorientasi vertikal
Gambar 2. Tiga kolom teks dan satu tombol dalam LinearLayout berorientasi vertikal.
<?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:paddingLeft="16dp"
    android:paddingRight="16dp"
    android:orientation="vertical" >
    <EditText
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:hint="@string/to" />
    <EditText
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:hint="@string/subject" />
    <EditText
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:gravity="top"
        android:hint="@string/message" />
    <Button
        android:layout_width="100dp"
        android:layout_height="wrap_content"
        android:layout_gravity="end"
        android:text="@string/send" />
</LinearLayout>

Untuk mengetahui detail tentang atribut yang tersedia pada setiap tampilan turunan LinearLayout, lihat LinearLayout.LayoutParams.