Sự khác biệt giữa Rào cản và Hướng dẫn trong Bố cục Ràng buộc là gì?

Question 1

Gần đây đang cố gắng thực hiện Constraint Layoutnhưng tôi thấy Barriervà Guidelinehoạt động như nhau. Cả hai đều hoạt động giống như bộ chia. Có sự khác biệt nào giữa chúng không?

Question 2

Khi nào sử dụng rào cản

Giả sử bạn có hai TextViewtiện ích con có độ cao động và bạn muốn đặt một tiện ích con Buttonngay dưới độ cao nhất TextView:

Cách DUY NHẤT để triển khai điều đó trực tiếp trong bố cục là sử dụng chiều ngang Barrier. Điều đó Barriercho phép bạn chỉ định một ràng buộc dựa trên chiều cao của hai TextViews đó. Sau đó, bạn cố định phần trên cùng của bạn Buttonvới phần dưới cùng của chiều ngang 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>

Khi nào sử dụng các nguyên tắc

Giả sử bạn muốn giới hạn TextViewchiều cao nêu trên ở mức 30% chiều cao màn hình, bất kể nội dung đó có.

Để thực hiện điều đó, bạn nên thêm chiều ngang Guidelinevới vị trí phần trăm và giới hạn phần TextViewdưới cùng với vị trí đó 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>

Phần kết luận

Sự khác biệt duy nhất giữa Barriervà Guidelinelà Barriervị trí của đó là linh hoạt và luôn dựa trên kích thước của nhiều phần tử giao diện người dùng có trong nó và Guidelinevị trí của luôn cố định.

Question 3

Tài liệu chính thức về Barrier :

Một Rào cản tham chiếu đến nhiều tiện ích con làm đầu vào và tạo một hướng dẫn ảo dựa trên tiện ích con cực đoan nhất ở phía được chỉ định. Ví dụ: một hàng rào bên trái sẽ căn bên trái của tất cả các chế độ xem được tham chiếu.

Tài liệu đào tạo về Barrier :

Tương tự như một kim chỉ nam, một rào cản là một đường vô hình mà bạn có thể hạn chế các quan điểm. Ngoại trừ một rào cản không xác định vị trí của chính nó; thay vào đó, vị trí rào cản di chuyển dựa trên vị trí của các khung nhìn chứa bên trong nó. Điều này hữu ích khi bạn muốn giới hạn một chế độ xem trong một tập hợp các chế độ xem thay vì một chế độ xem cụ thể.