美文网首页
自定义ItemDecoration实现线性列表的分割线

自定义ItemDecoration实现线性列表的分割线

作者: CHN_Liao | 来源:发表于2020-11-03 14:26 被阅读0次

    此自定义ItemDecoration采用Builder模式,可根据需求设置上下左右分割线的是否显示、颜色、和分割线的高度。

    /**
     * @ClassName: LinearItemDecoration
     * @Description: 线性Recyclerview分割线
     * @Author: CHN_Liao
     * @CreateDate: 2020-11-02 16:59
     */
    public class LinearItemDecoration extends RecyclerView.ItemDecoration {
        private Context mContext;
    
        //顶部是否增加分割线
        private boolean isDividerTop = false;
        //左边是否增加分割线
        private boolean isDividerLeft = false;
        //右边是否增加分割线
        private boolean isDividerRight = false;
        //底部是否增加分割线,默认为true
        private boolean isDividerBottom = true;
    
        //顶部分割线颜色;
        private int dividerTopColor;
        //左边分割线颜色;
        private int dividerLeftColor;
        //右边分割线颜色;
        private int dividerRightColor;
        //底部分割线颜色;
        private int dividerBottomColor;
    
        //分割线画笔
        private Paint dividerPaint;
        //分割线高度
        private int dividerHeight = 4;
    
        public LinearItemDecoration(Context context) {
            mContext = context;
            dividerPaint = new Paint();
    
            //默认分割线颜色
            dividerTopColor = dividerLeftColor = dividerRightColor = dividerBottomColor = Color.GRAY;
        }
    
        @Override
        public void getItemOffsets(@NonNull Rect outRect, @NonNull View view, @NonNull RecyclerView parent, @NonNull RecyclerView.State state) {
            super.getItemOffsets(outRect, view, parent, state);
            outRect.bottom = isDividerBottom ? dividerHeight : 0;
            outRect.left = isDividerLeft ? dividerHeight : 0;
            outRect.right = isDividerRight ? dividerHeight : 0;
            outRect.top = isDividerTop ? dividerHeight : 0;
        }
    
        @Override
        public void onDraw(@NonNull Canvas canvas, @NonNull RecyclerView parent, @NonNull RecyclerView.State state) {
            super.onDraw(canvas, parent, state);
            int childCount = parent.getChildCount();
            //绘制头部分割线颜色
            drawTop(canvas, parent, childCount);
            //绘制左边分割线颜色
            drawLeft(canvas, parent, childCount);
            //绘制右边分割线颜色
            drawRight(canvas, parent, childCount);
            //绘制底部分割线颜色
            drawBottom(canvas, parent, childCount);
        }
    
        private void drawTop(@NonNull Canvas canvas, @NonNull RecyclerView parent, int childCount) {
            if (!isDividerTop) return;
            int left = parent.getPaddingLeft();
            int right = parent.getWidth() - parent.getPaddingRight();
    
            for (int i = 0; i < childCount; i++) {
                View view = parent.getChildAt(i);
                float top = view.getTop() - dividerHeight;
                float bottom = view.getTop();
                dividerPaint.setColor(dividerTopColor);
                canvas.drawRect(left, top, right, bottom, dividerPaint);
            }
    
        }
    
        private void drawLeft(@NonNull Canvas canvas, @NonNull RecyclerView parent, int childCount) {
            if (!isDividerLeft) return;
    
            int left = parent.getPaddingLeft();
            int right = parent.getPaddingLeft() + dividerHeight;
    
            dividerPaint.setColor(dividerLeftColor);
    
            for (int i = 0; i < childCount; i++) {
                View view = parent.getChildAt(i);
                float top = view.getTop();
                float bottom = view.getBottom();
                canvas.drawRect(left, top, right, bottom, dividerPaint);
            }
    
        }
    
        private void drawRight(@NonNull Canvas canvas, @NonNull RecyclerView parent, int childCount) {
            if (!isDividerRight) return;
    
            int left = parent.getRight() - parent.getPaddingRight() - dividerHeight;
            int right = parent.getRight() - parent.getPaddingRight();
    
            dividerPaint.setColor(dividerRightColor);
    
            for (int i = 0; i < childCount; i++) {
                View view = parent.getChildAt(i);
                float top = view.getTop();
                float bottom = view.getBottom();
                canvas.drawRect(left, top, right, bottom, dividerPaint);
            }
        }
    
        private void drawBottom(@NonNull Canvas canvas, @NonNull RecyclerView parent, int childCount) {
            if (!isDividerBottom) return;
    
            int left = parent.getPaddingLeft();
            int right = parent.getWidth() - parent.getPaddingRight();
    
            dividerPaint.setColor(dividerBottomColor);
    
            for (int i = 0; i < childCount - 1; i++) {
                View view = parent.getChildAt(i);
                float top = view.getBottom();
                float bottom = view.getBottom() + dividerHeight;
                canvas.drawRect(left, top, right, bottom, dividerPaint);
            }
        }
    
        public static class Builder {
            private Context context;
            private LinearItemDecoration itemDecoration;
    
            public Builder(Context context) {
                this.context = context;
                itemDecoration = new LinearItemDecoration(context);
            }
    
            //设置是否显示各个分割线,默认显示底部分割线
            public Builder showDividers(boolean top, boolean left, boolean right, boolean bottom) {
                itemDecoration.isDividerTop = top;
                itemDecoration.isDividerLeft = left;
                itemDecoration.isDividerRight = right;
                itemDecoration.isDividerBottom = bottom;
                return this;
            }
    
            //分割线高度(dp)
            public Builder dividerHeight(int dividerHeight) {
                itemDecoration.dividerHeight = dp2px(dividerHeight);
                return this;
            }
    
            private int dp2px(float dpValue) {
                final float scale = context.getResources().getDisplayMetrics().density;
                return (int) (dpValue * scale + 0.5f);
            }
    
            //统一分割线颜色
            public Builder dividerColor(@ColorRes int color) {
                int c = context.getResources().getColor(color);
                itemDecoration.dividerTopColor = c;
                itemDecoration.dividerLeftColor = c;
                itemDecoration.dividerRightColor = c;
                itemDecoration.dividerBottomColor = c;
    
                return this;
            }
    
            //设置各个分割线颜色
            public Builder dividerColors(@ColorRes int topColor,@ColorRes int leftColor,@ColorRes int rightColor,@ColorRes int bottomColor) {
                itemDecoration.dividerTopColor = context.getResources().getColor(topColor);
                itemDecoration.dividerLeftColor = context.getResources().getColor(leftColor);
                itemDecoration.dividerRightColor = context.getResources().getColor(rightColor);
                itemDecoration.dividerBottomColor = context.getResources().getColor(bottomColor);
    
                return this;
            }
    
            public LinearItemDecoration build() {
                return itemDecoration;
            }
        }
    }
    

    快速实现及效果如下:

    LinearItemDecoration itemDecoration = new LinearItemDecoration.Builder(this).build();
    
    recyclerView.addItemDecoration(itemDecoration);
    
    效果0.png

    其他配置代码实现及效果如下:

    LinearItemDecoration itemDecoration = new LinearItemDecoration.Builder(this)
    //                .dividerColor(R.color.green)//统一分割线颜色
                    .dividerColors(R.color.green,R.color.blue,R.color.colorAccent,R.color.colorPrimaryDark)//设置各个分割线的颜色
                    .showDividers(true,true,true,true)//设置各个分割线是否显示,默认只显示底部分割线
                    .dividerHeight(4)//设置分割线高度(单位:dp)
                    .build();
    
    recyclerView.addItemDecoration(itemDecoration);
    
    效果1.png

    相关文章

      网友评论

          本文标题:自定义ItemDecoration实现线性列表的分割线

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