美文网首页
RecyclerView间距设置问题

RecyclerView间距设置问题

作者: tyrannos | 来源:发表于2016-11-02 18:24 被阅读2749次

    最终的效果如下:

    最终效果图

    上图是我需求的一个页面,作为学习就直接贴出来了。

    为了更好的使用网格布局,所以决定使用RecyclerView来开发这需求。

    首先:

    为了更好地说明问题,连续发几张截图,并顺截图说明:

    1:代码设置全局截图

    NO1

    因为要设计成网格样式,所以使用GridLayoutManager,这里我只是空实现,为了以后扩展使用,别没有什么逻辑代码。这个GridLayoutManager我设置成了3列。在98行代码处理。

    2:适配器代码,红框部分值得看的地方。

    值得注意的代码

    3:上图红框部分26,27行代码说明

    目的是我这个页面有两种类型的item,所以定义两个常量来区分。请看下图可知。

    两种类型的item标记

    4:代码流程机器跑一下。

    跑起来之后是这个效果。

    初次运行截图

    5:解决

    重点是需要画分割线,继续上图。

    也许看上去很乱,我会一点一点解释。重点是getItemOffsets方法,用来给item设置内部偏移量。所以接下重点就是getItemOffsets方法。

    分割线类代码预览

    6:添加分割线。

    此时添加上图所写的分割线对象。

    添加分割线对象

    7:跑起来


    最终的效果。

    ==================================解释====================================

    接下来还没结束,这里最大的迷惑就是getItemOffsets方法中的操作,所以接着上图

    1:效果图对比

    没有设置分割线和设置分割线之后的效果,一目了然。

    效果图对比

    2:应该做的


    应该做的

    3:设置属性

    设置属性

    4:最初的效果图

    可以看到3个item的属性值是这样的,我们需要做的就是把蓝色框的宽度平均成4个等间距。

    最初的效果图

    5:处理之后的效果图

    我们需要用getItemOffsets方法处理成这个样子。如下图蓝色框是等间距,宽度是30.

    处理之后的效果图

    6:最终计算设置操作

    需要处理第一列,中间列,和最后一列,这里需要做区分,就是头,中间,尾。

    形参:outRect.set就是设置item所在列中的偏移值。

    最终计算设置操作

    7:最后一图

    最后一图说明了计算过程。

    计算过程

    ============================================================

    以上是我对RecyclerView画分割线的认识,有写的不对的地方,望给予指教,不胜感激!!!

    相关文章

      网友评论

          本文标题:RecyclerView间距设置问题

          本文链接:https://www.haomeiwen.com/subject/zrgvuttx.html