Android约束布局中心对齐两个文本字段

Question

我想将两个项目与另一个元素居中对齐，但我遇到了问题。

现在，如果我将顶部文本限制在左侧元素的顶部，将底部文本限制在左侧元素的底部并将它们链接起来。整个文本将移动。我想修复顶部的文本元素，但如果文本较少，它仍然居中

答案尚未涵盖的另一个条件是，如果顶部文本超过一行

Answer 1

在左侧视图的 50% 垂直标记处放置 Space。然后，您可以像这样将其他视图垂直约束到 Space：

<androidx.constraintlayout.widget.ConstraintLayout 
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <View
        android:id="@+id/view"
        android:layout_width="200dp"
        android:layout_height="200dp"
        android:layout_marginStart="16dp"
        android:background="#8BC34A"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <Space
        android:id="@+id/space"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:layout_constraintBottom_toBottomOf="@id/view"
        app:layout_constraintStart_toEndOf="@id/view"
        app:layout_constraintTop_toTopOf="@id/view" />


    <TextView
        android:id="@+id/textView2"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginStart="16dp"
        android:layout_marginBottom="16dp"
        android:text="This is the upper TextView."
        app:layout_constraintBottom_toBottomOf="@+id/space"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toEndOf="@+id/view" />

    <TextView
        android:id="@+id/textView3"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginStart="16dp"
        android:layout_marginTop="16dp"
        android:text="This is the lower TextView. This is the lower TextView. This is the lower TextView. This is the lower TextView. This is the lower TextView. This is the lower TextView. This is the lower TextView."
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toEndOf="@+id/view"
        app:layout_constraintTop_toTopOf="@+id/space" />

</androidx.constraintlayout.widget.ConstraintLayout>

单行文本如下所示：

对于底部的多行文本，TextView 类似这样：

---

---

为了解决注释，如果顶部 TextView 可以有多行并且只能向下移动，则添加一个带有 空格 和顶部 TextView作为引用的id如下：

<androidx.constraintlayout.widget.ConstraintLayout 
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <View
        android:id="@+id/view"
        android:layout_width="200dp"
        android:layout_height="200dp"
        android:layout_marginStart="16dp"
        android:background="#8BC34A"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <Space
        android:id="@+id/space"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:layout_constraintBottom_toBottomOf="@id/view"
        app:layout_constraintStart_toEndOf="@id/view"
        app:layout_constraintTop_toTopOf="@id/view" />

    <TextView
        android:id="@+id/helperView"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginStart="16dp"
        android:layout_marginBottom="16dp"
        android:text="A"
        app:layout_constraintBottom_toBottomOf="@+id/space"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toEndOf="@+id/view"
        tools:visibility="invisible" />

    <TextView
        android:id="@+id/textView1"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginStart="16dp"
        android:text="This is the upper TextView."
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toEndOf="@+id/view"
        app:layout_constraintTop_toTopOf="@id/helperView" />

    <TextView
        android:id="@+id/textView2"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginStart="16dp"
        android:layout_marginTop="16dp"
        android:text="This is the lower TextView."
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toEndOf="@+id/view"
        app:layout_constraintTop_toBottomOf="@id/barrier" />

    <androidx.constraintlayout.widget.Barrier
        android:id="@+id/barrier"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        app:barrierDirection="bottom"
        app:constraint_referenced_ids="space,textView1" />
</androidx.constraintlayout.widget.ConstraintLayout>