带有折叠工具栏的 RecyclerView 和 ViewPager

Posted 2023-04-19

【中文标题】带有折叠工具栏的 RecyclerView 和 ViewPager

【英文标题】：RecyclerView and ViewPager with collapsing toolbar

【发布时间】：2016-06-16 10:11:25

【问题描述】：

我正在尝试创建这种布局 -

一个CollapsingToolbarLayout 有一个ViewPager 像google play 应用程序。 下面有一个网格RecyclerView。 最后还有一个ViewPager。

RecylerView 正常滚动，直到 CollapsingToolbarLayout 展开时结束。

<?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/drawer_layout"
    android:layout_
    android:layout_>

    <android.support.design.widget.CoordinatorLayout
        android:layout_
        android:layout_
        android:fitsSystemWindows="true">

        <android.support.design.widget.AppBarLayout
            android:id="@+id/app_bar_layout"
            android:layout_
            android:layout_
            android:fitsSystemWindows="true"
            android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">

            <android.support.design.widget.CollapsingToolbarLayout
                android:id="@+id/collapsing_toolbar"
                android:layout_
                android:layout_
                android:fitsSystemWindows="true"
                app:contentScrim="?attr/colorPrimary"
                app:expandedTitleMarginEnd="64dp"
                app:expandedTitleMarginStart="48dp"
                app:layout_scrollFlags="scroll|exitUntilCollapsed">

                <LinearLayout
                    android:layout_
                    android:layout_
                    android:fitsSystemWindows="true"
                    android:orientation="vertical"
                    app:layout_collapseMode="parallax">

                    <TextView
                        android:id="@+id/text_home_active"
                        android:layout_
                        android:layout_
                        android:layout_margin="@dimen/margin_normal"
                        android:background="@color/header_bg"
                        android:gravity="center_vertical"
                        android:textColor="@android:color/black"
                        android:textSize="@dimen/title_date_text_size" />

                    <android.support.v4.view.ViewPager
                        android:id="@+id/viewpager_home"
                        android:layout_
                        android:layout_
                        android:layout_gravity="center"
                        android:overScrollMode="ifContentScrolls" />
                </LinearLayout>

                <android.support.v7.widget.Toolbar
                    android:id="@+id/toolbar"
                    android:layout_
                    android:layout_
                    android:background="@color/color_primary"
                    android:minHeight="?attr/actionBarSize"
                    app:layout_collapseMode="pin"
                    app:theme="@style/ToolBarStyle" />

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

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

        <android.support.v4.widget.NestedScrollView
            android:id="@+id/scroll"
            android:layout_
            android:layout_
            android:clipToPadding="false"
            android:fillViewport="true"
            app:layout_behavior="@string/appbar_scrolling_view_behavior">

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

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

                    <TextView
                        android:id="@+id/text_home_popular"
                        android:layout_
                        android:layout_
                        android:background="@color/header_bg"
                        android:gravity="center_vertical"
                        android:padding="@dimen/margin_normal"
                        android:textColor="@android:color/black"
                        android:textSize="@dimen/title_date_text_size" />

                    <android.support.v7.widget.RecyclerView
                        android:id="@+id/grid_home_popular"
                        android:layout_
                        android:layout_
                        android:clipToPadding="false"
                        android:scrollbars="none"
                        app:layout_behavior="@string/appbar_scrolling_view_behavior" />

                </LinearLayout>

                <LinearLayout
                    android:layout_
                    android:layout_
                    android:layout_gravity="bottom"
                    android:layout_weight="1"
                    android:elevation="5dp"
                    android:orientation="vertical">

                    <TextView
                        android:id="@+id/text_home_offers"
                        android:layout_
                        android:layout_
                        android:layout_margin="@dimen/margin_normal"
                        android:gravity="center_vertical"
                        android:text="@string/text_home_offers"
                        android:textColor="@android:color/black"
                        android:textSize="@dimen/title_date_text_size" />

                    <android.support.v4.view.ViewPager
                        android:id="@+id/viewpager_home_offers"
                        android:layout_
                        android:layout_
                        android:layout_gravity="center"
                        android:overScrollMode="ifContentScrolls" />
                </LinearLayout>

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

    <android.support.v7.widget.RecyclerView
        android:id="@+id/recyclerViewNavigation"
        android:layout_
        android:layout_
        android:layout_gravity="left"
        android:background="#ffffff"
        android:scrollbars="none" />

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

我的问题是工具栏只有在我移出 RecyclerView 时才会崩溃。

【问题讨论】：

您是否希望底部 ViewPager 在 RecyclerView 滚动时保持固定在底部？另外，你的底部ViewPager 有android:layout_height="wrap_content"。这对你有用吗？我对ViewPager 的理解是它不尊重各个页面想要的高度。

您能否提供有关“仅当我移出 RecyclerView 时工具栏才会折叠”的更多详细信息？我试图描绘实际发生的事情。

@krislarson 实际上我被困在 recyclerview 和折叠工具栏上，我还没有在 bottomviewpager 上工作。我正在滚动它正在滚动的 recyclerview，但要使工具栏折叠，我必须在 recyvlerview 上方或下方提供滚动手势。

我总是在NestedScrollView 内滚动组件时遇到问题（我知道这就是它应该做的，但我永远无法让它做我想做的事情。）我的第一个建议是采取text_home_popular TextView 并实际设置 RecyclerView 适配器使其成为列表中的第一项。听起来很疯狂，但我已经多次做过这种事情，它解决了我所有的问题。稍后我会为您整理完整的答案。

类似的问题没有答案（也许这个问题的答案对你有帮助）：***.com/questions/37479828/…

【参考方案1】：

这个解决方案解决了我的问题。

所以简单来说，当 Appbar 完全展开时，不允许回收器视图滚动，我们将使用 NestedScrollView 的滚动，否则回收器视图将正常滚动。

  appBarLayout.addOnOffsetChangedListener(new AppBarStateChangeListener() 
        @Override
        public void onStateChanged(AppBarLayout appBarLayout, State state) 
            if (state == State.COLLAPSED)
                mRecyclerView.setNestedScrollingEnabled(true);
            if (state == State.EXPANDED)
                mRecyclerView.setNestedScrollingEnabled(false);
        
    );