AppBarLayout 与 FrameLayout 容器作为滚动内容不起作用答案

【问题标题】：AppBarLayout with FrameLayout container as scrolling content doesn't workAppBarLayout 与 FrameLayout 容器作为滚动内容不起作用
【发布时间】：2015-08-12 13:09:32
【问题描述】：

我正在尝试使用最新的设计库使我的工具栏在滚动时隐藏/显示。我的问题是我拥有的滚动内容在片段中，我只是将它注入 FrameLayout 容器并且它不起作用。这是我的活动：

<android.support.v4.widget.DrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/drawer_layout"
android:layout_width="match_parent"
android:layout_height="match_parent">

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

    <android.support.design.widget.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <include layout="@layout/layout_toolbar" />

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

    <FrameLayout
        android:id="@+id/container"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_behavior="@string/appbar_scrolling_view_behavior" />

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

<FrameLayout
    android:id="@+id/navigation_drawer_container"
    android:layout_width="@dimen/navigation_drawer_width"
    android:layout_height="match_parent"
    android:layout_gravity="start"
    tools:layout="@layout/fragment_nav_drawer_anon" />

还有我的片段：

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">

<android.support.v4.widget.SwipeRefreshLayout
    android:id="@+id/pull_to_refresh"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <ListView
        android:id="@android:id/list"
        android:layout_width="match_parent"
        android:layout_height="match_parent"/>
</android.support.v4.widget.SwipeRefreshLayout>

<TextView
    android:id="@android:id/empty"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:textSize="18sp"
    android:fontFamily="sans-serif"
    android:color="@color/dark_grey"
    android:padding="60dp"/>

和工具栏：

<android.support.v7.widget.Toolbar xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:background="?attr/colorPrimary"
android:minHeight="?attr/actionBarSize"
app:layout_scrollFlags="scroll|enterAlways"
style="@style/Widget.MyApp.ActionBar" />

我正在关注官方doc 和这个demo，但仍然不知道如何使它工作。

【问题讨论】：

您能给我们提供更多信息吗？比如你想要实现什么，以及你希望如何构建视图/片段。

标签： android android-toolbar android-design-library android-coordinatorlayout

【解决方案1】：

将您的 FrameLayout 替换为 android.support.v4.widget.NestedScrollView

NestedScrollView 与 ScrollView 类似，但它支持在新旧版本的 Android 上同时充当嵌套滚动父项和子项。默认启用嵌套滚动。

Link to doc

【讨论】：

这仅在您希望整个片段垂直滚动时才有效。它不起作用，例如当您的片段包含需要与 CoordinatorLayout 的其他子级协调的 ViewPager 时。如果 FragmentContainer 不是 NestedScrollView，则 CoordinatorLayout 似乎不适用于稍后通过 FragmentTransactions 添加的 Children。遗憾的是，如果整个片段不应该垂直滚动而是对滑动手势做出反应，则无法使用 NestedScrollView。
目前androidx.core.widget.NestedScrollView。在上面添加或替换FrameLayout。

【解决方案2】：

使用 FrameLayout 作为 CoordinatorLayout 的子元素效果很好。工具栏按预期折叠。一开始我遇到了问题，当时我使用了过时的库。

这是我现在正在使用的 gradle 依赖项：

compile 'com.android.support:appcompat-v7:22.2.1'
compile 'com.android.support:cardview-v7:22.2.0'
compile 'com.android.support:recyclerview-v7:22.2.0'
compile 'com.android.support:design:22.2.0'

我在活动布局中使用FrameLayout 和属性app:layout_behavior="@string/appbar_scrolling_view_behavior" 作为CoordinatorLayout 的子项。 FrameLayout 用作片段的容器。我的片段布局的根元素是 RecyclerView 或 NestedScrollView。

这是活动的布局：

    <android.support.design.widget.CoordinatorLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        >

    <FrameLayout
            android:id="@+id/..."
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            app:layout_behavior="@string/appbar_scrolling_view_behavior"
            />

    <android.support.design.widget.AppBarLayout
            android:layout_height="192dp"
            android:layout_width="match_parent"
            >
        <android.support.design.widget.CollapsingToolbarLayout
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                app:layout_scrollFlags="scroll|exitUntilCollapsed"
                >
            <ImageView
                    android:id="@+id/.."
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:fitsSystemWindows="true"
                    android:scaleType="centerCrop"
                    android:src="@drawable/..."
                    app:layout_collapseMode="parallax"/>
            <android.support.v7.widget.Toolbar
                    android:id="@+id/toolbar_sessions"
                    android:layout_height="?attr/actionBarSize"
                    android:layout_width="match_parent"
                    app:layout_collapseMode="pin"
                    />
        </android.support.design.widget.CollapsingToolbarLayout>
    </android.support.design.widget.AppBarLayout>

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

我的第一个片段的布局如下所示：

<android.support.v7.widget.RecyclerView
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:scrollbars="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="..."
    />

我的第二个片段的布局如下所示：

<android.support.v4.widget.NestedScrollView
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="..."
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="..."
    >
...
</android.support.v4.widget.NestedScrollView>

【讨论】：

【解决方案3】：

这种行为的原因是 Framelayout 没有指定行为。 CoordinatorLayout 依赖子视图来处理 Behaviour。

你可以在底部阅读

http://android-developers.blogspot.in/2015/05/android-design-support-library.html

说明

CoordinatorLayout 和自定义视图

需要注意的重要一点是 CoordinatorLayout 不对 FloatingActionButton 有任何与生俱来的理解或 AppBarLayout 工作 - 它只是以以下形式提供了一个额外的 API 一个 Coordinator.Behavior，它允许子视图更好地控制触摸事件和手势以及声明每个之间的依赖关系其他并通过 onDependentViewChanged() 接收回调。

视图可以通过使用 CoordinatorLayout.DefaultBehavior(YourView.Behavior.class) 注释，或使用 app:layout_behavior="com.example.app.YourView$Behavior" 属性。该框架使任何视图都可以与协调器布局。

编辑：虽然 FrameLayout 不是自定义视图，但它没有指定 CoordinateLayout 寻求的行为。

【讨论】：

The reason for that behaviour is that the Framelayout doesn't specify a Behaviour。谢谢你。这真的很有帮助。

【解决方案4】：

在我的应用程序中，它仅适用于 RecyclerView。也许你应该使用 RecyclerView 而不是 ListView。

【讨论】：

Activity 或 Fragment 中有 RecyclerView 吗？
@wwang 刚测试过，ListView 不行。在我的应用程序中，我有带有 RecyclerView 的片段，它可以无缝工作，为了测试我添加了一个带有 ListView 的片段，但它无法工作。
很高兴知道。谢谢。
所以你的意思是只有 RecyclerView 可以用来显示/隐藏应用栏？而那个 ListView 不能？
@wwang 你用 recyclerview 解决了你的问题吗？一旦用户开始滚动recyclerview或listview，我需要显示/隐藏顶部布局然后它再次向下滚动.....我将如何在这里解决问题stackoverflow.com/questions/32716906/…

【解决方案5】：

您可以在 CoordinatorLayout 中使用 Framelayout 实现滚动。为此，您必须在您的 frameLayout 内以及您想要此折叠效果的滚动视图内使用 app:layout_behavior="@string/appbar_scrolling_view_behavior"。

例如，如果你在你的 frameLayout 中膨胀 RecyclerView，那么你也必须在你的 recyclerView 中使用app:layout_behavior="@string/appbar_scrolling_view_behavior"。

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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="match_parent"

    android:orientation="vertical">
<android.support.v7.widget.RecyclerView
    android:id="@+id/list"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
app:layout_behavior="@string/appbar_scrolling_view_behavior"
    />
</Relativelayout>

或者，

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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="match_parent"

    android:orientation="vertical">
 <android.support.v4.widget.NestedScrollView
           android:layout_width="match_parent"
           android:layout_height="fill_parent"
        android:layout_above="@+id/bNext"
        android:fillViewport="true"
           android:scrollbars="none"
        app:layout_behavior="@string/appbar_scrolling_view_behavior">
<!--  your content -->
</android.support.v4.widget.NestedScrollView>
</Relativelayout>

因此，使用这个过程，无论是包含recycler还是nestedScrollview，都可以通过frameLayout实现滚动。

【讨论】：

我知道回答有点晚了，但我用这种方式解决了我的问题

【解决方案6】：

这是个好问题。我也一样。

您的容器FrameLayout 定义正确，问题在于Fragment。 Fragment 应该有 RecyclerView 而不是 ListView，因为它现在已被弃用。

例子：

<android.support.v7.widget.RecyclerView
    android:id="@+id/list"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:clipToPadding="false"
    android:paddingTop="@dimen/activity_vertical_margin"/>

我在我的应用程序中使用了相同的结构，并且效果很好。

【讨论】：

【解决方案7】：

ListView 没有实现 NestedScrollingChild，所以它不起作用。

RecyclerView 可以，因此它可以将滚动传播到 NestedScrollingParent（CoordinatorLayout）。

【讨论】：

是否可以让ListView实现这个接口，并让它工作？
我认为是的。看一下 RecyclerView 的代码并尝试在自定义 ListView 类中实现它。我还没有尝试过，如果你成功了，请及时更新！
我已经尝试使用了一段时间，但是在给定的时间内我没有成功。如果你成功了，请告诉我。我也尝试使用这个库来拥有这种能力：github.com/ksoichiro/Android-ObservableScrollView，但我未能让它们很好地协同工作。

【解决方案8】：

你只需要替换

框架布局

到

android.support.v4.widget.NestedScrollView

这样：

<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="192dp"
                android:scaleType="centerCrop"
                android:src="@drawable/header"
                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.AppBarLayout>

    <!-- This was before FrameLayout -->
    <android.support.v4.widget.NestedScrollView
        android:id="@+id/content_frame"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_behavior="@string/appbar_scrolling_view_behavior">
    </android.support.v4.widget.NestedScrollView>

    <android.support.design.widget.FloatingActionButton
        android:id="@+id/fab"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom|right"
        android:layout_margin="16dp"
        android:src="@drawable/ic_drawer_alertas"
        app:borderWidth="0dp"
        app:fabSize="mini" />
</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:headerLayout="@layout/drawer_header"
    app:itemIconTint="@color/colorAccent"
    app:itemTextColor="@color/colorSecondaryText"
    app:menu="@menu/menu_main" />

【讨论】：

【解决方案9】：

将app:layout_scrollFlags="scroll|enterAlways" 从工具栏移动到框架布局。抱歉迟到了。

【讨论】：

但它会影响列表滚动。

【解决方案10】：

您必须向滚动视图添加行为：

<android.support.v4.widget.SwipeRefreshLayout
    android:layout_marginTop="5dp"
    android:id="@+id/swipe_main"
    android:enabled="false"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    app:layout_behavior="@string/appbar_scrolling_view_behavior">
<com.marshalchen.ultimaterecyclerview.UltimateRecyclerView
    android:id="@+id/rvUserProfile"
    app:recyclerviewEmptyView ="@layout/ev_home"
    app:recyclerviewClipToPadding="false"
    android:layout_width="match_parent"
    android:layout_height="match_parent"></com.marshalchen.ultimaterecyclerview.UltimateRecyclerView>
</android.support.v4.widget.SwipeRefreshLayout>

【讨论】：