【问题标题】:Achieving proper scrolling with RecyclerView, android jetpack navigation and a collapsing Toolbar使用 RecyclerView、android jetpack 导航和折叠工具栏实现正确的滚动
【发布时间】:2019-08-05 20:00:43
【问题描述】:

我尝试在我的 android 应用程序中使用以下设置来实现正确的滚动行为。

对于导航,我将 jetpack 导航与 Toolbar 布局和底部导航结合使用。我也使用“一个活动,多个片段”的原则。底部导航的每一项都会根据我的导航图启动对应的Fragment。这需要我在布局中使用NavHostFragment

我的Toolbar 布局是活动布局的一部分,并根据当前片段进行填充。一些片段需要折叠Toolbar,它也会在需要时添加。但是当有一个折叠工具栏时,我面临以下问题:

在特定情况下,我有一个折叠的ToolbarNavHostFragment 填充有RecyclerView。在其他情况下,我似乎可以将app:layout_behavior="@string/appbar_scrolling_view_behavior" 添加到RecyclerView 并获得预期的结果,因为RecyclerViewCoordinatorLayout 的直接子代。在我的例子中,RecyclerViewFragment 的子代,它基本上是 FrameLayout(根据 Layout Inspector)。这会导致问题,RecyclerView 上的 layout_behaviour 无效,因为RecyclerView 不是CoordinatorLayout 的直接子代。

我无法为这个问题想出一个可行的解决方案。有人有想法吗?

layout/activity_overview.xml

<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_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".OverviewActivity">

<androidx.coordinatorlayout.widget.CoordinatorLayout android:layout_width="wrap_content"
                                                     android:layout_height="wrap_content"
                                                     android:id="@+id/toolbarCoordiantor"
                                                     android:layout_marginTop="?attr/actionBarSize"
                                                     app:layout_constraintTop_toTopOf="parent"
                                                     app:layout_constraintBottom_toTopOf="@id/overview_bottom_navigation"
                                                     app:layout_constraintStart_toStartOf="parent"
                                                     app:layout_constraintEnd_toEndOf="parent">

    <fragment android:layout_width="match_parent" android:layout_height="wrap_content"
              android:id="@+id/overview_fragmentholder"
              android:name="androidx.navigation.fragment.NavHostFragment"
              app:layout_constraintStart_toStartOf="parent"
              app:layout_constraintEnd_toEndOf="parent"
              app:layout_constraintTop_toBottomOf="@+id/toolbar"
              app:layout_constraintBottom_toBottomOf="parent"
              app:defaultNavHost="true"
              android:layout_marginBottom="?attr/actionBarSize"
              android:layout_marginTop="?attr/actionBarSize"
              app:navGraph="@navigation/nav_graph"
              app:layout_constraintVertical_bias="1.0"/>

    <include layout="@layout/toolbar"
             android:id="@+id/toolbar"/>

</androidx.coordinatorlayout.widget.CoordinatorLayout>


<com.google.android.material.bottomnavigation.BottomNavigationView
        android:id="@+id/overview_bottom_navigation"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:foregroundGravity="bottom"
        app:menu="@menu/navigation"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:itemBackground="@color/white"
        app:itemIconTint="@color/bottom_navigation_color_states"
        app:itemTextColor="@color/bottom_navigation_color_states"/>

layout/toolbar.xml

<com.google.android.material.appbar.CollapsingToolbarLayout
        android:id="@+id/collapsingToolbarLayout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:fitsSystemWindows="true"
        app:layout_scrollFlags="scroll|exitUntilCollapsed|snap|snapMargins"
        android:minHeight="?attr/actionBarSize">

    <androidx.constraintlayout.widget.ConstraintLayout android:layout_width="match_parent"
                                                       android:layout_height="wrap_content"
                                                       android:id="@+id/expandedToolbarContentContainer"
                                                       android:layout_marginTop="?attr/actionBarSize"
                                                       app:layout_collapseMode="parallax"/>

    <androidx.appcompat.widget.Toolbar android:layout_width="match_parent"
                                       android:layout_height="?attr/actionBarSize"
                                       app:layout_collapseMode="pin"
                                       style="@style/AppTheme.DarkToolbar"
                                       android:id="@+id/toolbarView">

        <androidx.constraintlayout.widget.ConstraintLayout android:layout_width="match_parent"
                                                           android:layout_height="match_parent"
                                                           android:background="@drawable/round_outline"
                                                           style="@style/AppTheme.DarkToolbar.Container"
                                                           android:id="@+id/toolbarContentContainer"/>

    </androidx.appcompat.widget.Toolbar>

</com.google.android.material.appbar.CollapsingToolbarLayout>

layout/list.xml

<layout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:app="http://schemas.android.com/apk/res-auto">
    <androidx.recyclerview.widget.RecyclerView
            android:id="@+id/dish_list"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:scrollbars="vertical"
            app:layout_constraintLeft_toLeftOf="parent"
            app:layout_constraintEnd_toEndOf="parent"
            android:layoutAnimation="@anim/layout_animation_fall_down"
    />

【问题讨论】:

    标签: android android-recyclerview android-collapsingtoolbarlayout androidx android-jetpack-navigation


    【解决方案1】:

    Jurij Pituljas approach 将阻止RecyclerViewscrollToPosition 方法工作。此外,使用RecyclerView 导航回片段会将其滚动位置重置为顶部。

    here 描述了一种更好的方法。甚至参考文章中的FrameLayouts 周围也不需要。不要将片段包装在NestedScrollView 中,只需将任何非滚动片段布局视图包装到NestedScrollView 中。

    带有NavHostFragment 的Activity 布局: 无需将片段包装到滚动视图中。只需设置layout_behavior

    ...
    <fragment
      android:id="@+id/navigation_host_fragment"
      android:name="androidx.navigation.fragment.NavHostFragment"
      android:layout_width="match_parent"
      android:layout_height="match_parent"
      app:defaultNavHost="true"
      app:layout_behavior="@string/appbar_scrolling_view_behavior"
      app:navGraph="@navigation/navigation_graph" />
    ...
    

    带有根RecyclerView 的片段布局: 没什么特别的,因为RecyclerView 具有滚动功能。

    <androidx.recyclerview.widget.RecyclerView
      xmlns:android="http://schemas.android.com/apk/res/android"
      android:layout_width="match_parent"
      android:layout_height="match_parent"
      android:scrollbars="vertical" />
    

    片段布局,例如TextView 包裹在根 NestedScrollView 中以添加滚动功能。

    <androidx.core.widget.NestedScrollView
      xmlns:android="http://schemas.android.com/apk/res/android"
      android:layout_width="match_parent"
      android:layout_height="match_parent"
      android:orientation="vertical">
      <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">
        <TextView
          android:layout_width="match_parent"
          android:layout_height="wrap_content"
          android:text="non scrolling content wrapped" />
      </LinearLayout>
    </androidx.core.widget.NestedScrollView>
    

    【讨论】:

      【解决方案2】:

      尝试用 NestedScrollView 将 host_fragment 包装成所需的行为,如下所示:

       <androidx.core.widget.NestedScrollView
              android:id="@+id/nestedScrollView"
              android:layout_width="match_parent"
              android:layout_height="match_parent"
              android:fillViewport="true"
              android:fitsSystemWindows="true"
              android:transitionGroup="true"
              app:layout_behavior="@string/appbar_scrolling_view_behavior">
      
              <fragment
                  android:id="@+id/nav_host_fragment"
                  android:name="androidx.navigation.fragment.NavHostFragment"
                  android:layout_width="match_parent"
                  android:layout_height="match_parent"
                  app:defaultNavHost="true"
                  app:navGraph="@navigation/my_nav_host" />
          </androidx.core.widget.NestedScrollView>
      

      【讨论】:

      • 这将阻止RecyclerViewscrollToPosition 方法工作。另外使用RecyclerView 导航回片段会将其滚动位置重置为顶部。请参阅my answer 了解更好的方法。
      猜你喜欢
      • 1970-01-01
      • 2023-03-15
      • 1970-01-01
      • 2016-05-11
      • 2017-01-10
      • 1970-01-01
      • 1970-01-01
      • 2021-07-17
      • 1970-01-01
      相关资源
      最近更新 更多