使包含 ListView 的整个布局可滚动

Posted

技术标签:

【中文标题】使包含 ListView 的整个布局可滚动【英文标题】：Make whole layout that contains ListView scrollable 【发布时间】：2019-03-31 08:56:24 【问题描述】：

我有一个包含ListView 的LinearLayout。当ListView 滚动时，LinearLayout 也应该滚动。

但是现在当ListView 滚动时，ListView 上方的RelativeLayout 不能滚动。相反，它们总是显示在顶部！我试图在LinearLayout 中添加ScrollView，但得到java.lang.IllegalStateException: ScrollView can host only one direct child

这是我尝试过的

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_ android:layout_
        android:orientation="vertical"
        xmlns:app="http://schemas.android.com/apk/res-auto">

    <RelativeLayout
            style="?android:attr/buttonStyleSmall"
            android:clickable="true"
            android:id="@+id/relativeLayout1"
            android:background="@drawable/boarder_layout"
            android:layout_marginLeft="10dp"
            android:layout_marginTop="10dp"
            android:layout_marginRight="10dp"
            android:layout_
            android:layout_>

        <TextView
                android:layout_marginTop="12dp"
                android:textSize="15sp"
                android:textColor="@color/darkGreen"
                android:layout_marginLeft="8dp"
                android:id="@+id/editTextDate"
                android:background="@android:color/transparent"
                android:layout_toRightOf="@+id/imgProfilePicture"
                android:text="Post a new update"
                android:padding="10dp"
                android:layout_
                android:layout_/>

        <ImageView
                android:padding="8dp"
                android:src="@drawable/images"
                android:layout_marginLeft="10dp"
                android:layout_marginTop="5dp"
                android:layout_marginBottom="5dp"
                android:id="@+id/imgProfilePicture"
                android:layout_
                android:layout_
                android:layout_gravity="center"/>
    </RelativeLayout>

    <LinearLayout android:layout_ android:layout_
                  android:layout_marginTop="10dp"
                  android:orientation="horizontal">

        <RelativeLayout
                style="?android:attr/buttonStyleSmall"
                android:id="@+id/relativeLayout2"
                android:clickable="true"
                android:layout_weight="0.5"
                android:background="@drawable/boarder_layout"
                android:layout_marginLeft="10dp"
                android:layout_
                android:layout_>

            <TextView
                    android:textColor="@color/darkGreen"
                    android:layout_marginTop="10dp"
                    android:layout_marginLeft="8dp"
                    android:id="@+id/txtView1"
                    android:background="@android:color/transparent"
                    android:layout_toRightOf="@+id/imgFindSomething"
                    android:text="I need something"
                    android:layout_
                    android:layout_/>

            <ImageView
                    android:tint="@color/limegreen"
                    android:layout_marginLeft="10dp"
                    android:layout_marginTop="5dp"
                    android:layout_marginBottom="5dp"
                    android:src="@drawable/find_something"
                    android:id="@+id/imgFindSomething"
                    android:layout_
                    android:layout_
                    android:layout_gravity="center"/>

        </RelativeLayout>

        <RelativeLayout
                style="?android:attr/buttonStyleSmall"
                android:id="@+id/relativeLayout3"
                android:clickable="true"
                android:layout_marginRight="10dp"
                android:layout_weight="0.5"
                android:layout_marginLeft="10dp"
                android:background="@drawable/boarder_layout"
                android:layout_
                android:layout_>

            <TextView
                    android:textColor="@color/crimson"
                    android:layout_marginTop="10dp"
                    android:layout_marginLeft="8dp"
                    android:id="@+id/txtView2"
                    android:layout_
                    android:background="@android:color/transparent"
                    android:layout_toRightOf="@+id/imgInvite"
                    android:text="Invite neighbours"
                    android:layout_/>

            <ImageView
                    android:tint="@color/limegreen"
                    android:layout_marginLeft="10dp"
                    android:layout_marginTop="5dp"
                    android:layout_marginBottom="5dp"
                    android:src="@drawable/add_neighbours"
                    android:id="@+id/imgInvite"
                    android:layout_
                    android:layout_
                    android:layout_gravity="center"/>
        </RelativeLayout>
    </LinearLayout>

    <ListView android:layout_ android:layout_
              android:layout_marginLeft="10dp"
              android:id="@+id/listView">
    </ListView>

</LinearLayout>

【问题讨论】：

您的问题未解决。 Listview 默认是可滚动的。 @AnisurRahmanTonu 是的，但我希望 relativeLayout 与 listView 滚动和 listView 一起滚动，而不是始终显示在顶部。 你的意思是当listview滚动到顶部时你想隐藏顶部的relativelayout？ @AnisurRahmanTonu 完全正确。 任何人......？ 【参考方案1】：

您需要像这样使用NestedScrollView：

<android.support.v4.widget.NestedScrollView
    android:layout_
    android:layout_
    android:fillViewport="true"
    android:overScrollMode="never"
    android:clipToPadding="false">
        <LinearLayout
            android:layout_
            android:layout_
            android:orientation="vertical">

            <RelativeLayout
                style="?android:attr/buttonStyleSmall"
                android:clickable="true"
                android:id="@+id/relativeLayout1"
                android:background="@drawable/boarder_layout"
                android:layout_marginLeft="10dp"
                android:layout_marginTop="10dp"
                android:layout_marginRight="10dp"
                android:layout_
                android:layout_>

                <TextView
                    android:layout_marginTop="12dp"
                    android:textSize="15sp"
            android:textColor="@color/darkGreen"
            android:layout_marginLeft="8dp"
            android:id="@+id/editTextDate"
            android:background="@android:color/transparent"
            android:layout_toRightOf="@+id/imgProfilePicture"
            android:text="Post a new update"
            android:padding="10dp"
            android:layout_
            android:layout_/>

    <ImageView
            android:padding="8dp"
            android:src="@drawable/images"
            android:layout_marginLeft="10dp"
            android:layout_marginTop="5dp"
            android:layout_marginBottom="5dp"
            android:id="@+id/imgProfilePicture"
            android:layout_
            android:layout_
            android:layout_gravity="center"/>
</RelativeLayout>

<LinearLayout 
              android:layout_ 
              android:layout_
              android:layout_marginTop="10dp"
              android:orientation="horizontal">

    <RelativeLayout
            style="?android:attr/buttonStyleSmall"
            android:id="@+id/relativeLayout2"
            android:clickable="true"
            android:layout_weight="0.5"
            android:background="@drawable/boarder_layout"
            android:layout_marginLeft="10dp"
            android:layout_
            android:layout_>

        <TextView
                android:textColor="@color/darkGreen"
                android:layout_marginTop="10dp"
                android:layout_marginLeft="8dp"
                android:id="@+id/txtView1"
                android:background="@android:color/transparent"
                android:layout_toRightOf="@+id/imgFindSomething"
                android:text="I need something"
                android:layout_
                android:layout_/>

        <ImageView
                android:tint="@color/limegreen"
                android:layout_marginLeft="10dp"
                android:layout_marginTop="5dp"
                android:layout_marginBottom="5dp"
                android:src="@drawable/find_something"
                android:id="@+id/imgFindSomething"
                android:layout_
                android:layout_
                android:layout_gravity="center"/>

    </RelativeLayout>

    <RelativeLayout
            style="?android:attr/buttonStyleSmall"
            android:id="@+id/relativeLayout3"
            android:clickable="true"
            android:layout_marginRight="10dp"
            android:layout_weight="0.5"
            android:layout_marginLeft="10dp"
            android:background="@drawable/boarder_layout"
            android:layout_
            android:layout_>

        <TextView
                android:textColor="@color/crimson"
                android:layout_marginTop="10dp"
                android:layout_marginLeft="8dp"
                android:id="@+id/txtView2"
                android:layout_
                android:background="@android:color/transparent"
                android:layout_toRightOf="@+id/imgInvite"
                android:text="Invite neighbours"
                android:layout_/>

        <ImageView
                android:tint="@color/limegreen"
                android:layout_marginLeft="10dp"
                android:layout_marginTop="5dp"
                android:layout_marginBottom="5dp"
                android:src="@drawable/add_neighbours"
                android:id="@+id/imgInvite"
                android:layout_
                android:layout_
                android:layout_gravity="center"/>
    </RelativeLayout>
</LinearLayout>

    <ListView 
        android:layout_ 
        android:layout_
        android:layout_marginLeft="10dp"
        android:id="@+id/listView">
    </ListView>


    </LinearLayout>
</android.support.v4.widget.NestedScrollView>

我还建议将您的 ListView 替换为 RecyclerView 以获得更好的性能。

【讨论】：

二进制 XML 文件第 2 行：膨胀类 androidx.core.widget.NestedScrollView 时出错 您使用的是 androidx 还是仍在使用支持库？我也错过了父线性布局所以尝试再次复制和粘贴 现在一切都不能滚动了，包括listView 设置列表视图高度以包裹内容@JohnJoe【参考方案2】：

使用此代码。

<?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_
    android:layout_
    android:orientation="vertical">

    <ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_
        android:layout_
        android:background="@color/primary"
        android:fitsSystemWindows="true">

        <LinearLayout
            android:layout_
            android:layout_
            android:orientation="vertical">

            <RelativeLayout
                android:id="@+id/relativeLayout1"
                style="?android:attr/buttonStyleSmall"
                android:layout_
                android:layout_
                android:layout_marginLeft="10dp"
                android:layout_marginTop="10dp"
                android:layout_marginRight="10dp"
                android:background="@drawable/boarder_layout"
                android:clickable="true">

                <TextView
                    android:id="@+id/editTextDate"
                    android:layout_
                    android:layout_
                    android:layout_marginLeft="8dp"
                    android:layout_marginTop="12dp"
                    android:layout_toRightOf="@+id/imgProfilePicture"
                    android:background="@android:color/transparent"
                    android:padding="10dp"
                    android:text="Post a new update"
                    android:textColor="@color/darkGreen"
                    android:textSize="15sp" />

                <ImageView
                    android:id="@+id/imgProfilePicture"
                    android:layout_
                    android:layout_
                    android:layout_gravity="center"
                    android:layout_marginLeft="10dp"
                    android:layout_marginTop="5dp"
                    android:layout_marginBottom="5dp"
                    android:padding="8dp"
                    android:src="@drawable/images" />
            </RelativeLayout>

            <LinearLayout
                android:layout_
                android:layout_
                android:layout_marginTop="10dp"
                android:orientation="horizontal">

                <RelativeLayout
                    android:id="@+id/relativeLayout2"
                    style="?android:attr/buttonStyleSmall"
                    android:layout_
                    android:layout_
                    android:layout_marginLeft="10dp"
                    android:layout_weight="0.5"
                    android:background="@drawable/boarder_layout"
                    android:clickable="true">

                    <TextView
                        android:id="@+id/txtView1"
                        android:layout_
                        android:layout_
                        android:layout_marginLeft="8dp"
                        android:layout_marginTop="10dp"
                        android:layout_toRightOf="@+id/imgFindSomething"
                        android:background="@android:color/transparent"
                        android:text="I need something"
                        android:textColor="@color/darkGreen" />

                    <ImageView
                        android:id="@+id/imgFindSomething"
                        android:layout_
                        android:layout_
                        android:layout_gravity="center"
                        android:layout_marginLeft="10dp"
                        android:layout_marginTop="5dp"
                        android:layout_marginBottom="5dp"
                        android:src="@drawable/find_something"
                        android:tint="@color/limegreen" />

                </RelativeLayout>

                <RelativeLayout
                    android:id="@+id/relativeLayout3"
                    style="?android:attr/buttonStyleSmall"
                    android:layout_
                    android:layout_
                    android:layout_marginLeft="10dp"
                    android:layout_marginRight="10dp"
                    android:layout_weight="0.5"
                    android:background="@drawable/boarder_layout"
                    android:clickable="true">

                    <TextView
                        android:id="@+id/txtView2"
                        android:layout_
                        android:layout_
                        android:layout_marginLeft="8dp"
                        android:layout_marginTop="10dp"
                        android:layout_toRightOf="@+id/imgInvite"
                        android:background="@android:color/transparent"
                        android:text="Invite neighbours"
                        android:textColor="@color/crimson" />

                    <ImageView
                        android:id="@+id/imgInvite"
                        android:layout_
                        android:layout_
                        android:layout_gravity="center"
                        android:layout_marginLeft="10dp"
                        android:layout_marginTop="5dp"
                        android:layout_marginBottom="5dp"
                        android:src="@drawable/add_neighbours"
                        android:tint="@color/limegreen" />
                </RelativeLayout>
            </LinearLayout>
        </LinearLayout>
    </ScrollView>

    <ListView
        android:id="@+id/listView"
        android:layout_
        android:layout_
        android:layout_marginLeft="10dp"></ListView>

</LinearLayout>

【讨论】：

listView的相对布局还是不滚动 然后将该滚动视图设为您的主要父级

以上是关于使包含 ListView 的整个布局可滚动的主要内容，如果未能解决你的问题，请参考以下文章

如何使用 ListView.separated 使整个屏幕可滚动

flexbox子元素中的CSS可滚动内容

如何创建有界可滚动的 TabBarView

Flutter ListView.Builder 导致滚动不连贯。如何使滚动平滑？

如何使整个页面可滚动？

Android 可滚动布局