android自定义View-欢迎页倒计时ProgressBar(配合RxJava2)

平常是使用其他app的时候发现欢迎页右上角或者其他部位会有一个倒计时的ProgressBar, 最近有空就自己实现了下。

大体上分为三个步骤， 首先是自定义属性，然后onDraw中绘制view，最后在使用的时候配合RxJava2实现progress刷新。

贴上代码实现：

1 attrs文件中：

 <declare-styleable name="CustomProgressBar">
        <attr name="maxProress" format="integer"/>
        <attr name="currentProgress" format="integer"/>
        <attr name="circleWidth" format="dimension"/>
        <attr name="backgroundWidth" format="dimension"/>
        <attr name="circleColor" format="color"/>
        <attr name="backgroundColor" format="color"/>
        <attr name="textColor" format="color"/>
        <attr name="textSize" format="dimension"/>
    </declare-styleable>

2 CustomProgressBar.java

public class CustomProgressBar extends View {
    private String content = "跳过";
    private int mMaxProgress = 100;
    private int mCircleWidth = 3;
    private int mTextSize = 45;
    private int mBackgroundWidth = 100;
    private int mCircleColor = 0xff0000;
    private int mTextColor = 0xf0ffff;
    private int mCurrentProgress = 0;
    private int mStartAngel = 0;
    private int mBackgroundColor = 0xcfcfcf;
    private RectF rectF;
    private Paint mBgPaint;
    private Paint mProgressPaint;
    private Paint mTextPaint;

    private int swipeAngel = 0;
    private Rect mTextRect;
    private float mTextY;

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

    public CustomProgressBar(Context context, @Nullable AttributeSet attrs) {
        this(context, attrs, 0);
    }

    public CustomProgressBar(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        initAttrs(context, attrs, defStyleAttr);
    }

    private void initAttrs(Context context, AttributeSet attrs, int defStyleAttr) {
        TypedArray typedArray = context.obtainStyledAttributes(attrs, R.styleable.CustomProgressBar, defStyleAttr, 0);
        int indexCount = typedArray.getIndexCount();
        for (int i = 0; i < indexCount; i++) {
            int attr = typedArray.getIndex(i);
            switch (attr) {
                case R.styleable.CustomProgressBar_maxProress:
                    mMaxProgress = typedArray.getInt(attr, 100);
                    break;
                case R.styleable.CustomProgressBar_circleColor:
                    mCircleColor = typedArray.getColor(attr, 0xff0000);
                    break;
                case R.styleable.CustomProgressBar_textColor:
                    mTextColor = typedArray.getColor(attr, 0xff0000);
                    break;
                case R.styleable.CustomProgressBar_circleWidth:
                    mCircleWidth = typedArray.getDimensionPixelSize(attr, 3);
                    break;
                case R.styleable.CustomProgressBar_backgroundWidth:
                    mBackgroundWidth = typedArray.getDimensionPixelSize(attr, 10);
                    break;
                case R.styleable.CustomProgressBar_currentProgress:
                    mCurrentProgress = typedArray.getInt(attr, 0);
                    break;
                case R.styleable.CustomProgressBar_backgroundColor:
                    mBackgroundColor = typedArray.getColor(attr, 0xcfcfcf);
                    break;
                case R.styleable.CustomProgressBar_textSize:
                    mTextSize = typedArray.getDimensionPixelSize(attr, 45);
                    break;
            }
        }
        typedArray.recycle();
        mBgPaint = new Paint();
        mBgPaint.setColor(mBackgroundColor);
        mBgPaint.setStyle(Paint.Style.FILL);
        mBgPaint.setAntiAlias(true);
        mBgPaint.setStrokeWidth(mBackgroundWidth / 2);

        mProgressPaint = new Paint();
        mProgressPaint.setColor(mCircleColor);
        mProgressPaint.setStyle(Paint.Style.STROKE);
        mProgressPaint.setAntiAlias(true);
        mProgressPaint.setStrokeWidth(mCircleWidth);

        mTextPaint = new Paint();
        mTextPaint.setColor(mTextColor);
        mTextPaint.setTextSize(mTextSize);
        mTextPaint.setTypeface(Typeface.DEFAULT);
        mTextPaint.setTextAlign(Paint.Align.LEFT);
        mTextRect = new Rect();
        mTextPaint.getTextBounds(content, 0, content.length(), mTextRect);

        mTextY = mTextPaint.descent() - mTextPaint.ascent();

        rectF = new RectF(5, 5, mBackgroundWidth - 5, mBackgroundWidth - 5);
        mStartAngel = mCurrentProgress * 360 / 100 - 90;

    }

//    @Override
//    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
//        setMeasuredDimension(mBackgroundWidth, mBackgroundWidth);
//    }

    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        float baseLine = getMeasuredHeight() / 2 + mTextPaint.getTextSize() / 2 - mTextPaint.getFontMetrics().descent;
        //画背景
        canvas.drawCircle(getWidth() / 2, getHeight() / 2, mBackgroundWidth / 2, mBgPaint);
        //画进度
        canvas.drawArc(rectF, mStartAngel, swipeAngel, false, mProgressPaint);

        canvas.drawText(content, getWidth() / 2 - mTextRect.width() / 2, baseLine, mTextPaint);
    }

    @Override
    public boolean onTouchEvent(MotionEvent event) {
        switch (event.getAction()) {
            case MotionEvent.ACTION_UP:
                if (listener != null) listener.onClick();
                return true;
        }
        return super.onTouchEvent(event);
    }

    public void setProgress(int progress) {
        if (progress > 100) progress = 100;
        if (progress < 0) progress = 0;
        swipeAngel = progress * 360 / mMaxProgress;
        invalidate();
    }

    public void start() {
        mCurrentProgress--;
        if (mCurrentProgress < 0) mCurrentProgress = 0;
        swipeAngel = mCurrentProgress * 360 / mMaxProgress;
        invalidate();
    }

    public interface OnClickListener {
        void onClick();
    }

    public void setOnClickListener(OnClickListener listener) {
        this.listener = listener;
    }

    public OnClickListener listener;

}

3 代码中使用:

 Observable.interval(400,30, TimeUnit.MILLISECONDS)
                .take(100)
                .observeOn(AndroidSchedulers.mainThread())
                .subscribe(new Observer<Long>() {
                    @Override
                    public void onSubscribe(Disposable d) {
                    }

                    @Override
                    public void onNext(Long aLong) {
                        mProgressBar.start();
                    }

                    @Override
                    public void onError(Throwable e) {

                    }

                    @Override
                    public void onComplete() {
                        setupWindowAnimations();
                        judgeTurn();
                    }
                });

整体上感觉不难，是个简单的自定义view。 具体代码请查看我的github项目，还有更多精彩内容：

https://github.com/MrDeclanCoder/KotlinMVPRxJava2Dagger2GreenDaoRetrofitDemo

欢迎star！！欢迎fork！！