900字范文,内容丰富有趣,生活中的好帮手!
900字范文 > android自定义进度条百分比跟着走 Android studio圆形进度条 百分数跟随变化

android自定义进度条百分比跟着走 Android studio圆形进度条 百分数跟随变化

时间:2024-03-21 20:18:58

相关推荐

android自定义进度条百分比跟着走 Android studio圆形进度条 百分数跟随变化

本文实例为大家分享了Android studio圆形进度条展示的具体代码,供大家参考,具体内容如下

MainActivity

import android.support.v7.app.AppCompatActivity;

import android.os.Bundle;

import android.view.View;

import android.widget.Button;

public class MainActivity extends AppCompatActivity implements View.OnClickListener{

private Gua mGua1;

private Button play;

private Button resele;

private Button dao;

@Override

protected void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.activity_main);

mGua1 = (Gua) findViewById(R.id.Circle);

mGua1.setTargetPercent(0);

play=(Button)findViewById(R.id.play);

resele=(Button)findViewById(R.id.resele);

dao=(Button)findViewById(R.id.dao);

play.setOnClickListener(this);

resele.setOnClickListener(this);

dao.setOnClickListener(this);

}

@Override

public void onClick(View view) {

switch (view.getId()){

case R.id.play:

//设置目标百分比为100

mGua1.setTargetPercent(100);

mGua1.invalidate();

break;

case R.id.resele:

//设置目标百分比为0

mGua1.setTargetPercent(0);

mGua1.invalidate();

break;

case R.id.dao:

//设置目标百分比为100

mGua1.setTargetPercent(0);

mGua1.invalidate();

break;

}

}

}

Gua

import android.content.Context;

import android.content.res.TypedArray;

import android.graphics.Canvas;

import android.graphics.Paint;

import android.graphics.Paint.Align;

import android.graphics.RectF;

import android.util.AttributeSet;

import android.view.View;

public class Gua extends View{

private Paint mCirclePaint;

private Paint mTextPaint;

private Paint mArcPaint;

private int mCircleX;

private int mCircleY;

private float mCurrentAngle;

private RectF mArcRectF;

private float mStartSweepValue;

private float mTargetPercent;

private float mCurrentPercent;

private int mRadius;

private int mCircleBackground;

private int mRingColor;

private int mTextSize;

private int mTextColor;

public Gua(Context context, AttributeSet attrs, int defStyle) {

super(context, attrs, defStyle);

init(context);

}

public Gua(Context context, AttributeSet attrs) {

super(context, attrs);

//自定义属性 values/attr

TypedArray typedArray = context.obtainStyledAttributes(attrs,R.styleable.PercentageRing);

//中间圆的背景颜色 默认为浅紫色

mCircleBackground = typedArray.getColor(R.styleable.PercentageRing_circleBackground, 0xffafb4db);

//外圆环的颜色 默认为深紫色

mRingColor = typedArray.getColor(R.styleable.PercentageRing_ringColor, 0xff6950a1);

//中间圆的半径 默认为60

mRadius = typedArray.getInt(R.styleable.PercentageRing_radius, 60);

//字体颜色 默认为白色

mTextColor = typedArray.getColor(R.styleable.PercentageRing_textColor, 0xffffffff);

//最后一定要调用这个 释放掉TypedArray

typedArray.recycle();

//初始化数据

init(context);

}

public Gua(Context context) {

super(context);

init(context);

}

private void init(Context context){

//圆环开始角度 -90° 正北方向

mStartSweepValue = -90;

//当前角度

mCurrentAngle = 0;

//当前百分比

mCurrentPercent = 0;

//设置中心园的画笔

mCirclePaint = new Paint();

mCirclePaint.setAntiAlias(true);

mCirclePaint.setColor(mCircleBackground);

mCirclePaint.setStyle(Paint.Style.FILL);

//设置文字的画笔

mTextPaint = new Paint();

mTextPaint.setColor(mTextColor);

mTextPaint.setAntiAlias(true);

mTextPaint.setStyle(Paint.Style.FILL);

mTextPaint.setStrokeWidth((float) (0.025*mRadius));

mTextPaint.setTextSize(mRadius/2);

mTextPaint.setTextAlign(Align.CENTER);

//设置外圆环的画笔

mArcPaint = new Paint();

mArcPaint.setAntiAlias(true);

mArcPaint.setColor(mRingColor);

mArcPaint.setStyle(Paint.Style.STROKE);

mArcPaint.setStrokeWidth((float) (0.075*mRadius));

//获得文字的字号 因为要设置文字在圆的中心位置

mTextSize = (int) mTextPaint.getTextSize();

}

//主要是测量wrap_content时候的宽和高,因为宽高一样,只需要测量一次宽即可,高等于宽

@Override

protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {

setMeasuredDimension(measure(widthMeasureSpec), measure(widthMeasureSpec));

//设置圆心坐标

mCircleX = getMeasuredWidth()/2;

mCircleY = getMeasuredHeight()/2;

//如果半径大于圆心横坐标,需要手动缩小半径的值,否则就画到外面去了

if (mRadius>mCircleX) {

//设置半径大小为圆心横坐标到原点的距离

mRadius = mCircleX;

mRadius = (int) (mCircleX-0.075*mRadius);

//因为半径改变了,所以要重新设置一下字体宽度

mTextPaint.setStrokeWidth((float) (0.025*mRadius));

//重新设置字号

mTextPaint.setTextSize(mRadius/2);

//重新设置外圆环宽度

mArcPaint.setStrokeWidth((float) (0.075*mRadius));

//重新获得字号大小

mTextSize = (int) mTextPaint.getTextSize();

}

//画中心园的外接矩形,用来画圆环用

mArcRectF = new RectF(mCircleX-mRadius, mCircleY-mRadius, mCircleX+mRadius, mCircleY+mRadius);

}

//当wrap_content的时候,view的大小根据半径大小改变,但最大不会超过屏幕

private int measure(int measureSpec){

int result=0;

int specMode = MeasureSpec.getMode(measureSpec);

int specSize = MeasureSpec.getSize(measureSpec);

if (specMode == MeasureSpec.EXACTLY) {

result = specSize;

}else {

result =(int) (1.075*mRadius*2);

if (specMode == MeasureSpec.AT_MOST) {

result = Math.min(result, specSize);

}

}

return result;

}

//开始画中间圆、文字和外圆环

@Override

protected void onDraw(Canvas canvas) {

super.onDraw(canvas);

//画中间圆

canvas.drawCircle(mCircleX, mCircleY, mRadius, mCirclePaint);

//画圆环

canvas.drawArc(mArcRectF, mStartSweepValue ,mCurrentAngle, false, mArcPaint);

//画文字

canvas.drawText(String.valueOf(mCurrentPercent)+"%", mCircleX, mCircleY+mTextSize/4, mTextPaint);

//判断当前百分比是否小于设置目标的百分比

if (mCurrentPercent

//当前百分比+1

mCurrentPercent+=1;

//当前角度+360

mCurrentAngle+=3.6;

//每10ms重画一次

postInvalidateDelayed(10);

}/*else if(mCurrentPercent==mTargetPercent){

//当前百分比-1

mCurrentPercent=0;

//当前角度+360

mCurrentAngle=0;

//每10ms重画一次

postInvalidateDelayed(10);

}*/else if(mCurrentPercent>mTargetPercent){

//当前百分比-1

mCurrentPercent-=1;

//当前角度+360

mCurrentAngle-=3.6;

//每10ms重画一次

postInvalidateDelayed(10);

}

}

//设置目标的百分比

public void setTargetPercent(int percent){

this.mTargetPercent = percent;

}

}

Xml文件

android:layout_width="match_parent"

android:layout_height="match_parent"

xmlns:app="/apk/res-auto"

android:orientation="vertical">

android:id="@+id/but1"

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:text="改变外层圆环颜色"

/>

android:id="@+id/Circle"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

app:radius="90"

app:textColor="#ffffffff"

/>

android:layout_width="match_parent"

android:layout_height="wrap_content"

android:orientation="horizontal"

android:gravity="center"

>

android:id="@+id/play"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:text="开始"

/>

android:id="@+id/resele"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:text="重置"

/>

android:id="@+id/dao"

android:layout_width="wrap_content"

android:layout_height="wrap_content"

android:text="暂停"

/>

values文件中的attrs

效果展示:

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

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。