如何让中间视图填充 ScrollView 内的剩余高度？

Question

例如，我想要在 LinearLayout 中有一个 500dp 和一个 150dp 的 TextView。对于响应式布局，在它们中间，如果有剩余高度，就会有一个红色区域（例如：在大屏幕设备上）：

大屏幕：

如果没有剩余 space（例如：在小屏幕设备上），则不会有红色区域并且视图变为可滚动：

小屏幕：

我试过了：

activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.DrawerLayout 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:id="@+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fitsSystemWindows="true"
tools:openDrawer="start">

<include
    layout="@layout/app_bar_main"
    android:layout_width="match_parent"
    android:layout_height="match_parent" />

<android.support.design.widget.NavigationView
    android:id="@+id/nav_view"
    android:layout_width="wrap_content"
    android:layout_height="match_parent"
    android:layout_gravity="start"
    android:fitsSystemWindows="true">
    <ScrollView
        android:layout_width="match_parent"
        android:layout_height="match_parent">
        <LinearLayout
            android:orientation="vertical"
            android:layout_width="match_parent"
            android:layout_height="wrap_content">
            <TextView
                android:background="#FFFFAA"
                android:layout_width="match_parent"
                android:layout_height="500dp"
                android:text="500dp"
                android:gravity="center_vertical"
                android:textAlignment="center" />
            <View
                android:background="#FF0000"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_weight="1"/>
            <TextView
                android:background="#AAFF"
                android:layout_width="match_parent"
                android:layout_height="150dp"
                android:text="150dp"
                android:gravity="center_vertical"
                android:textAlignment="center" />
        </LinearLayout>
    </ScrollView>
    </android.support.design.widget.NavigationView>

</android.support.v4.widget.DrawerLayout>

其中红色区域设置layout_weight="1"，但红色区域不填满大屏剩余高度：

大屏幕：

我该怎么做？

Answer 1

您应该在 ScrollView 上设置 android:fillViewport="true"。如有必要，这会将内容拉伸到滚动视图的高度。

Answer 2

你应该使用固定页脚

像这样：-

<android.support.design.widget.NavigationView
android:id="@+id/drawer"
android:layout_width="wrap_content"
android:layout_height="match_parent"
android:layout_gravity="start"
app:headerLayout="@layout/drawer_header"
app:menu="@menu/drawer">

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_gravity="bottom"
    android:clickable="true"
    android:orientation="vertical">
    <TextView
        android:id="@+id/footer_item_1"
        android:layout_width="match_parent"
        android:layout_height="48dp"
        android:gravity="center"
        android:text="Footer Item 1" />
    <TextView
        android:id="@+id/footer_item_2"
        android:layout_width="match_parent"
        android:layout_height="48dp"
        android:gravity="center"
        android:text="Footer Item 2" />
</LinearLayout>

和res/menu/drawer.xml

<menu xmlns:android="http://schemas.android.com/apk/res/android">
<group>
    <item
        android:id="@+id/nav_item_1"
        android:icon="@drawable/ic_nav_item_1"
        android:title="Nav Item 1" />
    <item
        android:id="@+id/nav_item_2"
        android:icon="@drawable/ic_nav_item_2"
        android:title="Nav Item 2" />
    <item
        android:id="@+id/nav_item_3"
        android:icon="@drawable/ic_nav_item_3"
        android:title="Nav Item 3" />
    <item
        android:id="@+id/nav_item_4"
        android:icon="@drawable/ic_nav_item_4"
        android:title="Nav Item 4" />
    <item
        android:id="@+id/footer_spacer_1"
        android:checkable="false"
        android:enabled="false"
        android:orderInCategory="200"
        android:title="" />
    <item
        android:id="@+id/footer_spacer_2"
        android:checkable="false"
        android:enabled="false"
        android:orderInCategory="200"
        android:title="" />
</group>
</menu>

Answer 3

像这样制作滚动视图

使用 android:fillViewport="true" 因为它 定义滚动视图是否应拉伸其内容以填充视口。

 <ScrollView
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fillViewport="true">
    <LinearLayout
        android:orientation="vertical"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">
        <TextView
            android:background="#FFFFAA"
            android:layout_width="match_parent"
            android:layout_height="500dp"
            android:text="500dp"
            android:gravity="center_vertical"
            android:textAlignment="center" />
        <View
            android:background="#FF0000"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_weight="1"/>
        <TextView
            android:background="#AAFF"
            android:layout_width="match_parent"
            android:layout_height="150dp"
            android:text="150dp"
            android:gravity="center_vertical"
            android:textAlignment="center" />
    </LinearLayout>
</ScrollView>

如何让中间视图填充 ScrollView 内的剩余高度？

How to let a middle view fill remain height (if any) inside ScrollView?

android

xml

android-layout

responsive-design

android-navigationview