527_画出曲线彩色进度条

来源:互联网 发布:知乎社区 编辑:程序博客网 时间:2024/06/07 02:19






画出曲线彩色进度条








public class ProgressView extends View {


    private int width;
    private int height;
    private Paint redPaint;
    private int stokeWidth;
    private int halfStroke;
    private LinearGradient shader;
    private int radius;
    private Paint whitePaint;
    private int nowAngle = 150;
    private int target = 0;


    public ProgressView(Context context) {
        this(context, null);
    }


    public ProgressView(Context context, AttributeSet attrs) {
        this(context, attrs, 0);
    }


    public ProgressView(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        initView();
    }


    private void initView() {


        width = dp250;
        height = dp250;
        stokeWidth = 60;
        halfStroke = stokeWidth / 2;
        radius = width / 2;


        shader = new LinearGradient(0, 0, width, 0,
                ColorUtil.getColor(R.color.c_fc644b),
                ColorUtil.getColor(R.color.c_fb7d33),
                Shader.TileMode.CLAMP);


        redPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
        redPaint.setStyle(Paint.Style.STROKE);
        redPaint.setStrokeWidth(stokeWidth);
        redPaint.setStrokeCap(Paint.Cap.ROUND);
        redPaint.setShader(shader);


        whitePaint = new Paint(Paint.ANTI_ALIAS_FLAG);
        whitePaint.setStyle(Paint.Style.STROKE);
        whitePaint.setStrokeWidth(6);
        whitePaint.setColor(Color.WHITE);
        whitePaint.setStrokeCap(Paint.Cap.ROUND);


    }


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


        RectF rectF = new RectF(0 + halfStroke, 0 + halfStroke, width - halfStroke, width - halfStroke);


        //白色圆弧
        whitePaint.setStrokeWidth(stokeWidth);
        canvas.drawArc(rectF, 150, 240, false, whitePaint);


        //画出圆弧
        if (nowAngle != 150) {
            canvas.drawArc(rectF, 150, nowAngle - 150, false, redPaint);
        }


        //算出圆心点,画出白色小圆
        int angle = 420 - nowAngle;
        float x = getXCoordinate(angle, radius - halfStroke);
        float y = getYCoordinate(angle, radius - halfStroke);
        whitePaint.setStrokeWidth(6);
        canvas.drawCircle(x, y, 15, whitePaint);
    }


    private float getXCoordinate(int angle, double r) {
        angle = angle + 30;
        double sin = Math.sin(Math.PI * angle / 180);
        float x = (float) (sin * r + radius);
        return x;
    }


    private float getYCoordinate(int angle, double r) {
        angle = angle + 30;
        double cos = -Math.cos(Math.PI * angle / 180);
        float y = (float) (radius - cos * r);
        return y;
    }


    /**
     * 调用动画
     *
     * @param targetProgress
     */
    public void start(double targetProgress) {
        if (targetProgress < 0) {
            targetProgress = 0;
        }
        if (targetProgress > 1) {
            targetProgress = 1;
        }


        int target = (int) ((targetProgress * 240d) + 150);
        this.target = target;


        nowAngle = 150;
        animHandler.removeCallbacksAndMessages(null);
        animHandler.sendEmptyMessage(0);
    }


    private Handler animHandler = new Handler() {
        @Override
        public void handleMessage(Message msg) {
            super.handleMessage(msg);
            invalidate();
            if (nowAngle >= target) {
                this.removeCallbacksAndMessages(null);
            } else {
                nowAngle = nowAngle + 3;
                this.sendEmptyMessageDelayed(0, 6);
            }
        }
    };
}











原创粉丝点击