Android开发WaveLoadingView画图

释放双眼,带上耳机,听听看~!

目的

创建一个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();
}
}

 

人已赞赏
Android文章

Android开发RecyclerView左右侧滑

2020-2-1 9:58:52

Android文章

Android开发短信备份的方法(高效)

2020-2-1 10:37:40

个人中心
购物车
优惠劵
今日签到
有新私信 私信列表
有新消息 消息中心
搜索