ConstraintLayout内如何为子View设置最小百分比高度避免重叠？

前置要求 #

确保你项目依赖的ConstraintLayout版本在2.0及以上，才支持百分比形式的最小/最大高度约束。

实现逻辑 #

核心逻辑是给父布局设置最小高度为屏幕高度、整体高度自适应，再通过百分比约束保证两个子View的比例下限：

1. 父ConstraintLayout高度设为wrap_content，同时设置最小高度为匹配父布局，保证默认状态下占满全屏
2. 占比25%的普通View设置最大高度占比为25%，内容不够时自适应，内容超出时最多占总高度的25%
3. CardView设置最小高度占比为75%，内容超出默认高度时自动撑开，保证占比始终不低于75%

完整XML示例 #

<?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"
    android:minHeight="match_parent">

    <!-- 占比25%的普通View -->
    <View
        android:id="@+id/topView"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@color/teal_200"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHeight_maxPercent="0.25" />

    <!-- 占比不低于75%的CardView -->
    <androidx.cardview.widget.CardView
        android:id="@+id/cardView"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_marginTop="16dp"
        app:cardCornerRadius="12dp"
        app:layout_constraintTop_toBottomOf="@id/topView"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintHeight_minPercent="0.75">

        <!-- CardView内部布局，高度一定要设为wrap_content，不要写死固定值 -->
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical"
            android:padding="16dp">

            <!-- 此处放CardView的子控件即可 -->
            <TextView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:text="测试文本"
                android:textSize="16sp"/>
            <!-- 更多子控件 -->

        </LinearLayout>

    </androidx.cardview.widget.CardView>

</androidx.constraintlayout.widget.ConstraintLayout>

补充优化 #

如果CardView内容特别多，不想让整体布局无限拉长，可在CardView外层套一层NestedScrollView，同时给NestedScrollView设置app:layout_constraintHeight_minPercent="0.75"，超出高度时可滚动查看内容，避免页面过长。

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