打造简约时尚的Android进度条，分阶段呈现圆点下标进度，兼具美观与实用性

2023-09-03 20:26:25

Android进度条的新思路：圆点和下标进度条

在Android应用中，进度条是一个重要的UI元素，它可以直观地向用户展示任务的完成进度。传统的进度条通常采用条形或圆形设计，但如果您想让进度条更加时尚、更有吸引力，不妨尝试使用圆点和下标的进度条。这种进度条不仅美观大方，还能更直观地显示进度信息。

打造圆点和下标进度条的步骤

创建自定义View

首先，我们需要创建一个自定义View来实现圆点和下标进度条。在这个自定义View中，我们将定义进度条的外观和行为。

绘制圆点和下标

在自定义View中，我们需要重写onDraw()方法来绘制圆点和下标。在onDraw()方法中，我们可以使用Canvas对象来绘制圆点和下标。

添加动画效果

为了让进度条更加生动，我们可以为圆点和下标添加动画效果。我们可以使用ValueAnimator或ObjectAnimator来实现动画效果。

设置进度

最后，我们需要设置进度条的进度。我们可以通过调用setProgress()方法来设置进度。

示例代码

public class DottedProgressBar extends View {

    private int progress;
    private Paint paint;

    public DottedProgressBar(Context context) {
        super(context);

        paint = new Paint();
        paint.setColor(Color.BLUE);
        paint.setStyle(Paint.Style.FILL);
    }

    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);

        float dotRadius = 10;
        float dotSpacing = 20;

        float width = getWidth();
        float height = getHeight();

        float startX = (width - (progress * dotSpacing)) / 2;
        float startY = height / 2;

        for (int i = 0; i < progress; i++) {
            canvas.drawCircle(startX + (i * dotSpacing), startY, dotRadius, paint);
        }

        paint.setColor(Color.WHITE);
        paint.setTextSize(20);

        canvas.drawText(String.valueOf(progress), startX + (progress * dotSpacing), startY + (dotRadius / 2), paint);
    }

    public void setProgress(int progress) {
        this.progress = progress;
        invalidate();
    }
}