使用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…



相关文章
|
1月前
|
开发框架 前端开发 JavaScript
在DevExpress的GridView的列中,使用RepositoryItemSearchLookUpEdit控件实现产品列表信息的展示和选择
在DevExpress的GridView的列中,使用RepositoryItemSearchLookUpEdit控件实现产品列表信息的展示和选择
|
4月前
|
前端开发 JavaScript
如何处理用户的拖拽排序操作
这个示例展示了如何使用JavaScript处理HTML列表的拖拽排序。通过监听`dragstart`、`dragend`、`dragenter`、`dragleave`、`dragover`和`drop`事件,实现拖拽元素时的视觉反馈和元素位置交换。当用户拖放列表项时,相关事件触发,更新列表顺序,提供直观的交互体验。
|
缓存 Android开发
ListView使用技巧-更新中
ListView使用技巧-更新中
59 0
|
存储 缓存 索引
更好的 RecyclerView 表项子控件点击监听器
上篇介绍了一种新的监听 RecyclerView 表项点击事件的方法。实现了将点击事件和RecyclerView.Adapter解耦。这一篇介绍如何监听 RecyclerView 表项子控件点击事件。
578 0
|
Android开发 索引
【RecyclerView】 十一、RecyclerView 数据更新 ( 删除单条数据 | 批量删除数据 )
【RecyclerView】 十一、RecyclerView 数据更新 ( 删除单条数据 | 批量删除数据 )
494 0
【RecyclerView】 十一、RecyclerView 数据更新 ( 删除单条数据 | 批量删除数据 )
SwiftUI—如何调整记录在List列表里的顺序
SwiftUI—如何调整记录在List列表里的顺序
252 0
SwiftUI—如何调整记录在List列表里的顺序
|
API
原来可以这么操作—修改子View绘制顺序
周一的早上,由于项目的开发做的差不多了,正在等待测试结果的我就开始发呆,思考端午节的去处~
310 0
原来可以这么操作—修改子View绘制顺序
|
Android开发
Android开发 ListView(垂直滚动列表项视图)的简单使用
Android开发 ListView(垂直滚动列表项视图)的简单使用
342 0
Android开发 ListView(垂直滚动列表项视图)的简单使用
|
XML 存储 数据格式
如何使用RecyclerView优雅地实现复杂列表效
/ 今日科技快讯 / 发现一件很有意思的事情,今天这篇文章中介绍的RecyclerView,以及昨天文章中介绍的Lifecycles,它们共同的作者都是前天文章中介绍的Yigit Boyar大神。确实不是我有意为之,我都是按照投稿的顺序来安排推送的。而Yigit Boyar大神明天将会做客上海GDG,与大家进行一场问答式的技术活动。这种跟Google大神零距离接触的机会可不多,希望大家到时都能准时观看,我们明天见。/ 作者简介 /本篇文章来自秦川小将的投稿,给大家分享了如何使用RecyclerView实现复杂的列表,相信会对大家有所帮助!同时也感谢作者贡献的精彩文章! 秦川小将的博客地址:
如何使用RecyclerView优雅地实现复杂列表效
|
Android开发 索引
【RecyclerView】 十二、RecyclerView 数据更新 ( 修改单条数据 | 批量修改数据 )
【RecyclerView】 十二、RecyclerView 数据更新 ( 修改单条数据 | 批量修改数据 )
478 0
【RecyclerView】 十二、RecyclerView 数据更新 ( 修改单条数据 | 批量修改数据 )