使用ViewPager的CollapsingToolbarLayout中的片段不会向下滑动 [英] Fragment within CollapsingToolbarLayout with ViewPager won't slide down

问题描述

我有一个带有CollapsingToolbarLayout和TabLayout的活动.当我左右滑动时，它在片段之间完美移动.但是，当我尝试向下滚动(屏幕截图中的红色箭头)时，它将忽略它.我尝试将ScrollView添加到片段中，但没有什么不同.有什么想法吗?

I have an activity with a CollapsingToolbarLayout and a TabLayout. When I slide right and left it moves perfectly between fragments. However when I try to scroll down (red arrow in the screenshot) it ignores it. I tried adding a ScrollView to the fragment but it did not make a different. Any ideas why?

顺便说一句-在第二个片段，即RecycleView上，以某种方式向下滑动即可.在右侧的屏幕截图中可以看到:

BTW - Somehow on the second fragment, a RecycleView, the sliding down works. This is seen on the right Screenshot:

MainActivity的XML:

MainActivity's XML:

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

        <android.support.design.widget.AppBarLayout
            android:id="@+id/app_bar_layout"
            android:layout_width="match_parent"
            android:layout_height="wrap_content">

            <android.support.design.widget.CollapsingToolbarLayout
                android:id="@+id/collapsing_toolbar_layout"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                app:contentScrim="?attr/colorPrimary"
                app:layout_scrollFlags="scroll|enterAlways">

                <ImageView
                    android:layout_width="match_parent"
                    android:layout_height="122dp"
                    android:scaleType="centerCrop"
                    android:src="@drawable/rsz_bg_cover"
                    app:layout_collapseMode="parallax" />

                <android.support.v7.widget.Toolbar
                    android:id="@+id/app_bar"
                    android:layout_width="match_parent"
                    android:layout_height="?attr/actionBarSize"
                    android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
                    app:layout_collapseMode="pin" />

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

            <android.support.design.widget.CollapsingToolbarLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                app:layout_scrollFlags="scroll|enterAlways">

                <android.support.design.widget.TabLayout
                    android:id="@+id/tab_layout"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:background="@color/colorAccent"
                    app:layout_collapseMode="pin"
                    app:tabIndicatorColor="@color/colorPrimary"
                    app:tabSelectedTextColor="@android:color/white"
                    app:tabTextColor="#EEE" />
            </android.support.design.widget.CollapsingToolbarLayout>

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

        <android.support.v4.view.ViewPager
            android:id="@+id/view_pager"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            app:layout_behavior="@string/appbar_scrolling_view_behavior" />


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

    <android.support.design.widget.NavigationView
        android:id="@+id/navigation_drawer"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:layout_gravity="start"
        app:menu="@menu/menu_drawer" />
</android.support.v4.widget.DrawerLayout>

推荐答案

尝试使用此布局.我在AppBarLayout中添加了TabLayout，我相信它应该与您想要的一样.但是，如果需要，可以保留两个CollapsingToolbarLayout来实现所需的行为.并确保在所有布局中fitsSystemWindows应该与true或false相同，否则您可能看不到预期的行为.

Try this layout. I have added TabLayout in AppBarLayout, I believe it should work same as you want. But if you want, you can keep two CollapsingToolbarLayout to achieve your desired behaviour. And make sure fitsSystemWindows should be same either true or false in all layouts else you might not see the expected behaviour.

<?xml version="1.0" encoding="utf-8"?>
<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/root_coordinator"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fitsSystemWindows="true">

    <android.support.design.widget.AppBarLayout
        android:id="@+id/app_bar_layout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:fitsSystemWindows="true">

        <android.support.design.widget.CollapsingToolbarLayout
            android:id="@+id/collapsing_toolbar_layout"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            app:contentScrim="?attr/colorPrimary"
            android:fitsSystemWindows="true"
            app:layout_scrollFlags="scroll|enterAlways">

            <ImageView
                android:layout_width="match_parent"
                android:layout_height="122dp"
                android:scaleType="centerCrop"
                android:src="@drawable/rsz_bg_cover"
                app:layout_collapseMode="parallax" />

            <android.support.v7.widget.Toolbar
                android:id="@+id/toolbar"
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
                app:layout_collapseMode="pin" />

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

        <android.support.design.widget.TabLayout
            android:id="@+id/tab_layout"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="@color/colorAccent"
            app:layout_collapseMode="pin"
            app:tabIndicatorColor="@color/colorPrimary"
            app:tabSelectedTextColor="@android:color/white"
            app:tabTextColor="#EEE" />
    </android.support.design.widget.AppBarLayout>

    <android.support.v4.view.ViewPager
        android:id="@+id/view_pager"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_behavior="@string/appbar_scrolling_view_behavior" />

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

在Fragment布局中，使用NestedScrollView并在其中添加layout_behavior.

And in Fragment layout, Use NestedScrollView and add layout_behavior in it.

<?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"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@color/white"
    app:layout_behavior="@string/appbar_scrolling_view_behavior">

        // Your Layout

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

这篇关于使用ViewPager的CollapsingToolbarLayout中的片段不会向下滑动的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！