如何使工具栏与片段中的内容一起滚动?

Posted

技术标签:

【中文标题】如何使工具栏与片段中的内容一起滚动?【英文标题】:How to make Toolbar scroll with content in Fragment? 【发布时间】:2019-12-28 10:07:58 【问题描述】:

我有一个带有 DrawerLayout 的 Activity,其中包含一个包含 RecyclerView 的 Fragment。如何让 ToolBar 在 RecyclerView 中滚动时滚动而无需加载 RecyclerView 中的所有项目?

这可能吗?

我尝试将 CoordinatorLayout 和 FrameLayout(片段容器)包装到 NestedScrollView 中并禁用 RecyclerView 中的嵌套滚动,这导致 RecyclerView 加载了所有内容并且速度慢得多。

activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<androidx.drawerlayout.widget.DrawerLayout
        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:id="@+id/drawer_layout"
        android:layout_
        android:layout_
        android:fitsSystemWindows="true"
        tools:openDrawer="start">

    <include
            layout="@layout/app_bar_main"
            android:layout_
            android:layout_/>

    <com.google.android.material.navigation.NavigationView
            android:id="@+id/nav_view"
            android:layout_
            android:layout_
            android:layout_gravity="start"
            android:fitsSystemWindows="true"
            app:headerLayout="@layout/nav_header_main"
            app:menu="@menu/activity_main_drawer"/>

</androidx.drawerlayout.widget.DrawerLayout>

app_bar_main.xml

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
        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_
        android:layout_
        tools:context=".ui.MainActivity">

        <androidx.constraintlayout.widget.ConstraintLayout
                android:layout_
                android:layout_
                app:layout_constraintTop_toTopOf="parent"
                app:layout_constraintBottom_toBottomOf="parent"
                app:layout_constraintStart_toStartOf="parent"
                app:layout_constraintEnd_toEndOf="parent"
        >

            <androidx.coordinatorlayout.widget.CoordinatorLayout
                    android:id="@+id/toolbar_container"
                    android:layout_
                    android:layout_
                    app:layout_constraintTop_toTopOf="parent"
                    app:layout_constraintStart_toStartOf="parent"
                    app:layout_constraintEnd_toEndOf="parent"
            >
                    <com.google.android.material.appbar.AppBarLayout
                            android:layout_
                            android:layout_
                            android:theme="@style/AppTheme.AppBarOverlay"
                            android:elevation="0dp"
                    >

                        <androidx.appcompat.widget.Toolbar
                                android:id="@+id/toolbar"
                                android:layout_
                                android:layout_
                                android:background="?attr/colorPrimary"
                                app:popupTheme="@style/AppTheme.PopupOverlay"
                                app:layout_scrollFlags="scroll"
                        />
                    </com.google.android.material.appbar.AppBarLayout>

            </androidx.coordinatorlayout.widget.CoordinatorLayout>

            <FrameLayout
                    android:layout_
                    android:layout_
                    app:layout_constraintTop_toBottomOf="@id/toolbar_container"
                    app:layout_constraintBottom_toBottomOf="parent"
                    app:layout_constraintStart_toStartOf="parent"
                    app:layout_constraintEnd_toEndOf="parent"
            >
                <include layout="@layout/content_main"/>
            </FrameLayout>

</androidx.constraintlayout.widget.ConstraintLayout>

content_main.xml

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
        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:layout_
        android:layout_
        app:layout_behavior="@string/appbar_scrolling_view_behavior"
        tools:showIn="@layout/app_bar_main"
        tools:context=".ui.MainActivity">

    <FrameLayout
            android:id="@+id/container"
            android:layout_
            android:layout_
            app:layout_constraintTop_toTopOf="parent"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
    />

</androidx.constraintlayout.widget.ConstraintLayout>

片段.xml

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
        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_
        android:layout_
>

    <androidx.recyclerview.widget.RecyclerView
            android:id="@+id/alimentaries"
            android:layout_
            android:layout_
            app:layout_constraintTop_toTopOf="parent"
            app:layout_constraintBottom_toBottomOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            android:nestedScrollingEnabled="false"
            tools:listitem="@layout/item_alimentary"
    />

</androidx.constraintlayout.widget.ConstraintLayout>

【问题讨论】:

***.com/questions/13559275/… 我觉得这个链接可以帮到你!!! ConstrainLayout 没有关于工具栏滚动行为的实现。将行为设置到您的回收站视图中并运行。而且您还需要使用CollapsingToolbarLayout 来获得滚动行为。 :) 我忘了提到它应该像当前的 Gmail 应用程序一样工作 【参考方案1】:

我认为有两种方法可以实现您想要的行为。您可以使用折叠工具栏布局,另一种方法是使您的活动全屏并添加您想要在滚动上折叠的布局,作为RecyclerView 的标题。

这是在 Android 中实现折叠工具栏的nice example。

在第二种方法中,您首先需要有一个全屏活动,然后您必须以具有标题的方式实现您的RecyclerView。 Here's how 您可以在 RecyclerView 中添加标题。在您的AndroidManifest.xml 中添加以下内容以进行全屏活动。

<activity android:name=".ActivityName"
    android:label="@string/app_name"
    android:theme="@android:style/Theme.NoTitleBar.Fullscreen"/>

【讨论】:

我忘了提到它应该像当前的 Gmail 应用程序一样工作

以上是关于如何使工具栏与片段中的内容一起滚动?的主要内容,如果未能解决你的问题,请参考以下文章

工具栏将与所有内容一起滚动。否则不起作用

如何使这种自​​动布局安排与滚动视图一起使用

滚动选项卡中的片段时隐藏/显示工具栏

如何使搜索栏不与表格视图一起滚动? [复制]

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

Android:向上滚动时显示工具栏(向上拖动),向下滚动时隐藏(向下拖动)