安卓分段进度条

最近有个朋友遇到了一个棘手的东西,就是要自定义一个进度条需求如下图

由上图我们可以大致了解到难点主要是在中间部分的进度条 上下文字部分我们完全可以用权重来做,所以我们只要把zhon中间部分的进度条搞出来就完事,废话不多说我们上代码

第一步:准备各段占的比例及颜色值及圆半径边线半径进度条高度等

private int radius = DpUtil.dip2px(getContext(), 5);//这里这个圆直径一定要比进度高度要
private int progressHigher = DpUtil.dip2px(getContext(), 5);
private int strokeWidth = radius / 2;//边线宽度
static {
    BG_COLORS = Color.parseColor("#eeeeee");//背景颜色值
    DEF_COLORS = new int[]{//进度条颜色值
            Color.parseColor("#ff0000"),
            Color.parseColor("#00ff00"),
            Color.parseColor("#0000ff")
    };
    DEF_WEIGHTS = new float[]{//进度条颜色值 显示占比
            1, 1, 1
    };

}

 

第二步:计算进度对应的进度条长度

public float getWidthForWeight(float weight, float totalWeight) {
    return (getWidth() - (2 * (radius + strokeWidth))) * (weight / totalWeight) + 0.5f;
}

第三步:绘制控件

    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        if (progressRects == null) {
            return;
        }
        if (maxProgress <= 0) {
            maxProgress = getWidth() - 2 * (strokeWidth + radius);
        }

        for (int i = 0; i < circularBgRects.length; i++) {
            circularBgRects[i] = new RectF();
            if (i == 0) {
                circularBgRects[i].set(strokeWidth, strokeWidth, strokeWidth + 2 * radius, strokeWidth + 2 * radius);
            } else {
                circularBgRects[i].set((int) getWidthForWeight((maxProgress / (circularBgRects.length - 1)) * i, maxProgress) + strokeWidth, strokeWidth, strokeWidth + 2 * radius + (int) getWidthForWeight((maxProgress / (circularBgRects.length - 1)) * i, maxProgress), strokeWidth + 2 * radius);
            }

        }


        //绘制背景颜色块
        backgroundRect.set((strokeWidth + radius), (strokeWidth + radius) - (progressHigher / 2), (int) getWidthForWeight(maxProgress, maxProgress) + (strokeWidth + radius), (strokeWidth + radius) + (progressHigher / 2));
        canvas.drawRoundRect(backgroundRect, progressHigher / 2, progressHigher / 2, backgroundPaint);//绘制矩形
        // 绘制进度条
        int progressX = (int) getWidthForWeight(progress, maxProgress) + (strokeWidth + radius);
        RectF rect = new RectF();

//        获取应当显示的颜色
        for (int i = 0; i < colors.length; i++) {
            if ((maxProgress / colors.length) * i <= progress) {
                progressPaint.setColor(colors[i]);
                circularSelectionPaint.setColor(colors[i]);
            } else {
                break;
            }
        }
        rect.set((strokeWidth + radius), (strokeWidth + radius) - (progressHigher / 2), progressX, (strokeWidth + radius) + (progressHigher / 2));
        canvas.drawRoundRect(rect, progressHigher / 2, progressHigher / 2, progressPaint);


//        先画一圈白底
        for (int i = 0; i < circularBgRects.length; i++) {
            canvas.drawArc(circularBgRects[i], 0, 360, true, circularBgPaint);
        }

        for (int i = 0; i < circularBgRects.length; i++) {
            if (progress >= i * (maxProgress / (circularBgRects.length - 1))) {
                canvas.drawArc(circularBgRects[i], 0, 360, true, circularSelectionPaint);
            } else {
                canvas.drawArc(circularBgRects[i], 0, 360, true, circularNoSelectionPaint);
            }

        }

    }

 

源码:https://download.csdn.net/download/qq_17853651/10812656

 

 

 

  • 1
    点赞
  • 7
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值