【问题标题】:android-add moving header above RecyclerViewandroid-add 在 RecyclerView 上方移动 header
【发布时间】:2020-04-02 13:05:34
【问题描述】:

我需要在我的应用程序中的 RecyclerView 上方添加一个标题。当用户滚动recyclerview(右图)时,标题必须移动。我已经搜索过,但还没有找到最终的直接解决方案。实现它的最佳和最简单的方法是什么?

图片来源:link

【问题讨论】:

    标签: android android-recyclerview android-coordinatorlayout android-nestedscrollview


    【解决方案1】:

    为此,您有 2 种选择。

    1. 第一个也是最简单的,您可以在 CoordinatorLayout 内的 CollapsingToolbarLayout 中添加 ImageView,然后将 app:layout_behavior="@string/appbar_scrolling_view_behavior" 添加到您的 RecyclerView

    <androidx.coordinatorlayout.widget.CoordinatorLayout
        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">
    
            <com.google.android.material.appbar.AppBarLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content>
    
                <com.google.android.material.appbar.CollapsingToolbarLayout
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:fitsSystemWindows="true"
                    app:layout_scrollFlags="scroll|exitUntilCollapsed">
    
                        <ImageView
                            android:layout_width="match_parent"
                            android:layout_height="wrap_content"/>
    
                        <androidx.appcompat.widget.Toolbar
                            android:layout_width="match_parent"
                            android:layout_height="?actionBarSize"
                            app:layout_collapseMode="pin"/>
    
                </com.google.android.material.appbar.CollapsingToolbarLayout>
    
            </com.google.android.material.appbar.AppBarLayout>
    
            <androidx.recyclerview.widget.RecyclerView
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:background="@color/transparent"
                android:fillViewport="true"
                app:layout_behavior="@string/appbar_scrolling_view_behavior">
    
    </androidx.coordinatorlayout.widget.CoordinatorLayout>
    
    1. 第二个选项在滚动时会产生相同的效果,在 ReyclerViewAdapter 中,它可以理解 2 个视图类型,一个用于图像,另一个用于项目,这样您必须将图像作为第一个项目传递物品清单
    class CustomAdapter(
                private var list: ArrayList<String>
        ) : RecyclerView.Adapter<RecyclerView.ViewHolder>() {
    
    
            override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): RecyclerView.ViewHolder {
                return if (viewType == VIEW_TYPE_ONE) {
                    ViewHolder1(LayoutInflater.from(context).inflate(R.layout.your_list_item_1, parent, false))
                } else ViewHolder2(LayoutInflater.from(context).inflate(R.layout.your_list_item_2, parent, false))
            }
    
            override fun onBindViewHolder(holder: RecyclerView.ViewHolder, position: Int) {
                if (position == 0) {
                    (holder as ViewHolder1).bind(position)
                } else {
                    (holder as ViewHolder2).bind(position)
                }
            }
    
            override fun getItemCount(): Int {
                return list.size
            }
    
            override fun getItemViewType(position: Int): Int {
                return if (position == 0) {
                    VIEW_TYPE_ONE
                } else VIEW_TYPE_TWO
            }
    
    
            private inner class ViewHolder1 internal constructor(itemView: View) : RecyclerView.ViewHolder(itemView) {
    
                var yourView: ImageView  = itemView.findViewById(R.id.yourView)
    
                fun bind(position: Int) {
                    yourView.setImageResource(list[position])
                }
            }
    
            private inner class ViewHolder2 internal constructor(itemView: View) : RecyclerView.ViewHolder(itemView) {
    
                var yourView: TextView = itemView.findViewById(R.id.yourView)
    
                fun bind(position: Int) {
                    yourView.text = list[position]
                }
            }
    
            companion object {
                private const val VIEW_TYPE_ONE = 1
                private const val VIEW_TYPE_TWO = 2
            }
    

    【讨论】:

      猜你喜欢
      • 2014-09-11
      • 1970-01-01
      • 1970-01-01
      • 2015-10-05
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多