如何在 ConstraintLayout 中将我的 TextView 对齐到其他 2 个视图下方？
How do I align my TextView below 2 other Views in a ConstraintLayout?
我使用 ConstraintLayout 有一段时间了，到目前为止一直很喜欢它，但是 运行 遇到了布局对齐问题。这是我拥有的：
您看到 TextView 有文本 Requested time，我希望此视图始终对齐在 LinearLayout（ 即在它上方 ) 以及右侧评级栏下方。为此，我已将其上部锚点锚定到 LinearLayout，但似乎无法将其限制在右侧评级栏下方对齐。我的意思是，我只能对每条边设置一个约束吗？
请注意，我也不能假设 LinearLayout 的高度总是大于或小于（图像视图 + 评级栏）的高度。因此，两者中更深入的观点将决定请求时间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"
xmlns:tools="http://schemas.android.com/tools"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="4dp"
android:layout_marginBottom="4dp"
android:layout_marginLeft="8dp"
android:layout_marginStart="8dp"
android:layout_marginRight="8dp"
android:layout_marginEnd="8dp"
android:background="@color/lightGrey"
android:id="@+id/constraintLayout">
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:orientation="vertical"
app:layout_constraintTop_toTopOf="parent"
android:layout_marginLeft="16dp"
android:layout_marginStart="16dp"
android:layout_marginTop="16dp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toLeftOf="@+id/guideline"
android:layout_marginRight="8dp"
android:layout_marginEnd="8dp"
app:layout_constraintHorizontal_bias="0.0"
android:id="@+id/linearLayout"
tools:layout_editor_absoluteY="16dp">
<TextView
android:text="@string/tutor_name"
android:textStyle="bold"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="@+id/tutor_name"/>
<TextView
android:text="@string/tutor_skill_set"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="12dp"
android:id="@+id/skill_set"/>
<TextView
android:text="@string/tutor_types"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="12dp"
android:id="@+id/tutor_types" />
<TextView
android:text="@string/tutor_location"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="@+id/location"
android:layout_marginTop="12dp" />
</LinearLayout>
<ImageView
android:id="@+id/display_pic"
android:layout_width="80dp"
android:layout_height="80dp"
android:layout_alignParentEnd="true"
android:layout_alignParentRight="true"
android:layout_marginEnd="16dp"
android:layout_marginLeft="8dp"
android:layout_marginRight="16dp"
android:layout_marginStart="8dp"
android:layout_marginTop="16dp"
android:adjustViewBounds="false"
android:scaleType="centerCrop"
app:layout_constraintHorizontal_bias="1.0"
app:layout_constraintLeft_toLeftOf="@+id/guideline"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="@android:color/holo_red_light" />
<com.iarcuschin.simpleratingbar.SimpleRatingBar
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/tutor_rating"
android:layout_below="@+id/display_pic"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true"
app:srb_starSize="13dp"
app:srb_numberOfStars="5"
app:srb_borderColor="@color/colorAccent"
app:srb_fillColor="@color/colorPrimary"
app:srb_starBorderWidth="1"
app:srb_isIndicator="true"
app:layout_constraintRight_toRightOf="@+id/display_pic"
android:layout_marginTop="8dp"
app:layout_constraintTop_toBottomOf="@+id/display_pic"
android:layout_marginLeft="8dp"
android:layout_marginStart="8dp"
app:layout_constraintLeft_toLeftOf="@+id/guideline"
app:layout_constraintHorizontal_bias="1.0" />
<android.support.constraint.Guideline
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/guideline"
android:orientation="vertical"
app:layout_constraintGuide_percent="0.6796875" />
<TextView
android:id="@+id/tutor_requested_time"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Requested time"
android:textStyle="italic"
android:layout_marginStart="32dp"
android:layout_marginLeft="32dp"
tools:layout_editor_absoluteX="30dp"
android:layout_marginTop="47dp"
app:layout_constraintTop_toBottomOf="@+id/linearLayout" />
</android.support.constraint.ConstraintLayout>
一个半解决方案，我试过并且有效（虽然不是真的）：
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="4dp"
android:layout_marginBottom="4dp"
android:layout_marginLeft="8dp"
android:layout_marginStart="8dp"
android:layout_marginRight="8dp"
android:layout_marginEnd="8dp"
android:background="@color/lightGrey">
<android.support.constraint.ConstraintLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="10dp"
android:paddingBottom="10dp"
android:elevation="2dp"
android:id="@+id/constraintLayout">
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:orientation="vertical"
app:layout_constraintTop_toTopOf="parent"
android:layout_marginLeft="16dp"
android:layout_marginStart="16dp"
android:layout_marginTop="16dp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toLeftOf="@+id/guideline"
android:layout_marginRight="8dp"
android:layout_marginEnd="8dp"
app:layout_constraintHorizontal_bias="0.0"
android:id="@+id/linearLayout"
tools:layout_editor_absoluteY="16dp">
<TextView
android:text="@string/tutor_name"
android:textStyle="bold"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="@+id/tutor_name"/>
<TextView
android:text="@string/tutor_skill_set"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="12dp"
android:id="@+id/skill_set"/>
<TextView
android:text="@string/tutor_types"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="12dp"
android:id="@+id/tutor_types" />
<TextView
android:text="@string/tutor_location"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="@+id/location"
android:layout_marginTop="12dp" />
</LinearLayout>
<ImageView
android:id="@+id/display_pic"
android:layout_width="80dp"
android:layout_height="80dp"
android:layout_alignParentEnd="true"
android:layout_alignParentRight="true"
android:layout_marginEnd="16dp"
android:layout_marginLeft="8dp"
android:layout_marginRight="16dp"
android:layout_marginStart="8dp"
android:layout_marginTop="16dp"
android:adjustViewBounds="false"
android:scaleType="centerCrop"
app:layout_constraintHorizontal_bias="1.0"
app:layout_constraintLeft_toLeftOf="@+id/guideline"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="@android:color/holo_red_light" />
<com.iarcuschin.simpleratingbar.SimpleRatingBar
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/tutor_rating"
android:layout_below="@+id/display_pic"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true"
app:srb_starSize="13dp"
app:srb_numberOfStars="5"
app:srb_borderColor="@color/colorAccent"
app:srb_fillColor="@color/colorPrimary"
app:srb_starBorderWidth="1"
app:srb_isIndicator="true"
app:layout_constraintRight_toRightOf="@+id/display_pic"
android:layout_marginTop="8dp"
app:layout_constraintTop_toBottomOf="@+id/display_pic"
android:layout_marginLeft="8dp"
android:layout_marginStart="8dp"
app:layout_constraintLeft_toLeftOf="@+id/guideline"
app:layout_constraintHorizontal_bias="1.0" />
<android.support.constraint.Guideline
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/guideline"
android:orientation="vertical"
app:layout_constraintGuide_percent="0.6796875" />
</android.support.constraint.ConstraintLayout>
<TextView
android:id="@+id/tutor_requested_time"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="32dp"
android:text="Requested time"
android:textStyle="italic"
android:layout_marginStart="32dp"
android:layout_marginBottom="8dp"
android:layout_below="@+id/constraintLayout" />
</RelativeLayout>
此 解决方案 有其自身的问题，为此我发布了另一个没有答案的问题：
而且，它也有点违背了使用 ConstraintLayout 本身的目的...
那么，有人know/have solution/idea 解决过上述问题吗？
ConstraintLayout 中名为 Barrier 的新功能就是您的答案。有关如何执行此操作，请参阅 至 "ConstraintLayout with Barriers; How to constraint to bottom / top of barrier depending on size"。
这是使用 android.support.constraint.Barrier
的示例 Button below 2 TextView
<android.support.constraint.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:id="@+id/text1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintStart_toStartOf="parent"
android:text="TextView1 Line1\nLine2"
android:background="#f00"
/>
<TextView
android:id="@+id/text2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="16dp"
android:text="TextView2 Line1\nLine2\nLine3\nLine4"
app:layout_constraintStart_toEndOf="@+id/text1"
android:background="#0ff"
/>
<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="text1,text2" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button below text 1 and text 2"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/barrier"
android:background="#eee"
/>
</android.support.constraint.ConstraintLayout>
注意：在本例中，barrierDirection 是 "bottom"，您可以使用其他值来实现其他目的，例如 "top"、"start"、"end" , "left", "right"
我使用 ConstraintLayout 有一段时间了，到目前为止一直很喜欢它，但是 运行 遇到了布局对齐问题。这是我拥有的：
您看到 TextView 有文本 Requested time，我希望此视图始终对齐在 LinearLayout（ 即在它上方 ) 以及右侧评级栏下方。为此，我已将其上部锚点锚定到 LinearLayout，但似乎无法将其限制在右侧评级栏下方对齐。我的意思是，我只能对每条边设置一个约束吗？
请注意，我也不能假设 LinearLayout 的高度总是大于或小于（图像视图 + 评级栏）的高度。因此，两者中更深入的观点将决定请求时间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"
xmlns:tools="http://schemas.android.com/tools"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="4dp"
android:layout_marginBottom="4dp"
android:layout_marginLeft="8dp"
android:layout_marginStart="8dp"
android:layout_marginRight="8dp"
android:layout_marginEnd="8dp"
android:background="@color/lightGrey"
android:id="@+id/constraintLayout">
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:orientation="vertical"
app:layout_constraintTop_toTopOf="parent"
android:layout_marginLeft="16dp"
android:layout_marginStart="16dp"
android:layout_marginTop="16dp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toLeftOf="@+id/guideline"
android:layout_marginRight="8dp"
android:layout_marginEnd="8dp"
app:layout_constraintHorizontal_bias="0.0"
android:id="@+id/linearLayout"
tools:layout_editor_absoluteY="16dp">
<TextView
android:text="@string/tutor_name"
android:textStyle="bold"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="@+id/tutor_name"/>
<TextView
android:text="@string/tutor_skill_set"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="12dp"
android:id="@+id/skill_set"/>
<TextView
android:text="@string/tutor_types"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="12dp"
android:id="@+id/tutor_types" />
<TextView
android:text="@string/tutor_location"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="@+id/location"
android:layout_marginTop="12dp" />
</LinearLayout>
<ImageView
android:id="@+id/display_pic"
android:layout_width="80dp"
android:layout_height="80dp"
android:layout_alignParentEnd="true"
android:layout_alignParentRight="true"
android:layout_marginEnd="16dp"
android:layout_marginLeft="8dp"
android:layout_marginRight="16dp"
android:layout_marginStart="8dp"
android:layout_marginTop="16dp"
android:adjustViewBounds="false"
android:scaleType="centerCrop"
app:layout_constraintHorizontal_bias="1.0"
app:layout_constraintLeft_toLeftOf="@+id/guideline"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="@android:color/holo_red_light" />
<com.iarcuschin.simpleratingbar.SimpleRatingBar
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/tutor_rating"
android:layout_below="@+id/display_pic"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true"
app:srb_starSize="13dp"
app:srb_numberOfStars="5"
app:srb_borderColor="@color/colorAccent"
app:srb_fillColor="@color/colorPrimary"
app:srb_starBorderWidth="1"
app:srb_isIndicator="true"
app:layout_constraintRight_toRightOf="@+id/display_pic"
android:layout_marginTop="8dp"
app:layout_constraintTop_toBottomOf="@+id/display_pic"
android:layout_marginLeft="8dp"
android:layout_marginStart="8dp"
app:layout_constraintLeft_toLeftOf="@+id/guideline"
app:layout_constraintHorizontal_bias="1.0" />
<android.support.constraint.Guideline
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/guideline"
android:orientation="vertical"
app:layout_constraintGuide_percent="0.6796875" />
<TextView
android:id="@+id/tutor_requested_time"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Requested time"
android:textStyle="italic"
android:layout_marginStart="32dp"
android:layout_marginLeft="32dp"
tools:layout_editor_absoluteX="30dp"
android:layout_marginTop="47dp"
app:layout_constraintTop_toBottomOf="@+id/linearLayout" />
</android.support.constraint.ConstraintLayout>
一个半解决方案，我试过并且有效（虽然不是真的）：
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="4dp"
android:layout_marginBottom="4dp"
android:layout_marginLeft="8dp"
android:layout_marginStart="8dp"
android:layout_marginRight="8dp"
android:layout_marginEnd="8dp"
android:background="@color/lightGrey">
<android.support.constraint.ConstraintLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginBottom="10dp"
android:paddingBottom="10dp"
android:elevation="2dp"
android:id="@+id/constraintLayout">
<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:orientation="vertical"
app:layout_constraintTop_toTopOf="parent"
android:layout_marginLeft="16dp"
android:layout_marginStart="16dp"
android:layout_marginTop="16dp"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toLeftOf="@+id/guideline"
android:layout_marginRight="8dp"
android:layout_marginEnd="8dp"
app:layout_constraintHorizontal_bias="0.0"
android:id="@+id/linearLayout"
tools:layout_editor_absoluteY="16dp">
<TextView
android:text="@string/tutor_name"
android:textStyle="bold"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="@+id/tutor_name"/>
<TextView
android:text="@string/tutor_skill_set"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="12dp"
android:id="@+id/skill_set"/>
<TextView
android:text="@string/tutor_types"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="12dp"
android:id="@+id/tutor_types" />
<TextView
android:text="@string/tutor_location"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="@+id/location"
android:layout_marginTop="12dp" />
</LinearLayout>
<ImageView
android:id="@+id/display_pic"
android:layout_width="80dp"
android:layout_height="80dp"
android:layout_alignParentEnd="true"
android:layout_alignParentRight="true"
android:layout_marginEnd="16dp"
android:layout_marginLeft="8dp"
android:layout_marginRight="16dp"
android:layout_marginStart="8dp"
android:layout_marginTop="16dp"
android:adjustViewBounds="false"
android:scaleType="centerCrop"
app:layout_constraintHorizontal_bias="1.0"
app:layout_constraintLeft_toLeftOf="@+id/guideline"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:srcCompat="@android:color/holo_red_light" />
<com.iarcuschin.simpleratingbar.SimpleRatingBar
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/tutor_rating"
android:layout_below="@+id/display_pic"
android:layout_alignParentRight="true"
android:layout_alignParentEnd="true"
app:srb_starSize="13dp"
app:srb_numberOfStars="5"
app:srb_borderColor="@color/colorAccent"
app:srb_fillColor="@color/colorPrimary"
app:srb_starBorderWidth="1"
app:srb_isIndicator="true"
app:layout_constraintRight_toRightOf="@+id/display_pic"
android:layout_marginTop="8dp"
app:layout_constraintTop_toBottomOf="@+id/display_pic"
android:layout_marginLeft="8dp"
android:layout_marginStart="8dp"
app:layout_constraintLeft_toLeftOf="@+id/guideline"
app:layout_constraintHorizontal_bias="1.0" />
<android.support.constraint.Guideline
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:id="@+id/guideline"
android:orientation="vertical"
app:layout_constraintGuide_percent="0.6796875" />
</android.support.constraint.ConstraintLayout>
<TextView
android:id="@+id/tutor_requested_time"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginLeft="32dp"
android:text="Requested time"
android:textStyle="italic"
android:layout_marginStart="32dp"
android:layout_marginBottom="8dp"
android:layout_below="@+id/constraintLayout" />
</RelativeLayout>
此 解决方案 有其自身的问题，为此我发布了另一个没有答案的问题：
而且，它也有点违背了使用 ConstraintLayout 本身的目的...
那么，有人know/have solution/idea 解决过上述问题吗？
ConstraintLayout 中名为 Barrier 的新功能就是您的答案。有关如何执行此操作，请参阅
这是使用 android.support.constraint.Barrier
Button below 2 TextView
<android.support.constraint.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent">
<TextView
android:id="@+id/text1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
app:layout_constraintStart_toStartOf="parent"
android:text="TextView1 Line1\nLine2"
android:background="#f00"
/>
<TextView
android:id="@+id/text2"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_marginTop="16dp"
android:text="TextView2 Line1\nLine2\nLine3\nLine4"
app:layout_constraintStart_toEndOf="@+id/text1"
android:background="#0ff"
/>
<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="text1,text2" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Button below text 1 and text 2"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/barrier"
android:background="#eee"
/>
</android.support.constraint.ConstraintLayout>
注意：在本例中，barrierDirection 是 "bottom"，您可以使用其他值来实现其他目的，例如 "top"、"start"、"end" , "left", "right"