Constraint Layout에서 Barrier와 Guideline의 차이점은 무엇입니까?


92

최근에 구현하려고 시도 Constraint Layout했지만 동일한 것을 발견 Barrier하고 Guideline작동합니다. 둘 다 분배기처럼 작동합니다. 그들 사이에 어떤 차이가 있습니까?

답변:


201

장벽을 사용하는 경우

TextView동적 높이 가있는 두 개의 위젯이 Button있고 가장 높은 위젯 바로 아래 에 배치하려고 한다고 가정합니다 TextView.

작업보기

레이아웃에 직접 그것을 구현하는 방법은 수평을 사용하는 것입니다 Barrier. 그것은 Barrier당신이 그 두의 높이에 따라 제약 조건을 지정할 수 TextView의. 그런 다음 상단을 Button수평 하단으로 제한합니다 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>

지침을 사용해야하는 경우

TextView콘텐츠에 관계없이 위에서 언급 한 높이를 화면 높이의 30 % 로 제한한다고 가정합니다 .

테스트보기

이를 구현하려면 Guideline백분율 위치와 함께 수평 을 추가 하고 TextView아래쪽을 해당 위치로 제한 해야합니다 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>

결론

유일한 차이점은 사이 BarrierGuideline점이다 Barrier의 위치가 유연하고 항상 포함 여러 UI 요소의 크기를 기준 Guideline의 위치는 항상 고정되어있다 '는.


귀중한 답변!
Alireza Noorali

주장 : "레이아웃에서 직접 구현하는 유일한 방법은 수평 장벽을 사용하는 것입니다." 거짓입니다. 두 텍스트 상자가 아래에 지침으로 제한되도록하여이를위한 지침을 사용할 수 있습니다. (Ieapp:layout_constraintBottom_toTopOf="@id/guideline"
Chrispher

11

Barrier에 대한 공식 문서 :

Barrier는 여러 위젯을 입력으로 참조하고 지정된 쪽에서 가장 극단적 인 위젯을 기반으로 가상 가이드 라인을 만듭니다. 예를 들어 왼쪽 장벽은 참조 된 모든 뷰의 왼쪽에 정렬됩니다.

Barrier에 대한 교육 문서 :

지침과 마찬가지로 장벽은 뷰를 제한 할 수있는 보이지 않는 선입니다. 장벽이 자신의 위치를 ​​정의하지 않는 것을 제외하고는; 대신 장벽 위치는 그 안에 포함 된보기의 위치에 따라 이동합니다. 이는 특정보기가 아닌보기 세트로보기를 제한하려는 경우에 유용합니다.

당사 사이트를 사용함과 동시에 당사의 쿠키 정책개인정보 보호정책을 읽고 이해하였음을 인정하는 것으로 간주합니다.
Licensed under cc by-sa 3.0 with attribution required.