使用RecyclerView的ItemDecoration实现StickyHeader效果(笔记)

版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/liangfeng093/article/details/78709927

最近要做一个类似QQ浏览器的浏览记录效果

就是下面的效果



QQ浏览器玩了半天,分析出了一点东西。

之前用ItemDecoration给RecyclerView绘制item过分割线。

大家仔细观察一下就可以发现,这个效果就是给指定的item绘制分割线。

这里有一个比较好的教程,博主就不写详细的分析和实现了

另外还有一种实现方式:Android RecyclerView 顶部悬浮实现有兴趣的可以试一下


重点说一下踩的坑:

1.数据分类:

由于浏览记录要求最新的记录要展示在最上面,而博主在存储的时候是顺序存储的。所以需要在查询数据库之后,反转集合。

集合的顺序是反的,但是集合中的JavaBean的position属性还是原来的(正的集合中的顺序)。那么在判断first和last的时候就需

要注意了。

fun isFirstViewInGroup(): Boolean {//展示的shi反转的集合
    if (groupSize > 0) {
        return position == groupSize - 1
    } else {
        return position == 0
    }
}

fun isLastViewInGroup(): Boolean {//展示的shi反转的集合
    return position == 0
}


2.getItemOffSets()方法:

这个方法主要是用来占位的。无论是分割线还是图中的浮动条都是需要位置(空间)才能绘制的。

override fun getItemOffsets(outRect: Rect?, view: View?, parent: RecyclerView?, state: RecyclerView.State?) {
    super.getItemOffsets(outRect, view, parent, state)
    //获取itemView在适配器中的位置
    var position: Int? = parent?.getChildAdapterPosition(view)
    //判断item是不是分组中的第一条
    if (mCallBack != null) {
        var info = position?.let { mCallBack?.getGroupInfo(it) }
        var isFirst: Boolean? = info?.isFirstViewInGroup()
        if (isFirst!!) {
            //撑起一个header的高度
            outRect?.top = mHeaderHeight?.toInt()
        } else {//分割线高度
            outRect?.top = mDividerHeight
        }
    }
}


3.onDrawOver()方法:

顾名思义,这个方法是在绘制完成之后执行的。需要注意的是一些位置参数

override fun onDrawOver(c: Canvas?, parent: RecyclerView?, state: RecyclerView.State?) {
    super.onDrawOver(c, parent, state)
    //遍历所有的ItemView
    var childCount = parent?.childCount
    var account = 0
    while (account < childCount!!) {
        //获取View
        var view = parent?.getChildAt(account)
        //获取view在适配器中的位置
        var index = parent?.getChildAdapterPosition(view)
        if (mCallBack != null) {
            var info = index?.let { mCallBack?.getGroupInfo(it) }
            var isFirst: Boolean? = info?.isFirstViewInGroup()
            var left = view?.paddingLeft
            var right = view?.width?.minus(view?.paddingRight)

            if (account != 0) {

                if (isFirst!!) {//组内第一条数据
                    //itemView高度-header高度(向上)
                    var top = mHeaderHeight?.let { view?.top?.minus(it) }
                    var bottom = view?.top
                    drawHeader(c, top, right, bottom, left, info)
                }

            } else {//屏幕第一个可见itemView
                //RecyclerView的顶部位置
                var top = parent?.paddingTop
                if (info?.isLastViewInGroup()!!) {
                    var groupLastTop = mHeaderHeight?.let { view?.bottom?.minus(it) }//组内最后一条的高度(位置)
                    if (groupLastTop!! < top!!) {//组内最后一条的位置小于parent高度的位置(屏幕之外)
                        top = groupLastTop?.toInt()
                    }
                }
                //顶部位置+header高度(向下)
                var bottom = mHeaderHeight?.let { top?.plus(it) }
                drawHeader(c, top?.toFloat(), right, bottom?.toInt(), left, info)
            }
        }
        account++
    }
}

展开阅读全文

没有更多推荐了,返回首页