使用RecycleView优雅的实现数据列表更新

简介: 使用RecycleView优雅的实现数据列表更新

问题描述


关于notifyDataSetChanged的弊端,无需赘言,他会对 Recycleview 的整个列表进行刷新。因此在大数据量场景下(目前此种更新数据方法也不早再是官方推荐的了),这可能是很大的性能障碍。

解决方案:

  1. 使用 ListAdapter 进行局部刷新数据
  2. 使用 DiffUtil.Callback 进行局部刷新数据
  3. 使用notifyItemChanged(int position)notifyItemRangeChanged(int positionStart, int itemCount)notifyItemInserted(int position)notifyItemMoved(int fromPosition, int toPosition)几个 api 进行更新

方法3没什么好说的,本文主要讲方法 1、2方法1的实现是基于方法2进行实现的。

使用这两种方法的 优点如下:

  1. 可以实现数据的局部刷新;例如我们添加、更改、移除数据的时候都可能涉及到 item 布局位置和内容的动态改变,使用新方案可以让这个更新过程以动画的方式进行
  2. 可以提高性能;原因是只有被我们更改的数据 item 的 onBindViewHolder 才会被回调

缺点如下:

  1. 操作数据后 item 回调onBindViewHolder中的position是不可靠的,建议禁止使用position获取数据进行操作
  2. 没有notifyDataSetChanged这种甩手的使用方法方便(哈哈,完全可以被优点覆盖)


对 notifyDataSetChanged 的鞭尸


notifyDataSetChanged的使用很简单,本例我们放一张 gif,展示一个列表,然后将列表进行乱序然后notifyDataSetChanged进行刷新;

image.png

我们可以发现,刷新过程中并没有动画的实现,因为我们对没个 item 设置了随机颜色,所以每次刷新界面闪动很大


ListAdapter 方式


实现代码

RecycleViewListAdapterActivity

关键代码

class RecycleViewListAdapterActivity : AppCompatActivity() {
    var datas = mutableListOf(
        Name("李白"),
        Name("李白1"),
        Name("李白2"),
        Name("李白3"),
        Name("李白4"),
        Name("李白5"),
        Name("李白6"),
    )
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        val binding = ActivityRecycleViewListAdapterBinding.inflate(layoutInflater)
        setContentView(binding.root)
        val adapter = CustomListAdapter()
        binding.btnShuffle.setOnClickListener {
            val newData = datas.toMutableList().apply {
                shuffle()
            }
            datas = newData
            adapter.submitList(newData)
        }
        binding.recycle.let {
            it.layoutManager = LinearLayoutManager(this)
            it.adapter = adapter
        }
        adapter.submitList(datas)
    }
    private class CustomListAdapter() : ListAdapter<Name, CustomListHolder>(CustomDiffCallback()) {
        override fun onCreateViewHolder(parent: ViewGroup, viewType: Int): CustomListHolder {
            val binding =
                ItemTextBinding.inflate(LayoutInflater.from(parent.context), parent, false)
            return CustomListHolder(binding)
        }
        @SuppressLint("SetTextI18n")
        override fun onBindViewHolder(holder: CustomListHolder, position: Int) {
            logEE("执行onBindViewHolder:$position ${getItem(position).name}")
            holder.binding.tv.text = "$position  ${getItem(position).name}"
            holder.binding.root.setBackgroundColor(Color.rgb(randomColor(), randomColor(), randomColor()))
        }
    }
}
class CustomListHolder(val binding: ItemTextBinding) : RecyclerView.ViewHolder(binding.root) {
}
data class Name(val name: String)
class CustomDiffCallback : DiffUtil.ItemCallback<Name>() {
    override fun areItemsTheSame(oldItem: Name, newItem: Name): Boolean {
        return oldItem.name == newItem.name
    }
    override fun areContentsTheSame(oldItem: Name, newItem: Name): Boolean {
        return oldItem == newItem
    }
}
复制代码

效果

使用 ListAdapter 刷新更加流畅,并且有动画

image.png


DiffUtil.Callback 方式


实现代码

RecycleDifferUtilsUesActivity关键代码创建 DifferCallback 方法

class DifferCallback(val oldDatas: List<Name>, val newDatas: List<Name>) : DiffUtil.Callback() {
    override fun getOldListSize(): Int = oldDatas.size
    override fun getNewListSize(): Int = newDatas.size
    override fun areItemsTheSame(oldItemPosition: Int, newItemPosition: Int): Boolean {
        return (oldDatas[oldItemPosition].name == newDatas[newItemPosition].name)
    }
    override fun areContentsTheSame(oldItemPosition: Int, newItemPosition: Int): Boolean {
        return areItemsTheSame(oldItemPosition, newItemPosition)
    }
    override fun getChangePayload(oldItemPosition: Int, newItemPosition: Int): Any? {
        return super.getChangePayload(oldItemPosition, newItemPosition)
    }
}
复制代码

调用刷新数据的代码

val diffResult = DiffUtil.calculateDiff(DifferCallback(old, new))
                    diffResult.dispatchUpdatesTo(it)
复制代码

效果

使用 ListAdapter 刷新更加流畅,并且有动画

image.png

git:github.com/ananananzhu…



相关文章
|
缓存 Android开发
ListView使用技巧-更新中
ListView使用技巧-更新中
64 0
|
计算机视觉
RecyclerView#Adapter支持无数据布局、错误布局和列表尾部的”没有更多了“布局
实际开发中,UI小姐姐都会提供通用的`无数据页面`、`错误提示页面`。 针对常见的`支持下拉刷新和上拉加载更多的列表页面`,将他们的通用逻辑抽取出来,这样我们在开发过程中就只需要关注具体的业务逻辑了,无需每次通过cv来完善`无数据页面`、`错误提示页面`的逻辑了。
|
存储 缓存 索引
更好的 RecyclerView 表项子控件点击监听器
上篇介绍了一种新的监听 RecyclerView 表项点击事件的方法。实现了将点击事件和RecyclerView.Adapter解耦。这一篇介绍如何监听 RecyclerView 表项子控件点击事件。
590 0
|
Android开发 索引
【RecyclerView】 十一、RecyclerView 数据更新 ( 删除单条数据 | 批量删除数据 )
【RecyclerView】 十一、RecyclerView 数据更新 ( 删除单条数据 | 批量删除数据 )
514 0
【RecyclerView】 十一、RecyclerView 数据更新 ( 删除单条数据 | 批量删除数据 )
|
JavaScript 前端开发 API
SwiftUI—如何调整记录在List列表里的顺序
SwiftUI—如何调整记录在List列表里的顺序
267 0
SwiftUI—如何调整记录在List列表里的顺序
SwiftUI—如何使列表同时支持删除和移动记录的功能
SwiftUI—如何使列表同时支持删除和移动记录的功能
152 0
SwiftUI—如何使列表同时支持删除和移动记录的功能
|
Android开发
Android开发 ListView(垂直滚动列表项视图)的简单使用
Android开发 ListView(垂直滚动列表项视图)的简单使用
351 0
Android开发 ListView(垂直滚动列表项视图)的简单使用
|
Android开发 索引
【RecyclerView】 十二、RecyclerView 数据更新 ( 修改单条数据 | 批量修改数据 )
【RecyclerView】 十二、RecyclerView 数据更新 ( 修改单条数据 | 批量修改数据 )
493 0
【RecyclerView】 十二、RecyclerView 数据更新 ( 修改单条数据 | 批量修改数据 )