约束布局中的障碍和指南有什么区别？

Recently trying to implement Constraint Layout but I found Barrier and Guideline works same. Both works like divider. Is there any difference between them?

最近尝试实施Constraint Layout但我发现Barrier和Guideline的工作原理相同。两者都像分频器一样。它们之间有什么区别吗?

2 个解决方案

#1

WHEN TO USE BARRIERS

什么时候使用障碍

Say you have two TextView widgets with dynamic heights and you want to place a Button just below the tallest TextView:

假设您有两个具有动态高度的TextView小部件,并且您希望在最高的TextView下方放置一个Button:

The ONLY way to implement that directly in the layout is to use a horizontal Barrier. That Barrier allows you to specify a constraint based on the height of those two TextViews. Then you constrain the top of your Button to the bottom of the horizontal Barrier.

直接在布局中实现该方法的唯一方法是使用水平屏障。 Barrier允许您根据这两个TextView的高度指定约束。然后将Button的顶部约束到水平屏障的底部。

<?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>

WHEN TO USE GUIDELINES

何时使用指南

Say you want to restrict the above-mentioned TextView heights to 30% of screen height, no matter the content they have.

假设您希望将上述TextView高度限制为屏幕高度的30%,无论它们具有何种内容。

To implement that you should add horizontal Guideline with percentage position and constrain the TextView bottom to that Guideline.

要实现这一点,您应该添加具有百分比位置的水平指南,并将TextView底部约束到该指南。

<?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>

CONCLUSION

The only difference between Barrier and Guideline is that Barrier's position is flexible and always based on the size of multiple UI elements contained within it and Guideline's position is always fixed.

障碍和指南之间的唯一区别是障碍的位置是灵活的,并且始终基于其中包含的多个UI元素的大小,并且指南的位置始终是固定的。

#2

Official documentation on Barrier:

关于障碍的官方文件:

A Barrier references multiple widgets as input, and creates a virtual guideline based on the most extreme widget on the specified side. For example, a left barrier will align to the left of all the referenced views.

屏障引用多个小部件作为输入,并基于指定侧的最极端小部件创建虚拟指南。例如,左侧屏障将对齐所有引用视图的左侧。

Training docs on Barrier:

关于障碍的培训文档:

Similar to a guideline, a barrier is an invisible line that you can constrain views to. Except a barrier does not define its own position; instead, the barrier position moves based on the position of views contained within it. This is useful when you want to constrain a view to the a set of views rather than to one specific view.

与指南类似,屏障是一条不可见的线,您可以将视图限制为。除了障碍没有定义自己的位置;相反,屏障位置根据其中包含的视图的位置移动。当您想要将视图约束到一组视图而不是一个特定视图时,这非常有用。

#1