目的

创建一个class实现WaveLoadingView进度条动画

相关技术、及其使用

1、创建一个类实现CircleView继承于View
并实现相应的方法实现
自定义属性：lineSize，LineColor，textColor，textSize，创建init方法定义文字和圆的画笔

 public CircleView(Context context) {
        super(context);
        inti();
    }

    public CircleView(Context context, @Nullable AttributeSet attrs) {
        super(context, attrs);
        inti();
    }
    public void inti(){
        cirlePaint = new Paint(Paint.ANTI_ALIAS_FLAG);
        cirlePaint.setColor(lineColor);
        cirlePaint.setStyle(Paint.Style.STROKE);
        cirlePaint.setStrokeWidth(lineSize);

        textPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
        textPaint.setColor(textColor);
        textPaint.setTextSize(textSize);
    }

2、画圆
调用OnDraw方法：

  protected void onDraw(Canvas canvas) {
        //确定半径
        int radius = Math.min(getWidth(),getHeight())/2-lineSize;
        //画圆
        canvas.drawCircle(getPivotX(),getPivotY(),radius,cirlePaint);

        //画文本
        String text = (int)(progress*100)+"%";
        //计算文本宽度
        int width = (int)textPaint.measureText(text);
        //获取文字矩阵
        Paint.FontMetricsInt fm =textPaint.getFontMetricsInt();

        canvas.drawText(text,getPivotX()-width/2,getPivotY()+(-fm.ascent)/2,textPaint);
    }

3、定义进度圈CircleView，贝塞尔曲线WaveView，进度Progress
调用onlayout方法创建CircllieView和WaveVIew并布局：

protected void onLayout(boolean changed, int l, int t, int r, int b) {
        //创建CircleView
         cv = new CircleView(getContext());
        cv.setLineColor(Color.RED);
        cv.setLineSize(50);
        cv.setTextColor(Color.RED);
        cv.setCenterYSpace(-90);
        //对子视图进行布局
        cv.layout(0,0,getWidth(),getHeight());
        //将子视图添加到容器中
        addView(cv);

        //创建WaveView
        wv = new WaveView(getContext());
        wv.setLineSize(5);
        wv.setWaveCrest(30);
        wv.setWaveLenth(100);
        wv.setLineColor(Color.BLACK);

        //布局
        wv.layout(getWidth()/4,getHeight()/2-30,getWidth()*3/4,getHeight()/2+30);
        //添加
        addView(wv);
    }

在调setProgress方法实现改变进度的值

public void setProgress(float progress) {
        Progress = progress;
        //改变CircleView的进度值
        cv.setProgress(progress);
        if(progress <=1 ){
            cv.setProgress(progress);
        }
        if((int)progress == 1.01){
            wv.stopWave();
        }
    }

PS

由于每周周末才上课的原因，有一种不情愿的小情绪，学习的画图主要就是创建画笔和画板，同时调用onDraw画图，画图同时还需注意图的布局。