RecyclerView 设置item之间的间距

作者: 唠嗑008 | 来源:发表于2017-07-21 10:44 被阅读7290次

    RecyclerView没有可以直接设置间距的属性,但看了源码之后可以发现RecyclerView有个内部类ItemDecoration,可以用ItemDecoration来装饰一个item,所以继承重写ItemDecoration就可以实现间距了。我看了以下,网上很多类似的介绍,但是大多都只考虑到LinearLayoutManager这种

    这是LinearLayoutManager设置Item间距的的一个辅助类

    public class SpacesItemDecoration extends RecyclerView.ItemDecoration {
        private int space;
    
        public SpacesItemDecoration(int space) {
            this.space = space;
        }
    
        @Override
        public void getItemOffsets(Rect outRect, View view,
                                   RecyclerView parent, RecyclerView.State state) {
            outRect.left = space;
            outRect.right = space;
            outRect.bottom = space;
    
            // Add top margin only for the first item to avoid double space between items
            if (parent.getChildPosition(view) == 0)
                outRect.top = space;
        }
    }
    

    设置item间距

    int space = 8;
    mRecyclerView.addItemDecoration(new SpacesItemDecoration(spacingInPixels));
    

    但是我的项目是网格布局啊,GridLayoutManager,上面这种办法也不行啊,先看看效果,再讲讲我的办法

    RecyclerView设置Item的间距.jpg

    我的间距只有10dp,看上去不是特别明显,但是效果是有的,是吧

    这里是GridLayoutManager或者StaggeredGridLayoutManager 设置Item间距的办法

    /**
     * GridLayoutManager(网格布局)设置item的间隔
     * 
     * 作者: 周旭 on 2017年7月20日 0020.
     * 邮箱:374952705@qq.com
     * 博客:http://www.jianshu.com/u/56db5d78044d
     */
    
    public class GridSpacingItemDecoration extends RecyclerView.ItemDecoration {
    
       private int spanCount; //列数
       private int spacing; //间隔
       private boolean includeEdge; //是否包含边缘
    
        public GridSpacingItemDecoration(int spanCount, int spacing, boolean includeEdge) {
            this.spanCount = spanCount;
            this.spacing = spacing;
            this.includeEdge = includeEdge;
        }
    
        @Override
        public void getItemOffsets(Rect outRect, View view, RecyclerView parent, RecyclerView.State state) {
           
           //这里是关键,需要根据你有几列来判断
            int position = parent.getChildAdapterPosition(view); // item position
            int column = position % spanCount; // item column
    
            if (includeEdge) {
                outRect.left = spacing - column * spacing / spanCount; // spacing - column * ((1f / spanCount) * spacing)
                outRect.right = (column + 1) * spacing / spanCount; // (column + 1) * ((1f / spanCount) * spacing)
    
                if (position < spanCount) { // top edge
                    outRect.top = spacing;
                }
                outRect.bottom = spacing; // item bottom
            } else {
                outRect.left = column * spacing / spanCount; // column * ((1f / spanCount) * spacing)
                outRect.right = spacing - (column + 1) * spacing / spanCount; // spacing - (column + 1) * ((1f /    spanCount) * spacing)
                if (position >= spanCount) {
                    outRect.top = spacing; // item top
                }
            }
        }
    }
    

    调用的地方

            int spanCount = 3; // 3 columns
            int spacing = 50; // 50px
            boolean includeEdge = false;
            mRecyclerView.addItemDecoration(new GridSpacingItemDecoration(spanCount, spacing, includeEdge));
    

    如果你了别人的RecycleView 上拉加载下拉刷新,addItemDecoration 这个方法 不一定会给你加上,你可以在源码上自行添加。

    public void addItemDecoration(RecyclerView.ItemDecoration decor) {
        mRecyclerView.addItemDecoration(decor,-1);
    }
    

    其实还有一种比较巧妙的办法,就是在item的布局里面搞事情


    举个例子.jpg 111.png

    图画的有点丑,用代码来说话

    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:tools="http://schemas.android.com/tools"
        android:layout_width="185dp"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        android:background="@color/transparent"
        android:padding="10dp">
    
        <RelativeLayout
            android:layout_width="165dp"
            android:layout_height="280dp"
            android:background="@color/white"
            android:orientation="vertical">
      </RelativeLayout>
    </LinearLayout>
    

    里面这个RelativeLayout就是你的item正常的布局,而LinearLayout 这个根部局我设置了他的背景色为透明的,再加一个padding就行了,这个padding就是设置item的间距,这样设置item的间距了。

    所以说RecyclerView的Item的间距都可以通过item里面设置padding,margin来解决,这种办法相对巧妙。

    相关文章

      网友评论

      • starsone:可以!感谢
      • PreacherPDieE:间距只能以PX为单位不能用DP吗?
        eeb6e71eb700:自己转换一下就好了

        /**
        * 根据手机的分辨率从从dp转成为px(像素)
        * @param context 全局context
        * @param dpValue dp值
        * @return px像素值
        */
        public static int dip2px(Context context, float dpValue) {
        final float scale = context.getResources().getDisplayMetrics().density;
        return (int) (dpValue * scale + 0.5f);
        }

        /**
        * 根据手机的分辨率从 px(像素) 的单位 转成为 dp
        * @param context 全局context
        * @param pxValue px像素值
        * @return dp值
        */
        public static int px2dip(Context context, float pxValue) {
        final float scale = context.getResources().getDisplayMetrics().density;
        return (int) (pxValue / scale + 0.5f);
        }

      本文标题:RecyclerView 设置item之间的间距

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