RecylerView全解析之——基本使用和分割线简析

于 2018-02-23 13:54:20 发布
阅读量325 收藏 1
点赞数
CC 4.0 BY-SA版权
分类专栏： android进阶 文章标签： RecyclerView
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/qq_24675479/article/details/79351574
本文介绍如何为RecyclerView添加分割线，并提供了ListView和GridView样式的分割线通用封装方法。针对RecyclerView不直接支持分割线的问题，通过自定义ItemDecoration实现，同时修复了最右侧和底部分割线显示的bug。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

一、基本使用
1.1引入依赖库

compile ‘com.android.support:recyclerview-v7:25.3.1”

1.2设置适配器Adapter

  /**
     * 设置适配器
     */
    private class RecyclerViewAdapter extends RecyclerView.Adapter<RecyclerViewAdapter.ViewHolder> {

        @Override
        public ViewHolder onCreateViewHolder(ViewGroup parent, int viewType) {
            View itemView = LayoutInflater.from(BaseUserActivity.this).inflate(R.layout.item_home, parent, false);
            ViewHolder viewHolder = new ViewHolder(itemView);
            return viewHolder;
        }

        @Override
        public void onBindViewHolder(ViewHolder holder, int position) {
            holder.tv_num.setText(mDatas.get(position));
        }

        @Override
        public int getItemCount() {
            return mDatas.size();
        }

        class ViewHolder extends RecyclerView.ViewHolder {
            private TextView tv_num;

            public ViewHolder(View itemView) {
                super(itemView);
                tv_num = (TextView) itemView.findViewById(R.id.id_num);
            }
        }

    }

1.3在设置Adapter之前指定显示样式

 // 指定显示的样式 LinearLayoutManager --> listView样式
 // GridLayoutManager  GridView样式
mRecyclerView.setLayoutManager(new LinearLayoutManager(this));

二、RecyclerView并不支持直接添加分割线

  //添加分割线
mRecyclerView.addItemDecoration(new RecylerItemDecoration());

private class RecylerItemDecoration extends RecyclerView.ItemDecoration {
        private Paint mPaint;

        public RecylerItemDecoration() {
            mPaint = new Paint();
            mPaint.setAntiAlias(true);
            mPaint.setColor(Color.RED);
        }

        /**
         * 基本操作就是留出分割线的位置
         */
        @Override
        public void getItemOffsets(Rect outRect, View view, RecyclerView parent, RecyclerView.State state) {
            // 代表在每个底部的位置留出10px来绘制分割线 最后一个位置不需要分割线
            int position = parent.getChildAdapterPosition(view);
            Log.e("TAG", "position --> " + position + "  " + parent.getChildCount());
            // parent.getChildCount() 是不断变化的 现在没办法保证最后一条
            // 保证第一条
            // if(position != parent.getChildCount()-1){
            if (position != 0) {
                outRect.top = 10;
            }
            //}
        }

        /**
         * 绘制分割线
         */
        @Override
        public void onDraw(Canvas c, RecyclerView parent, RecyclerView.State state) {
            int count = parent.getChildCount();
            Rect rect = new Rect();
            rect.left = parent.getPaddingLeft();
            rect.right = parent.getWidth() - parent.getPaddingRight();
            for (int i = 1; i < count; i++) {
                rect.bottom = parent.getChildAt(i).getTop();
                rect.top = rect.bottom - 10;
                // Log.e("TAG", "bottom->" + rect.bottom + "top->" + rect.top);
                c.drawRect(rect, mPaint);
            }
        }

    }

三、ListView样式分割线通用封装

这里写图片描述

public class LinearLayoutItemDecoration extends RecyclerView.ItemDecoration {
    private Drawable mDivider;

    public LinearLayoutItemDecoration(Context context, int drawableResId) {
        mDivider = ContextCompat.getDrawable(context, drawableResId);
    }


    /**
     * 基本操作就是留出分割线的位置
     */
    @Override
    public void getItemOffsets(Rect outRect, View view, RecyclerView parent, RecyclerView.State state) {
        // 代表在每个底部的位置留出10px来绘制分割线 最后一个位置不需要分割线
        int position = parent.getChildAdapterPosition(view);
        Log.e("TAG", "position --> " + position + "  " + parent.getChildCount());
        // parent.getChildCount() 是不断变化的 现在没办法保证最后一条
        // 保证第一条
        // if(position != parent.getChildCount()-1){
        if (position != 0) {
            outRect.top = mDivider.getIntrinsicHeight();
        }
        //}
    }

    /**
     * 绘制分割线
     */
    @Override
    public void onDraw(Canvas c, RecyclerView parent, RecyclerView.State state) {
        int count = parent.getChildCount();
        Rect rect = new Rect();
        rect.left = parent.getPaddingLeft();
        rect.right = parent.getWidth() - parent.getPaddingRight();
        for (int i = 1; i < count; i++) {
            rect.bottom = parent.getChildAt(i).getTop();
            rect.top = rect.bottom - mDivider.getIntrinsicHeight();
            // Log.e("TAG", "bottom->" + rect.bottom + "top->" + rect.top);
            mDivider.setBounds(rect);
            mDivider.draw(c);
        }
    }
}

四、GridView分割样式通用封装


public class GridLayoutItemDecoration extends RecyclerView.ItemDecoration {
    private Drawable mDivider;

    public GridLayoutItemDecoration(Context context, int drawableResId) {
        mDivider = ContextCompat.getDrawable(context, drawableResId);
    }


    /**
     * 基本操作就是留出分割线的位置
     */
    @Override
    public void getItemOffsets(Rect outRect, View view, RecyclerView parent, RecyclerView.State state) {
        outRect.bottom = mDivider.getIntrinsicHeight();
        outRect.right = mDivider.getIntrinsicWidth();
    }

    /**
     * 绘制分割线
     */
    @Override
    public void onDraw(Canvas c, RecyclerView parent, RecyclerView.State state) {
        drawHorizontal(c, parent);
        drawVertical(c, parent);
    }

    /**
     * 绘制垂直分割线
     */
    private void drawVertical(Canvas canvas, RecyclerView parent) {
        int childCount = parent.getChildCount();
        for (int i = 0; i < childCount; i++) {
            View childView = parent.getChildAt(i);
            RecyclerView.LayoutParams params = (RecyclerView.LayoutParams) childView.getLayoutParams();
            int left = childView.getRight()+params.leftMargin;
            int right = left+ mDivider.getIntrinsicWidth();
            int top = childView.getTop()-params.bottomMargin;
            int bottom = childView.getBottom()+params.bottomMargin;
            //计算分割线的位置
            mDivider.setBounds(left, top, right, bottom);
            mDivider.draw(canvas);
        }
    }

    /**
     * 绘制水平线
     */
    private void drawHorizontal(Canvas canvas, RecyclerView parent) {
        int childCount = parent.getChildCount();
        for (int i = 0; i < childCount; i++) {
            View childView = parent.getChildAt(i);
            RecyclerView.LayoutParams params = (RecyclerView.LayoutParams) childView.getLayoutParams();
            int left = childView.getLeft()-params.leftMargin;
            int right = childView.getRight()+ mDivider.getIntrinsicWidth()+params.rightMargin;
            int top = childView.getBottom()+params.bottomMargin;
            int bottom = top + mDivider.getIntrinsicHeight();
            mDivider.setBounds(left, top, right, bottom);
            mDivider.draw(canvas);
        }
    }
}

这里写图片描述

如果有两个bug,一个最右边应该不显示，和最底端的底部
解决方法

public class GridLayoutItemDecoration extends RecyclerView.ItemDecoration {
    private Drawable mDivider;

    public GridLayoutItemDecoration(Context context, int drawableResId) {
        mDivider = ContextCompat.getDrawable(context, drawableResId);
    }


    /**
     * 基本操作就是留出分割线的位置
     */
    @Override
    public void getItemOffsets(Rect outRect, View view, RecyclerView parent, RecyclerView.State state) {
        //outRect.bottom = mDivider.getIntrinsicHeight();
        //outRect.right = mDivider.getIntrinsicWidth();

        //留出分割线的位置  下边和右边 如果最底边那么不要留，最右边也不要留
        int bottom = mDivider.getIntrinsicHeight();
        int right = mDivider.getIntrinsicWidth();
        if (isLastCloumn(view, parent)) {//最后一列
            right = 0;
        }
        if (isLastRow(view, parent)) {
            bottom = 0;
        }
        outRect.right = right;
        outRect.bottom = bottom;
    }

    /**
     * 绘制分割线
     */
    @Override
    public void onDraw(Canvas c, RecyclerView parent, RecyclerView.State state) {
        drawHorizontal(c, parent);
        drawVertical(c, parent);
    }

    /**
     * 绘制垂直分割线
     */
    private void drawVertical(Canvas canvas, RecyclerView parent) {
        int childCount = parent.getChildCount();
        for (int i = 0; i < childCount; i++) {
            View childView = parent.getChildAt(i);
            RecyclerView.LayoutParams params = (RecyclerView.LayoutParams) childView.getLayoutParams();
            int left = childView.getRight() + params.leftMargin;
            int right = left + mDivider.getIntrinsicWidth();
            int top = childView.getTop() - params.bottomMargin;
            int bottom = childView.getBottom() + params.bottomMargin;
            //计算分割线的位置
            mDivider.setBounds(left, top, right, bottom);
            mDivider.draw(canvas);
        }
    }

    /**
     * 绘制水平线
     */
    private void drawHorizontal(Canvas canvas, RecyclerView parent) {
        int childCount = parent.getChildCount();
        for (int i = 0; i < childCount; i++) {
            View childView = parent.getChildAt(i);
            RecyclerView.LayoutParams params = (RecyclerView.LayoutParams) childView.getLayoutParams();
            int left = childView.getLeft() - params.leftMargin;
            int right = childView.getRight() + mDivider.getIntrinsicWidth() + params.rightMargin;
            int top = childView.getBottom() + params.bottomMargin;
            int bottom = top + mDivider.getIntrinsicHeight();
            mDivider.setBounds(left, top, right, bottom);
            mDivider.draw(canvas);
        }
    }

    /**
     * 获取当前列数
     */
    private int getSpanCount(RecyclerView parent) {
        RecyclerView.LayoutManager layoutManager = parent.getLayoutManager();
        if (layoutManager instanceof GridLayoutManager) {
            GridLayoutManager gridLayoutManager = (GridLayoutManager) layoutManager;
            int spanCount = gridLayoutManager.getSpanCount();
            return spanCount;
        }
        return 1;
    }

    /**
     * 是否是最后一列
     */
    public boolean isLastCloumn(View view, RecyclerView parent) {//当前的位置%列数==0
        //当前的位置，看源码
        int currentPosition = ((RecyclerView.LayoutParams) view.getLayoutParams()).getViewLayoutPosition();
        //获取当前列数
        int spanCount = getSpanCount(parent);

        return (currentPosition + 1) % spanCount == 0;
    }

    /**
     * 是否是最后一行
     *
     * @param view
     * @param parent
     */
    public boolean isLastRow(View view, RecyclerView parent) {
        //获取当前位置
        int currentPosition = ((RecyclerView.LayoutParams) view.getLayoutParams()).getViewLayoutPosition();
        //获取当前列数
        int spanCount = getSpanCount(parent);//4
        //获取行数=总的条目数/列数
        int rowNumber = parent.getAdapter().getItemCount() / spanCount==0?
                parent.getAdapter().getItemCount() / spanCount:(parent.getAdapter().getItemCount() / spanCount+1);

        return (currentPosition+1)>(rowNumber-1)*spanCount;
    }
}

效果图
这里写图片描述

评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值