android - 如何使用 NestedScrollView 删除 CoordinatorLayout 底部的空白区域

标签 android android-viewpager android-coordinatorlayout android-appbarlayout nestedscrollview

我正在使用 CoordinatorLayout,其中我使用 AppbarLayout 以及 ViewPagerNestedscrollview标签布局。在布局滚动时 AppbarLayout 折叠和展开。

现在的问题是滚动此布局时会在底部留下我不想要的空白区域。

这是我的抽屉布局:

<?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"
    android:id="@+id/drawerLayout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true">

    <RelativeLayout
        android:id="@+id/frame_container"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content">

        <FrameLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent">

            <android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
                xmlns:app="http://schemas.android.com/apk/res-auto"
                android:id="@+id/coordinator"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:adjustViewBounds="true"
                android:fitsSystemWindows="true"
                app:layout_scrollFlags="scroll|exitUntilCollapsed">

                <android.support.design.widget.AppBarLayout
                    android:id="@+id/app_bar"
                    android:layout_width="match_parent"
                    android:layout_height="220dp"
                    android:background="@drawable/offer_image"
                    android:fitsSystemWindows="true"
                    android:theme="@style/AppTheme.AppBarOverlay"
                    app:layout_scrollFlags="scroll|exitUntilCollapsed">
                    <!--    <com.flaviofaria.kenburnsview.KenBurnsView
                            android:id="@+id/image"
                            android:layout_width="match_parent"
                            android:layout_height="220dp"
                            android:src="@drawable/offer_image" />-->
                    <android.support.design.widget.CollapsingToolbarLayout
                        android:id="@+id/toolbar_layout"
                        android:layout_width="match_parent"
                        android:layout_height="match_parent"
                        android:fitsSystemWindows="true"
                        app:expandedTitleMarginEnd="64dp"
                        app:expandedTitleMarginStart="48dp"
                        app:layout_scrollFlags="scroll|exitUntilCollapsed">


                        <com.flaviofaria.kenburnsview.KenBurnsView
                            android:id="@+id/image"
                            android:layout_width="match_parent"
                            android:layout_height="220dp"
                            android:src="@drawable/offer_image" />

                        <FrameLayout
                            android:id="@+id/collapse_frame"
                            android:layout_width="match_parent"
                            android:layout_height="match_parent"
                            android:background="#B3c85a00">

                        </FrameLayout>

                        <FrameLayout
                            android:id="@+id/centerCircle"
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:layout_gravity="center">

                            <ImageView
                                android:id="@+id/imageViewCenter"
                                android:layout_width="wrap_content"
                                android:layout_height="wrap_content"
                                android:layout_gravity="center" />
                        </FrameLayout>


                        <android.support.design.widget.TabLayout
                            android:id="@+id/tabs"
                            android:layout_width="match_parent"
                            android:layout_height="wrap_content"
                            android:layout_gravity="bottom"
                            android:layout_marginBottom="15dp"
                            app:tabIndicatorColor="#FFFFFF"
                            app:tabMode="scrollable" />
                        <!--</FrameLayout>-->
                    </android.support.design.widget.CollapsingToolbarLayout>
                </android.support.design.widget.AppBarLayout>

                <!--<FrameLayout-->

                <!--android:layout_width="match_parent"-->
                <!--android:layout_height="match_parent"-->
                <!-- -->
                <!--android:visibility="visible">-->

                <android.support.design.widget.FloatingActionButton
                    android:id="@+id/fab"
                    style="@style/floating_action_button"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="bottom|end"
                    android:src="@drawable/ic_share_white_24dp"
                    android:visibility="gone"
                    app:backgroundTint="#FF9800"
                    app:elevation="6dp"
                    app:pressedTranslationZ="12dp" />

                <android.support.v4.view.ViewPager

                    xmlns:android="http://schemas.android.com/apk/res/android"
                    android:id="@+id/pager_pre"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_gravity="left|bottom|fill_vertical"
                    android:layout_marginTop="0dp"
                    app:layout_behavior="@string/appbar_scrolling_view_behavior">

                </android.support.v4.view.ViewPager>


            </android.support.design.widget.CoordinatorLayout>

            <RelativeLayout
                android:id="@+id/bannerView"
                android:layout_width="match_parent"
                android:layout_height="58dp"
                android:layout_gravity="bottom|center"
                android:background="@drawable/curved_white_with_blue_border"
                android:visibility="gone">

                <TextView
                    android:id="@+id/bannerText"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_centerHorizontal="true"
                    android:layout_centerInParent="true"
                    android:layout_centerVertical="true"
                    android:gravity="center"
                    android:padding="3dp"
                    android:text="Banner"
                    android:visibility="gone" />

                <ImageView
                    android:id="@+id/bannerImage"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:layout_alignParentLeft="true"
                    android:layout_centerHorizontal="true"
                    android:layout_centerVertical="true"
                    android:gravity="center"
                    android:padding="3dp"
                    android:scaleType="fitXY"
                    android:visibility="gone" />

                <ImageView
                    android:id="@+id/bannerClose"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_alignParentRight="true"
                    android:layout_alignParentTop="true"
                    android:layout_centerVertical="true"
                    android:src="@drawable/cross_icon" />
            </RelativeLayout>


            <LinearLayout
                android:id="@+id/socialTabs"
                android:layout_width="match_parent"
                android:layout_height="46dp"
                android:layout_gravity="bottom|center"
                android:layout_marginBottom="5dp"
                android:background="@color/White"
                android:orientation="horizontal"
                android:visibility="gone">

                <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="match_parent"
                    android:adjustViewBounds="true"
                    android:src="@drawable/follow" />

                <FrameLayout
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:layout_gravity="center"
                    android:background="@color/White">

                    <LinearLayout
                        android:layout_width="match_parent"
                        android:layout_height="46dp"
                        android:layout_gravity="center"
                        android:gravity="center"
                        android:paddingLeft="10dp"
                        android:paddingRight="10dp"
                        android:weightSum="3">

                        <ImageView
                            android:id="@+id/facebookImageView"
                            android:layout_width="30dp"
                            android:layout_height="30dp"
                            android:layout_weight="1"
                            android:src="@drawable/fb_follow" />

                        <ImageView
                            android:id="@+id/googlePlusImageView"
                            android:layout_width="30dp"
                            android:layout_height="30dp"
                            android:layout_marginLeft="5dp"
                            android:layout_marginRight="5dp"
                            android:layout_weight="1"
                            android:adjustViewBounds="true"
                            android:src="@drawable/google_follow" />

                        <ImageView
                            android:id="@+id/twitterImageView"
                            android:layout_width="30dp"
                            android:layout_height="30dp"
                            android:layout_weight="1"
                            android:adjustViewBounds="true"
                            android:src="@drawable/twitter_follow" />
                    </LinearLayout>
                </FrameLayout>
            </LinearLayout>
        </FrameLayout>

        <android.support.design.widget.CoordinatorLayout
            android:id="@+id/snackbarCoordinatorLayout"
            android:layout_width="match_parent"
            android:layout_height="match_parent">

        </android.support.design.widget.CoordinatorLayout>
    </RelativeLayout>

    <ExpandableListView
        android:id="@+id/left_drawer"
        android:layout_width="265dp"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        android:background="#fff"
        android:choiceMode="singleChoice"
        android:divider="@null"
        android:dividerHeight="0dp"
        android:drawSelectorOnTop="true"
        android:groupIndicator="@null"
        android:scrollbars="@null" />
    <!--    <FrameLayout xmlns:tools="http://schemas.android.com/tools"
            android:id="@+id/container"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            tools:ignore="MergeRootFrame"></FrameLayout>-->

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

NestedScrollView的代码:

<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.NestedScrollView 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:layout_gravity="fill_vertical"
    android:fillViewport="true"
    android:fitsSystemWindows="true"
    app:layout_behavior="@string/appbar_scrolling_view_behavior">


    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="@color/fragment_back_color"
            android:orientation="vertical">


            <LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:orientation="horizontal"
                android:padding="5dp">

                <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center"
                    android:background="@drawable/new_recharge" />

                <com.spiceladdoo.views.RobotTextviewRegular
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center"
                    android:layout_marginLeft="10dp"
                    android:text="NEW PAYMENT"
                    android:textColor="@color/offer_name_text_color" />

            </LinearLayout>


            <RelativeLayout

                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_marginLeft="5dp"
                android:layout_marginRight="5dp"
                android:background="@color/white"
                android:paddingBottom="20dp"
                android:paddingLeft="10dp"
                android:paddingRight="10dp"
                android:paddingTop="20dp">

                <HorizontalScrollView
                    android:id="@+id/hsv"
                    android:layout_width="fill_parent"
                    android:layout_height="wrap_content"
                    android:layout_alignParentTop="true"
                    android:fillViewport="true"
                    android:measureAllChildren="false"
                    android:scrollbars="none">

                    <LinearLayout
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:layout_centerInParent="true"
                        android:orientation="horizontal">

                        <LinearLayout
                            android:id="@+id/wallet_layout"
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:gravity="center"
                            android:orientation="vertical">

                            <ImageView
                                android:id="@+id/wallet_recharge"
                                android:layout_width="wrap_content"
                                android:layout_height="wrap_content"
                                android:layout_gravity="center"
                                android:background="@drawable/wallet_recherge" />

                            <com.spiceladdoo.views.RobotTextviewRegular
                                android:layout_width="65dp"
                                android:layout_height="wrap_content"
                                android:layout_gravity="center"
                                android:layout_marginTop="5dp"
                                android:gravity="center"
                                android:text="WALLET"
                                android:textColor="@color/offer_name_text_color"
                                android:textSize="12sp" />

                        </LinearLayout>

                        <View
                            android:layout_width="5dp"
                            android:layout_height="20dp"

                            android:background="@color/white" />

                        <LinearLayout
                            android:id="@+id/prepaid_layout"
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:gravity="center"
                            android:orientation="vertical">

                            <ImageView
                                android:id="@+id/prepaid_recharge"
                                android:layout_width="wrap_content"
                                android:layout_height="wrap_content"
                                android:layout_gravity="center"
                                android:background="@drawable/prepaid_recherge" />

                            <com.spiceladdoo.views.RobotTextviewRegular
                                android:layout_width="65dp"
                                android:layout_height="wrap_content"
                                android:layout_gravity="center"
                                android:layout_marginTop="5dp"
                                android:gravity="center"
                                android:text="PREPAID"
                                android:textColor="@color/offer_name_text_color"
                                android:textSize="12sp" />


                        </LinearLayout>

                        <View
                            android:layout_width="5dp"
                            android:layout_height="20dp"

                            android:background="@color/white" />

                        <LinearLayout
                            android:id="@+id/postpaid_layout"
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:gravity="center"
                            android:orientation="vertical">

                            <ImageView
                                android:id="@+id/postpaid_recharge"
                                android:layout_width="wrap_content"
                                android:layout_height="wrap_content"
                                android:layout_gravity="center"
                                android:background="@drawable/postpaid_recherge" />

                            <com.spiceladdoo.views.RobotTextviewRegular
                                android:layout_width="65dp"
                                android:layout_height="wrap_content"
                                android:layout_gravity="center"
                                android:layout_marginTop="5dp"
                                android:gravity="center"
                                android:text="POSTPAID"
                                android:textColor="@color/offer_name_text_color"
                                android:textSize="12sp" />


                        </LinearLayout>

                        <View
                            android:layout_width="5dp"
                            android:layout_height="20dp"
                            android:background="@color/white" />

                        <LinearLayout
                            android:id="@+id/dth_layout"
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:gravity="center"
                            android:orientation="vertical">

                            <ImageView
                                android:id="@+id/dth_recharge"
                                android:layout_width="wrap_content"
                                android:layout_height="wrap_content"
                                android:layout_gravity="center"
                                android:background="@drawable/dth_recherge" />

                            <com.spiceladdoo.views.RobotTextviewRegular
                                android:layout_width="65dp"
                                android:layout_height="wrap_content"
                                android:layout_gravity="center"
                                android:layout_marginTop="5dp"
                                android:gravity="center"
                                android:text="DTH"
                                android:textColor="@color/offer_name_text_color"
                                android:textSize="12sp" />


                        </LinearLayout>

                        <View
                            android:layout_width="5dp"
                            android:layout_height="20dp"
                            android:background="@color/white" />

                        <LinearLayout
                            android:id="@+id/landline_layout"
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:gravity="center"
                            android:orientation="vertical">

                            <ImageView
                                android:id="@+id/landline_recharge"
                                android:layout_width="wrap_content"
                                android:layout_height="wrap_content"
                                android:layout_gravity="center"
                                android:background="@drawable/landline_recherge" />

                            <com.spiceladdoo.views.RobotTextviewRegular
                                android:layout_width="65dp"
                                android:layout_height="wrap_content"
                                android:layout_gravity="center"
                                android:layout_marginTop="5dp"
                                android:gravity="center"
                                android:text="LANDLINE"
                                android:textColor="@color/offer_name_text_color"
                                android:textSize="12sp" />


                        </LinearLayout>

                        <View
                            android:layout_width="5dp"
                            android:layout_height="20dp"
                            android:background="@color/white" />

                        <LinearLayout
                            android:id="@+id/datacard_layout"
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:gravity="center"
                            android:orientation="vertical">

                            <ImageView
                                android:id="@+id/datacard_recharge"
                                android:layout_width="wrap_content"
                                android:layout_height="wrap_content"
                                android:layout_gravity="center"
                                android:background="@drawable/datacard_recherge" />

                            <com.spiceladdoo.views.RobotTextviewRegular
                                android:layout_width="65dp"
                                android:layout_height="wrap_content"
                                android:layout_gravity="center"
                                android:layout_marginTop="5dp"
                                android:gravity="center"
                                android:text="DATACARD"
                                android:textColor="@color/offer_name_text_color"
                                android:textSize="12sp" />
                        </LinearLayout>
                    </LinearLayout>
                </HorizontalScrollView>
            </RelativeLayout>

            <LinearLayout
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:orientation="horizontal"
                android:paddingBottom="10dp"
                android:paddingLeft="5dp"
                android:paddingRight="5dp"
                android:paddingTop="10dp">

                <ImageView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center" />

                <com.spiceladdoo.views.RobotTextviewRegular
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center"
                    android:layout_marginLeft="10dp"
                    android:text="RECENT"
                    android:textColor="@color/offer_name_text_color" />

            </LinearLayout>


            <FrameLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content">

                <LinearLayout
                    android:id="@+id/lincontainer_rec"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:animateLayoutChanges="true"
                    android:divider="?android:dividerHorizontal"
                    android:orientation="vertical"
                    android:paddingLeft="16dp"
                    android:paddingRight="16dp"
                    android:showDividers="middle" />
            </FrameLayout>
        </LinearLayout>
    </RelativeLayout>
</android.support.v4.widget.NestedScrollView>

我正在分享这个问题的视频点击:

https://www.dropbox.com/s/9yojeq2yw1eebps/layout_height_issue.mp4?dl=0

过去三天我一直在努力解决这个问题。

我们将不胜感激。

最佳答案

尝试添加:

android:layout_gravity="fill_vertical"

NestedScrollViewRecyclerView。(或者你可以尝试只为 NestedScrollView)。

此外,还要检查此链接:https://stackoverflow.com/a/31266160/4409113

其中说:

It's Design Library's fault. Layouts "shorter" than screen height cause gaps, misbehaviour in collapsing/unfolding (i.e. you need to drag outside of collapsed area to unfold it again etc, etc, etc. It's just quite buggy at the moment or writing this answer (it will, hopefully be fixed some day, but I got no clue when this is going to happen).

顺便说一句,我正在使用以下代码并且它与 match_parent 一起工作:

<android.support.v4.widget.NestedScrollView
        android:id="@+id/scroll"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:clipToPadding="false"
        app:layout_behavior="@string/appbar_scrolling_view_behavior">

        <android.support.v7.widget.CardView
            android:id="@+id/cvuser"
            android:layout_width="365dp"
            android:layout_height="140dp"
            android:layout_marginStart="10dp"
            android:layout_marginTop="10dp"
            card_view:cardCornerRadius="4dp"
            card_view:cardElevation="1dp">

            <RelativeLayout
                android:id="@+id/idrel"
                android:layout_width="fill_parent"
                android:layout_height="140dp">

                <TextView
                    android:id="@+id/txtmessage"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_alignParentStart="true"
                    android:layout_alignParentTop="true"
                    android:layout_marginStart="17dp"
                    android:layout_marginTop="10dp"
                    android:textAppearance="?android:attr/textAppearanceMedium" />

                <TextView
                    android:id="@+id/txtauthor"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_alignParentBottom="true"
                    android:layout_alignStart="@+id/txtmessage"
                    android:layout_marginBottom="35dp"
                    android:textAppearance="?android:attr/textAppearanceMedium" />


            </RelativeLayout>
        </android.support.v7.widget.CardView>

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

我又看了一遍视频,问题是你的内容不足以滚动。我的意思是,如果你可以添加上面的 CardViewRecyclerView,你看看会发生什么。内容不足以滚动,将更多内容放入 NestedScrollView 中,然后使用 match_parent,它应该可以工作。

关于android - 如何使用 NestedScrollView 删除 CoordinatorLayout 底部的空白区域,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34987828/

相关文章:

php - 删除 mysql 和 android 关系数据库中的一行

java - 当用户到达 ViewPager 的末尾时,如何动态地将 fragment 添加到 ViewPager 的开头?

Android Material Design 个人资料页面

android - 在 LINUX 上安装和配置 SQlite 浏览器

Android:在 Adapter 的 onBindViewHolder 中将 ImageView 动态添加到 Linearlayout

android - 在 viewpager 上滑动时,选项卡选择器无法在上一个选项卡上单击

android - 修复圆形 ViewPager 的动画

android - CoordinatorLayout + AppBarLayout + NavigationDrawer

android - CoordinatorLayout Android 中的底部导航栏与 viewpager 重叠

android - 如何在 SQLITE 中使用 JOIN 从 2 个表中删除数据