如何实现垂直LinearLayout中两个ScrollView的动态互适配（含TOP高度上限）

这个布局需求确实很贴合实际场景，既要让两个ScrollView自适应填充空间，又要给TOP设高度上限，还得保证二者紧密贴合无空白。我刚好有个纯XML的完美方案，用ConstraintLayout就能搞定，不用写一行逻辑代码：

核心思路是给TOP设置最大高度为父布局的50%，同时让BOT自动填充TOP下方的剩余空间，既能满足所有场景的适配规则，又能彻底解决空白和挤压问题。

完整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="match_parent">

    <!-- TOP ScrollView -->
    <ScrollView
        android:id="@+id/scroll_top"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:fillViewport="true"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintBottom_toTopOf="@id/scroll_bot"
        app:layout_constraintHeight_max="parent"
        app:layout_constraintHeight_percent="0.5">

        <!-- 替换为你的TOP内容布局 -->
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical">

            <!-- 示例内容 -->
            <TextView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:text="TOP 内容行 1"
                android:padding="16dp"/>
            <!-- 无限内容时会自动滚动 -->

        </LinearLayout>
    </ScrollView>

    <!-- BOT ScrollView -->
    <ScrollView
        android:id="@+id/scroll_bot"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:fillViewport="true"
        app:layout_constraintTop_toBottomOf="@id/scroll_top"
        app:layout_constraintBottom_toBottomOf="parent">

        <!-- 替换为你的BOT内容布局 -->
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical">

            <!-- 示例内容 -->
            <TextView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:text="BOT 标题栏"
                android:padding="16dp"
                android:background="#eee"/>
            <!-- 无限内容时会自动滚动 -->

        </LinearLayout>
    </ScrollView>

</androidx.constraintlayout.widget.ConstraintLayout>

关键属性拆解 #

• TOP ScrollView：

  • android:layout_height="wrap_content"：内容少的时候高度自适应，避免被强制拉伸产生空白。
  • app:layout_constraintHeight_percent="0.5"：强制最大高度为父布局的一半，哪怕内容无限多，也只会显示一半高度并允许滚动，完美符合你“TOP不超中线”的要求。
  • android:fillViewport="true"：如果内容高度小于ScrollView实际高度（比如只有1行），会让内容填满ScrollView，避免内部出现空白。

• BOT ScrollView：

  • android:layout_height="0dp"：配合约束条件，自动填充TOP下方到父布局底部的所有剩余空间。
  • 同样设置fillViewport="true"，确保内容不足时填满自身高度，彻底解决标题栏上方的空白问题。

场景适配验证 #

1. 双方均有无限内容：TOP占50%高度，BOT占剩余50%，各自可独立滚动，完美平分屏幕。
2. TOP仅1行，BOT无限：TOP高度自适应为1行，BOT填充剩下的75%空间并可滚动。
3. TOP无限，BOT仅1行：TOP被限制在50%高度内滚动，BOT高度自适应为1行，二者紧密贴合，不会出现TOP挤压BOT的情况。

如果一定要用LinearLayout，需要结合代码动态设置TOP的最大高度为父布局的一半，但XML无法直接实现百分比maxHeight，所以还是ConstraintLayout的方案更直接高效。

内容的提问来源于stack exchange，提问作者Joel Broström