ConstraintLayout：设置行中所有视图的高度以匹配最高的视图
ConstraintLayout: set height of all views in row to match the tallest one
我正在尝试使用 ConstraintLayout（版本 1.0.2）来设置 2 个并排视图的高度以匹配其中最高的一个。这用作 RecyclerView 的 ViewHolder，其中每个 TextView 获得任意长度的文本...
如果我将每个设置为 wrap_content，较短的会缩小。
如果我将两者都设置为 0dp (match_contraints)，则两者最终高度均为 0。
设置如下：
<?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:layout_marginLeft="2dp"
android:layout_marginRight="2dp"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:id="@+id/id1"
android:layout_width="60dp"
android:layout_height="0dp"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toStartOf="@+id/id2"/>
<TextView
android:id="@+id/id2"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toEndOf="@+id/id1"
app:layout_constraintEnd_toEndOf="parent"/>
</android.support.constraint.ConstraintLayout>
我想这是一个错误，因为“0dp”应该更像 match_parent 而不是实际的 0 dp。
在 iOS 上，顺便说一句，等效的自动布局规则（设置视图的高度以匹配父级的顶部和底部）产生预期的结果。
当然，使用 LinearLayout 非常简单，但此布局在更大的布局中起着重要作用，我想 trim 视图层次结构...
这可能对您有所帮助。
<android.support.constraint.ConstraintLayout
android:id="@+id/activity_main"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin">
<TextView
android:id="@+id/tv_1"
android:layout_width="150dp"
android:layout_height="match_parent"
android:layout_marginEnd="8dp"
android:layout_marginRight="8dp"
android:background="@color/colorAccent"
android:gravity="center"
android:padding="@dimen/activity_vertical_margin"
android:text="sjdjhshdjhdjhsdgfjhgsdjfgjsdgfjsdgfhgdsjhfghs"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toLeftOf="@+id/tv_2"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="@+id/tv_2"
android:layout_width="150dp"
android:layout_height="match_parent"
android:background="@color/colorPrimary"
android:gravity="center"
android:padding="@dimen/activity_vertical_margin"
android:text="sjdjhsjhd"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toRightOf="@+id/tv_1"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</android.support.constraint.ConstraintLayout>
正在回答，以防将来有人在寻找答案。
ConstraintLayout introduced Barrier 在 v1.1 中实现 OP 在问题
中提出的一个这样的功能
上面提到的功能可以使用下面的方法实现 xml:
<?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:layout_marginLeft="2dp"
android:layout_marginRight="2dp"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:id="@+id/id1"
android:layout_width="60dp"
android:layout_height="wrap_content"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintBottom_toBottomOf="@+id/barrier"
app:layout_constraintVertical_bias="0.0"
android:text="@string/id1_text" />
<TextView
android:id="@+id/id2"
android:layout_width="0dp"
android:layout_height="wrap_content"
app:layout_constraintLeft_toRightOf="@+id/id1"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="@+id/barrier"
app:layout_constraintVertical_bias="0.0"
android:text="@string/id2_text" />
<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="id1,id2" />
</android.support.constraint.ConstraintLayout>
<TextView
android:id="@+id/txt_service_request_id"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:background="@drawable/bg_rectangle_blue"
android:gravity="center"
android:padding="8dp"
android:text="@string/service_request_id"
android:textColor="@android:color/white"
android:textSize="12sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toStartOf="@+id/txt_service_request_status"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="@+id/txt_service_request_status"
android:layout_width="0dp"
android:layout_height="0dp"
android:background="@drawable/bg_rectangle_blue"
android:gravity="center"
android:padding="8dp"
android:text="@string/service_request_status"
android:textColor="@android:color/white"
android:textSize="12sp"
app:layout_constraintBottom_toBottomOf="@+id/txt_service_request_id"
app:layout_constraintEnd_toStartOf="@+id/txt_service_request_desc"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toEndOf="@+id/txt_service_request_id"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="@+id/txt_service_request_desc"
android:layout_width="0dp"
android:layout_height="0dp"
android:background="@drawable/bg_rectangle_blue"
android:gravity="center"
android:padding="8dp"
android:text="@string/service_request_desc"
android:textColor="@android:color/white"
android:textSize="12sp"
app:layout_constraintBottom_toBottomOf="@+id/txt_service_request_id"
app:layout_constraintEnd_toStartOf="@+id/txt_service_request_cat"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toEndOf="@+id/txt_service_request_status"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="@+id/txt_service_request_cat"
android:layout_width="0dp"
android:layout_height="0dp"
android:background="@drawable/bg_rectangle_blue"
android:gravity="center"
android:padding="8dp"
android:text="@string/service_request_cat"
android:textColor="@android:color/white"
android:textSize="12sp"
app:layout_constraintBottom_toBottomOf="@+id/txt_service_request_id"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toEndOf="@+id/txt_service_request_desc"
app:layout_constraintTop_toTopOf="parent" />
这很棘手而且很慢，但它确实有效。
重点是：
- 为测量高度添加额外的不可见相同布局。这个有
wrap_content 高度属性，所以如果它足够大，它会拉伸父级。
- 将可见布局高度设置为 0dp，这样它将填充父级的其余部分。
如下图所示，我们有两种布局。隐藏的是 wrap_contents
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.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="wrap_content">
<TextView
android:id="@+id/view_1"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:background="#DDDDDD"
android:text="@android:string/yes"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toLeftOf="@+id/view_2"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="@+id/view_1_invisible"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#DDDDDD"
android:text="@android:string/yes"
android:visibility="invisible"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toLeftOf="@+id/view_2"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="@+id/view_2"
android:layout_width="100dp"
android:layout_height="0dp"
android:background="#DDDDDD"
android:text="@android:string/httpErrorBadUrl"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toRightOf="@+id/view_1"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="@+id/view_2_invisible"
android:layout_width="100dp"
android:layout_height="wrap_content"
android:background="#DDDDDD"
android:text="@android:string/httpErrorBadUrl"
android:visibility="invisible"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toRightOf="@+id/view_1"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
我用 LinearLayout
做到了
- parent为高度=包裹内容
- children为身高=匹配parent
- children宽度=0且重量相同
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:orientation="horizontal"
>
<TextView
android:layout_weight="1"
android:id="@+id/id1"
android:layout_height="match_parent"
android:layout_width="0dp"
android:background="@color/green_400"
android:text="11"
android:textSize="50sp"
/>
<TextView
android:layout_weight="1"
android:id="@+id/id2"
android:layout_height="wrap_content"
android:layout_width="0dp"
android:background="@color/cat_grey_lite"
android:text="2222222222"
android:textSize="50sp"
/>
</LinearLayout>
我正在尝试使用 ConstraintLayout（版本 1.0.2）来设置 2 个并排视图的高度以匹配其中最高的一个。这用作 RecyclerView 的 ViewHolder，其中每个 TextView 获得任意长度的文本...
如果我将每个设置为 wrap_content，较短的会缩小。 如果我将两者都设置为 0dp (match_contraints)，则两者最终高度均为 0。
设置如下：
<?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:layout_marginLeft="2dp"
android:layout_marginRight="2dp"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:id="@+id/id1"
android:layout_width="60dp"
android:layout_height="0dp"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintEnd_toStartOf="@+id/id2"/>
<TextView
android:id="@+id/id2"
android:layout_width="0dp"
android:layout_height="0dp"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintStart_toEndOf="@+id/id1"
app:layout_constraintEnd_toEndOf="parent"/>
</android.support.constraint.ConstraintLayout>
我想这是一个错误，因为“0dp”应该更像 match_parent 而不是实际的 0 dp。
在 iOS 上，顺便说一句，等效的自动布局规则（设置视图的高度以匹配父级的顶部和底部）产生预期的结果。
当然，使用 LinearLayout 非常简单，但此布局在更大的布局中起着重要作用，我想 trim 视图层次结构...
这可能对您有所帮助。
<android.support.constraint.ConstraintLayout
android:id="@+id/activity_main"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin">
<TextView
android:id="@+id/tv_1"
android:layout_width="150dp"
android:layout_height="match_parent"
android:layout_marginEnd="8dp"
android:layout_marginRight="8dp"
android:background="@color/colorAccent"
android:gravity="center"
android:padding="@dimen/activity_vertical_margin"
android:text="sjdjhshdjhdjhsdgfjhgsdjfgjsdgfjsdgfhgdsjhfghs"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toLeftOf="@+id/tv_2"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="@+id/tv_2"
android:layout_width="150dp"
android:layout_height="match_parent"
android:background="@color/colorPrimary"
android:gravity="center"
android:padding="@dimen/activity_vertical_margin"
android:text="sjdjhsjhd"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toRightOf="@+id/tv_1"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</android.support.constraint.ConstraintLayout>
正在回答，以防将来有人在寻找答案。
ConstraintLayout introduced Barrier 在 v1.1 中实现 OP 在问题
中提出的一个这样的功能上面提到的功能可以使用下面的方法实现 xml:
<?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:layout_marginLeft="2dp"
android:layout_marginRight="2dp"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<TextView
android:id="@+id/id1"
android:layout_width="60dp"
android:layout_height="wrap_content"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintBottom_toBottomOf="@+id/barrier"
app:layout_constraintVertical_bias="0.0"
android:text="@string/id1_text" />
<TextView
android:id="@+id/id2"
android:layout_width="0dp"
android:layout_height="wrap_content"
app:layout_constraintLeft_toRightOf="@+id/id1"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent"
app:layout_constraintBottom_toBottomOf="@+id/barrier"
app:layout_constraintVertical_bias="0.0"
android:text="@string/id2_text" />
<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="id1,id2" />
</android.support.constraint.ConstraintLayout>
<TextView
android:id="@+id/txt_service_request_id"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:background="@drawable/bg_rectangle_blue"
android:gravity="center"
android:padding="8dp"
android:text="@string/service_request_id"
android:textColor="@android:color/white"
android:textSize="12sp"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toStartOf="@+id/txt_service_request_status"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="@+id/txt_service_request_status"
android:layout_width="0dp"
android:layout_height="0dp"
android:background="@drawable/bg_rectangle_blue"
android:gravity="center"
android:padding="8dp"
android:text="@string/service_request_status"
android:textColor="@android:color/white"
android:textSize="12sp"
app:layout_constraintBottom_toBottomOf="@+id/txt_service_request_id"
app:layout_constraintEnd_toStartOf="@+id/txt_service_request_desc"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toEndOf="@+id/txt_service_request_id"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="@+id/txt_service_request_desc"
android:layout_width="0dp"
android:layout_height="0dp"
android:background="@drawable/bg_rectangle_blue"
android:gravity="center"
android:padding="8dp"
android:text="@string/service_request_desc"
android:textColor="@android:color/white"
android:textSize="12sp"
app:layout_constraintBottom_toBottomOf="@+id/txt_service_request_id"
app:layout_constraintEnd_toStartOf="@+id/txt_service_request_cat"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toEndOf="@+id/txt_service_request_status"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="@+id/txt_service_request_cat"
android:layout_width="0dp"
android:layout_height="0dp"
android:background="@drawable/bg_rectangle_blue"
android:gravity="center"
android:padding="8dp"
android:text="@string/service_request_cat"
android:textColor="@android:color/white"
android:textSize="12sp"
app:layout_constraintBottom_toBottomOf="@+id/txt_service_request_id"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintHorizontal_bias="0.5"
app:layout_constraintStart_toEndOf="@+id/txt_service_request_desc"
app:layout_constraintTop_toTopOf="parent" />
这很棘手而且很慢，但它确实有效。
重点是：
- 为测量高度添加额外的不可见相同布局。这个有
wrap_content高度属性，所以如果它足够大，它会拉伸父级。 - 将可见布局高度设置为 0dp，这样它将填充父级的其余部分。
如下图所示，我们有两种布局。隐藏的是 wrap_contents
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.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="wrap_content">
<TextView
android:id="@+id/view_1"
android:layout_width="wrap_content"
android:layout_height="0dp"
android:background="#DDDDDD"
android:text="@android:string/yes"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toLeftOf="@+id/view_2"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="@+id/view_1_invisible"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="#DDDDDD"
android:text="@android:string/yes"
android:visibility="invisible"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toLeftOf="parent"
app:layout_constraintRight_toLeftOf="@+id/view_2"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="@+id/view_2"
android:layout_width="100dp"
android:layout_height="0dp"
android:background="#DDDDDD"
android:text="@android:string/httpErrorBadUrl"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toRightOf="@+id/view_1"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent" />
<TextView
android:id="@+id/view_2_invisible"
android:layout_width="100dp"
android:layout_height="wrap_content"
android:background="#DDDDDD"
android:text="@android:string/httpErrorBadUrl"
android:visibility="invisible"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintLeft_toRightOf="@+id/view_1"
app:layout_constraintRight_toRightOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
我用 LinearLayout
- parent为高度=包裹内容
- children为身高=匹配parent
- children宽度=0且重量相同
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_height="wrap_content"
android:layout_width="match_parent"
android:orientation="horizontal"
>
<TextView
android:layout_weight="1"
android:id="@+id/id1"
android:layout_height="match_parent"
android:layout_width="0dp"
android:background="@color/green_400"
android:text="11"
android:textSize="50sp"
/>
<TextView
android:layout_weight="1"
android:id="@+id/id2"
android:layout_height="wrap_content"
android:layout_width="0dp"
android:background="@color/cat_grey_lite"
android:text="2222222222"
android:textSize="50sp"
/>
</LinearLayout>