android - 将应用栏 ScrollView 行为添加到 CoordinatorLayout 中的多个 View

标签 android androiddesignsupport android-coordinatorlayout android-collapsingtoolbarlayout android-appbarlayout

我希望将滚动支持添加到 CoordinatorLayout 的单个可滚动 subview 以及 AppBarLayoutCollapsingToolbarLayout。当滚动 RecyclerViewAppBarLayout(下面的精简代码)时,应用栏及其内容成功滚动和折叠。但是,当尝试在 RecyclerView 上方的 LinearLayout 上启动滚动事件时,没有任何反应,因为 LinearLayout 不知道滚动或折叠查看。

目标是让 LinearLayout 充当 RecyclerView 的粘性页眉和 AppBarLayout 的页脚并接收相同的滚动行为作为 RecyclerView,类似于 Spotify's shuffle play/available offline header .事实上,如果 appbar_scrolling_view_behavior layout_behavior 可以像 RecyclerView 一样应用于 LinearLayout 就好了,但我想这种行为在不可滚动的 View 上被忽略了。是否有人知道不需要将 LinearLayout View 实现为 RecyclerView 中的一行的解决方法?

<android.support.design.widget.CoordinatorLayout
    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.support.design.widget.AppBarLayout
        android:id="@+id/app_bar_layout"
        android:layout_width="match_parent"
        android:layout_height="@dimen/collapsible_app_bar_height"
        android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">

        <android.support.design.widget.CollapsingToolbarLayout
            android:id="@+id/collapsing_toolbar_layout"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:background="@drawable/gradient_banner"
            app:contentScrim="@color/background_content_frame"
            app:layout_scrollFlags="scroll|exitUntilCollapsed">

            <ImageView
                android:id="@+id/image_header"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:src="@drawable/some_image"
                app:layout_collapseMode="parallax"/>

            <android.support.v7.widget.Toolbar
                android:id="@+id/collapsible_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.AppBarLayout>

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="@dimen/slide_handle_height"
        android:orientation="horizontal"
        android:background="@color/slide_handle"
        android:gravity="center_vertical">

        <!-- three buttons -->

    </LinearLayout>

    <android.support.v7.widget.RecyclerView
        android:id="@+id/recycler_view"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_marginTop="@dimen/slide_handle_height"
        android:scrollbars="vertical"
        app:layout_behavior="@string/appbar_scrolling_view_behavior"/>

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

最佳答案

您不需要解决方法或奇怪的东西。库支持此行为。只需用此替换您的 LinearLayout 并将其放在 RecyclerView 下方:

<android.support.v4.widget.NestedScrollView
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:layout_behavior="@string/appbar_scrolling_view_behavior">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        android:gravity="center">

        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:padding="15dp"
            android:text="Button text"/>

    </LinearLayout>

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

你还需要把它放在你的 RecyclerView 中以在 LinearLayout 后面显示它:

    android:paddingTop="30dp"
    android:clipToPadding="false"

这就是它的样子:

<android.support.design.widget.CoordinatorLayout
    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.support.design.widget.AppBarLayout
    android:id="@+id/app_bar_layout"
    android:layout_width="match_parent"
    android:layout_height="@dimen/collapsible_app_bar_height"
    android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">

    <android.support.design.widget.CollapsingToolbarLayout
        android:id="@+id/collapsing_toolbar_layout"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@drawable/gradient_banner"
        app:contentScrim="@color/background_content_frame"
        app:layout_scrollFlags="scroll|exitUntilCollapsed">

        <ImageView
            android:id="@+id/image_header"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:src="@drawable/some_image"
            app:layout_collapseMode="parallax"/>

        <android.support.v7.widget.Toolbar
            android:id="@+id/collapsible_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.AppBarLayout>

<android.support.v7.widget.RecyclerView
    android:id="@+id/recycler_view"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_marginTop="@dimen/slide_handle_height"
    android:scrollbars="vertical"
    app:layout_behavior="@string/appbar_scrolling_view_behavior"
    android:paddingTop="30dp"
    android:clipToPadding="false"/>

<android.support.v4.widget.NestedScrollView
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    app:layout_behavior="@string/appbar_scrolling_view_behavior">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        android:gravity="center">

        <Button
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:padding="15dp"
            android:text="Button text"/>

    </LinearLayout>

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

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

这不是一个好的设计,但它是一个解决方案。您可以在 LinearLayout 中放置一个更好的 Layout 使其像 Spotify。

编辑:添加了视频

Demo video Demo video 2

关于android - 将应用栏 ScrollView 行为添加到 CoordinatorLayout 中的多个 View ,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32465548/

相关文章:

android - 如何获取在 addtextchangedlistener 中单击的 ListView 行位置

android - 运行 "cordova build android"- 无法找到属性 android :fontVariationSettings and android:ttcIndex

android - CollapsingToolbarLayout 设置动画阈值?

android - pre-lollipop 设备中的 Snackbar 高度太大

android - 如何使用带有 fragment 的 Android AppBarLayout、Toolbar 和 TabLayout

android - 禁用工具栏滚动

android - 当键盘打开时,包裹在 ScrollView 中的 ConstraintLayout 仍然会调整大小

android - android.webkit.WebViewClassic.loadDataWithBaseURL 中 Webview 的 Java 空指针异常

android - 在android中的 TextView 中创建可点击链接

android - CoordinatorLayout + AppBarLayout + NavigationDrawer