Android自定义View实现炫酷进度条

2023-08-09 23:18:06 151

本文实例为大家分享了Android实现炫酷进度条的具体代码，供大家参考，具体内容如下

下面我们来实现如下效果：

第一步：创建attrs文件夹，自定义属性：

第二步：自定义View：

/**
*CreatedbyMichaelon2019/11/1.
*/

publicclassMyProgressextendsView{

privateintoutColor;
privateintinnerColor;
privateinttextColor;
privatefloatborderWidth;
privateinttextSize;
privatePaintmOutPaint;
privatePaintmInnerPaint;
privatePaintmTextPaint;
privatefloatpercent;
privateintp;

publicMyProgress(Contextcontext){
this(context,null);
}

publicMyProgress(Contextcontext,@NullableAttributeSetattrs){
this(context,attrs,0);
}

publicMyProgress(Contextcontext,@NullableAttributeSetattrs,intdefStyleAttr){
super(context,attrs,defStyleAttr);
TypedArrayarray=context.obtainStyledAttributes(attrs,R.styleable.MyProgress);
outColor=array.getColor(R.styleable.MyProgress_out_color,Color.GREEN);
innerColor=array.getColor(R.styleable.MyProgress_inner_color,Color.BLUE);
textColor=array.getColor(R.styleable.MyProgress_text_color,Color.BLACK);
borderWidth=array.getDimension(R.styleable.MyProgress_border_width,10);
textSize=array.getDimensionPixelSize(R.styleable.MyProgress_text_size,20);
array.recycle();
init();


}

privatevoidinit(){
mOutPaint=newPaint();
mOutPaint.setAntiAlias(true);
mOutPaint.setDither(true);
mOutPaint.setStyle(Paint.Style.STROKE);
mOutPaint.setStrokeWidth(borderWidth);
mOutPaint.setColor(outColor);

mInnerPaint=newPaint();
mInnerPaint.setAntiAlias(true);
mInnerPaint.setDither(true);
mInnerPaint.setStyle(Paint.Style.STROKE);
mInnerPaint.setStrokeWidth(borderWidth);
mInnerPaint.setColor(innerColor);

mTextPaint=newPaint();
mTextPaint.setAntiAlias(true);
mTextPaint.setDither(true);
mTextPaint.setStyle(Paint.Style.FILL);
mTextPaint.setTextSize(textSize);
mTextPaint.setColor(textColor);

percent=0;
p=100;
}

@Override
protectedvoidonMeasure(intwidthMeasureSpec,intheightMeasureSpec){
intwidthMode=MeasureSpec.getMode(widthMeasureSpec);
intheightMode=MeasureSpec.getMode(heightMeasureSpec);
intwidth=0,height=0;
if(widthMode==MeasureSpec.AT_MOST){

}else{
width=MeasureSpec.getSize(widthMeasureSpec);
}
if(heightMode==MeasureSpec.AT_MOST){

}else{
height=MeasureSpec.getSize(heightMeasureSpec);
}
setMeasuredDimension(width>height?height:width,width>height?height:width);
}

@Override
protectedvoidonDraw(Canvascanvas){
super.onDraw(canvas);
intrWidth=getWidth()>getHeight()?getHeight():getWidth();
intrHeight=getWidth()>getHeight()?getHeight():getWidth();
//intrWidth=getWidth();
//intrHeight=getHeight();

floatradius=rWidth/2-borderWidth/2;
canvas.drawCircle(rWidth/2,rHeight/2,radius,mOutPaint);

RectFr=newRectF(borderWidth/2,borderWidth/2,
rWidth-borderWidth/2,rHeight-borderWidth/2);
canvas.drawArc(r,0,360*percent,false,mInnerPaint);

Strings1=(int)(percent*100)+"%";
Rectr2=newRect();
mTextPaint.getTextBounds(s1,0,s1.length(),r2);
inttWidth=r2.width();
inttHeight=r2.height();
Paint.FontMetricsIntfontMetricsInt=newPaint.FontMetricsInt();
intdy=(fontMetricsInt.bottom-fontMetricsInt.top)/2-fontMetricsInt.bottom;
intbaseLine=tHeight/2+dy+rHeight/2-tHeight/2;
intx0=rWidth/2-tWidth/2;
canvas.drawText(s1,x0,baseLine,mTextPaint);
}

publicvoidsetProgress(floatpercent,intvalue){
this.percent=percent;
invalidate();
}


}

然后在布局中使用：

在activity中使用属性动画完成效果：

publicclassMainActivityextendsAppCompatActivity{

@Override
protectedvoidonCreate(BundlesavedInstanceState){
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
finalMyProgressprogress=findViewById(R.id.progress);
ValueAnimatoranimator=ValueAnimator.ofInt(0,5000);
animator.addUpdateListener(newValueAnimator.AnimatorUpdateListener(){
@Override
publicvoidonAnimationUpdate(ValueAnimatoranimation){
floatp=animation.getAnimatedFraction();
intvalue=(int)animation.getAnimatedValue();
progress.setProgress(p,value);
}
});
animator.setDuration(10000);
animator.start();
}


}

如果我们改动一下代码：

//intrWidth=getWidth();
//intrHeight=getHeight();

我们使用onDraw()方法的时候如果使用上面的方法确定宽高，将会绘制成下图所示：

很奇怪！欢迎大家解决此问题。

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持毛票票。

声明：本文内容来源于网络，版权归原作者所有，内容由互联网用户自发贡献自行上传，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任。如果您发现有涉嫌版权的内容，欢迎发送邮件至：czq8825#qq.com（发邮件时，请将#更换为@）进行举报，并提供相关证据，一经查实，本站将立刻删除涉嫌侵权内容。

Android自定义View实现炫酷进度条

热门推荐

随机推荐