Android ConstraintLayout用Barrier实现视图组顶部对齐父布局

你之前的布局问题出在两个地方：

• 把ImageView的上下边缘都绑定到TextView，导致TextView被强制拉伸至与ImageView同高，文本会垂直居中显示，不符合需求；
• Barrier的用法有误，你仅创建了Barrier但没有将控件约束到它，因此无法起到预期的对齐作用。

根据你的需求，这里提供两种可行的布局方案：

方案一：TextView高度自适应（短文本仅显示自身高度） #

这种方案下，短文本的TextView仅占用自身内容高度，顶部与ImageView、父布局顶部对齐；长文本时TextView自然向下延伸。

<ImageView
    android:id="@+id/view1"
    android:layout_width="100dp"
    android:layout_height="100dp"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent"
    app:layout_constraintEnd_toStartOf="@id/view2" />

<TextView
    android:id="@+id/view2"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    app:layout_constraintStart_toEndOf="@id/view1"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintTop_toTopOf="parent" />

方案二：短文本TextView底部对齐ImageView底部 #

如果希望短文本时TextView的底部与ImageView底部对齐，同时文本保持顶部显示，可以添加垂直偏移约束：

<ImageView
    android:id="@+id/view1"
    android:layout_width="100dp"
    android:layout_height="100dp"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent"
    app:layout_constraintEnd_toStartOf="@id/view2" />

<TextView
    android:id="@+id/view2"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    app:layout_constraintStart_toEndOf="@id/view1"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintTop_toTopOf="parent"
    app:layout_constraintBottom_toBottomOf="@id/view1"
    app:layout_constraintVertical_bias="0.0" />

两种方案都能满足你的核心需求：

• 长文本时，TextView顶部对齐父布局，ImageView同步顶部对齐，文本自然向下延伸；
• 短文本时，ImageView顶部对齐父布局，TextView顶部同步对齐（方案二额外保持底部与ImageView对齐）。

内容的提问来源于stack exchange，提问作者frangulyan