Baru-baru ini mencoba menerapkan Constraint Layout
tetapi saya menemukan Barrier
dan Guideline
bekerja sama. Keduanya bekerja seperti pembatas. Apakah ada perbedaan di antara keduanya?
Baru-baru ini mencoba menerapkan Constraint Layout
tetapi saya menemukan Barrier
dan Guideline
bekerja sama. Keduanya bekerja seperti pembatas. Apakah ada perbedaan di antara keduanya?
Jawaban:
Asumsikan Anda memiliki dua TextView
widget dengan ketinggian dinamis dan Anda ingin menempatkan widget Button
tepat di bawah yang tertinggi TextView
:
Satu- satunya cara untuk menerapkannya secara langsung di tata letak adalah dengan menggunakan horizontal Barrier
. Itu Barrier
memungkinkan Anda untuk menentukan batasan berdasarkan ketinggian keduanya TextView
. Kemudian Anda membatasi bagian atas Anda Button
ke bagian bawah horizontal Barrier
.
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:id="@+id/left_text_view"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:layout_marginEnd="8dp"
android:layout_marginStart="8dp"
android:text="ABCDEFGHIJKLMNOPQRSTUVWXYZ"
android:textSize="16sp"
android:background="#AAA"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toStartOf="@+id/right_text_view"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="@+id/right_text_view"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_marginTop="8dp"
android:layout_marginStart="8dp"
android:layout_marginEnd="8dp"
android:text="abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ1234567890abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ1234567890abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ1234567890"
android:textSize="16sp"
android:background="#DDD"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="@+id/left_text_view"
app:layout_constraintTop_toTopOf="parent" />
<android.support.constraint.Barrier
android:id="@+id/barrier"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:barrierDirection="bottom"
app:constraint_referenced_ids="left_text_view,right_text_view" />
<Button
android:id="@+id/button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="8dp"
android:layout_marginStart="8dp"
android:text="Button"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="@+id/barrier" />
</android.support.constraint.ConstraintLayout>
Asumsikan Anda ingin membatasi TextView
ketinggian yang disebutkan di atas hingga 30% dari tinggi layar, apa pun konten yang dimilikinya.
Untuk mengimplementasikannya Anda harus menambahkan horizontal Guideline
dengan posisi persentase dan membatasi bagian TextView
bawahnya Guideline
.
<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:id="@+id/left_text_view"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginBottom="8dp"
android:layout_marginEnd="8dp"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:background="#AAA"
android:text="ABCDEFGHIJKLMNOPQRSTUVWXYZ"
android:textSize="16sp"
app:layout_constraintBottom_toTopOf="@+id/guideline"
app:layout_constraintEnd_toStartOf="@+id/right_text_view"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="@+id/right_text_view"
android:layout_width="0dp"
android:layout_height="0dp"
android:layout_marginEnd="8dp"
android:layout_marginStart="8dp"
android:layout_marginTop="8dp"
android:layout_marginBottom="8dp"
android:background="#DDD"
android:text="abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ1234567890abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ1234567890abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ1234567890"
android:textSize="16sp"
app:layout_constraintBottom_toTopOf="@+id/guideline"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toEndOf="@+id/left_text_view"
app:layout_constraintTop_toTopOf="parent" />
<Button
android:id="@+id/button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginEnd="8dp"
android:layout_marginStart="8dp"
android:text="Button"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="@+id/guideline" />
<android.support.constraint.Guideline
android:id="@+id/guideline"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
app:layout_constraintGuide_percent="0.3" />
</android.support.constraint.ConstraintLayout>
Satu-satunya perbedaan antara Barrier
dan Guideline
adalah bahwa Barrier
posisinya fleksibel dan selalu didasarkan pada ukuran beberapa elemen UI yang terkandung di dalamnya dan Guideline
posisinya selalu tetap.
app:layout_constraintBottom_toTopOf="@id/guideline"
Dokumentasi resmi tentang Barrier :
Barrier mereferensikan beberapa widget sebagai input, dan membuat panduan virtual berdasarkan widget paling ekstrim di sisi yang ditentukan. Misalnya, penghalang kiri akan sejajar dengan kiri dari semua tampilan yang direferensikan.
Dokumen pelatihan tentang Barrier :
Mirip dengan panduan, penghalang adalah garis tak terlihat yang bisa Anda batasi tampilan. Kecuali penghalang tidak menentukan posisinya sendiri; alih-alih, posisi penghalang bergerak berdasarkan posisi tampilan yang ada di dalamnya. Ini berguna saat Anda ingin membatasi tampilan ke sekumpulan tampilan, bukan ke satu tampilan tertentu.