如何在ConstraintLayout中限制CardView内ScrollView内容不越界？

问题原因 #

你的布局核心问题在于CardView的高度设置错误：给CardView设了wrap_content，同时通过约束绑定到上下分隔线，但当ScrollView内容较多时，CardView会被内部内容撑大，突破约束范围，导致下方的分隔线和底部布局被覆盖。另外，下方分隔线缺少顶部约束，进一步加剧了布局错位。

修复步骤 #

1. 固定CardView的高度范围：将CardView的android:layout_height改为0dp（即match_constraint），配合上下约束让它严格占据上方分隔线和下方分隔线之间的空间，不会被内部内容撑开。
2. 让ScrollView填满CardView：把ScrollView的android:layout_height设为match_parent，让它在CardView的限定高度内滚动，不再撑大父布局。
3. 完善下方分隔线的约束：给下方分隔线添加顶部约束，绑定到CardView的底部，确保布局层级连贯。

修改后的布局代码 #

<?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"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@drawable/switch_border"
android:paddingBottom="20dp">

<LinearLayout
    android:id="@+id/titleLayout"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginTop="20dp"
    android:gravity="center_horizontal"
    android:orientation="horizontal"
    android:paddingBottom="20dp"
    app:layout_constraintEnd_toEndOf="parent"
    app:layout_constraintStart_toStartOf="parent"
    app:layout_constraintTop_toTopOf="parent">

    <TextView
        android:id="@+id/textView2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:gravity="center_horizontal"
        android:text="@string/screen_usage"
        android:textSize="20sp"
        android:textStyle="bold" />

</LinearLayout>

<View
    android:id="@+id/divider"
    android:layout_width="match_parent"
    android:layout_height="2dp"
    android:background="@color/black"
    app:layout_constraintTop_toBottomOf="@id/titleLayout" />

<androidx.cardview.widget.CardView
    android:id="@+id/cardView"
    android:layout_width="match_parent"
    android:layout_height="0dp" <!-- 修改此处 -->
    android:background="@drawable/switch_border"
    app:layout_constrainedHeight="true"
    app:layout_constraintBottom_toTopOf="@id/divider2"
    app:layout_constraintTop_toBottomOf="@id/divider">

    <ScrollView
        android:id="@+id/scrollLayout"
        android:layout_width="match_parent"
        android:layout_height="match_parent" <!-- 修改此处 -->
        android:fillViewport="false">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical">

            <TableLayout
                android:id="@+id/usageTable"
                android:layout_width="match_parent"
                android:layout_height="wrap_content">

                <TableRow...>

                <TableRow...> 

                <TableRow...>

                <TableRow...>

                <TableRow...>

                <TableRow...>

                <TableRow...>

                <TableRow...>

                <TableRow...>

                <TableRow...>

            </TableLayout>
        </LinearLayout>
    </ScrollView>
</androidx.cardview.widget.CardView>

<View
    android:id="@+id/divider2"
    android:layout_width="match_parent"
    android:layout_height="2dp"
    android:background="@color/black"
    app:layout_constraintBottom_toTopOf="@id/footer"
    app:layout_constraintTop_toBottomOf="@id/cardView" /> <!-- 添加此处 -->

<LinearLayout
    android:id="@+id/footer"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginHorizontal="10dp"
    android:orientation="vertical"
    app:layout_constraintBottom_toBottomOf="parent">

    <LinearLayout
        android:id="@+id/notes"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:layout_weight="1"
        android:gravity="center_horizontal"
        android:orientation="vertical">


        <TextView
            android:id="@+id/textView10"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="center"
            android:paddingTop="10dp"
            android:paddingBottom="10dp"
            android:text="Scroll Up/Down to see more rows"
            android:textColor="@color/warning"
            android:textStyle="bold" />

    </LinearLayout>

    <LinearLayout
        android:id="@+id/OKlayout"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center"
        android:layout_marginStart="0dp"
        android:layout_marginEnd="0dp"
        android:layout_marginBottom="50dp"
        android:layout_weight="1"
        android:gravity="center_horizontal"
        android:orientation="horizontal">

        <Button
            android:id="@+id/OK"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginTop="20dp"
            android:paddingTop="6dp"
            android:text="@string/ok" />
    </LinearLayout>
</LinearLayout>

</androidx.constraintlayout.widget.ConstraintLayout>

额外说明 #

• layout_height="0dp"在ConstraintLayout中表示视图高度由上下约束决定，会严格占据约束范围内的空间，不会被内部内容撑开。
• ScrollView设为match_parent后，会在CardView的限定高度内显示内容，超出部分可滚动，不会影响外部布局。

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