自定义view之实现圆形进度条加载,颜色渐变,可暂停,可循环加载
看效果图:
1:自定义view类:
import android.content.Context; import android.graphics.Canvas; import android.graphics.Color; import android.graphics.LinearGradient; import android.graphics.Paint; import android.graphics.RectF; import android.graphics.Shader; import android.util.AttributeSet; import android.util.TypedValue; import android.view.View; /** * @类的用途: * @author: 李晓倩 * @date: 2017/6/12 */ public class GradientProgressBar extends View { /*圆弧线宽*/ private float circleBorderWidth = TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 20, getResources().getDisplayMetrics()); /*内边距*/ private float circlePadding = TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, 20, getResources().getDisplayMetrics()); /*字体大小*/ private float textSize = TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_SP, 50, getResources().getDisplayMetrics()); /*绘制圆周的画笔*/ private Paint backCirclePaint; /*绘制圆周白色分割线的画笔*/ private Paint linePaint; /*绘制文字的画笔*/ private Paint textPaint; /*百分比*/ private int percent =0; /*渐变圆周颜色数组*/ private int[] gradientColorArray = new int[]{Color.GREEN, Color.parseColor("#fe751a"), Color.parseColor("#13be23"), Color.GREEN}; private Paint gradientCirclePaint; public GradientProgressBar(Context context) { super(context); init(); } public GradientProgressBar(Context context, AttributeSet attrs) { super(context, attrs); init(); } public GradientProgressBar(Context context, AttributeSet attrs, int defStyleAttr) { super(context, attrs, defStyleAttr); init(); } private void init() { backCirclePaint = new Paint(); backCirclePaint.setStyle(Paint.Style.STROKE); backCirclePaint.setAntiAlias(true); backCirclePaint.setColor(Color.LTGRAY); backCirclePaint.setStrokeWidth(circleBorderWidth); gradientCirclePaint = new Paint(); gradientCirclePaint.setStyle(Paint.Style.STROKE); gradientCirclePaint.setAntiAlias(true); gradientCirclePaint.setColor(Color.LTGRAY); gradientCirclePaint.setStrokeWidth(circleBorderWidth); linePaint = new Paint(); linePaint.setColor(Color.WHITE); linePaint.setStrokeWidth(5); textPaint = new Paint(); textPaint.setAntiAlias(true); textPaint.setTextSize(textSize); textPaint.setColor(Color.BLACK); } @Override protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) { int measureWidth = MeasureSpec.getSize(widthMeasureSpec); int measureHeight = MeasureSpec.getSize(heightMeasureSpec); setMeasuredDimension(Math.min(measureWidth, measureHeight), Math.min(measureWidth, measureHeight)); } @Override protected void onDraw(Canvas canvas) { super.onDraw(canvas); //1.绘制灰色背景圆环 canvas.drawArc( new RectF(circlePadding * 2, circlePadding * 2, getMeasuredWidth() - circlePadding * 2, getMeasuredHeight() - circlePadding * 2), -90, 360, false, backCirclePaint); //2.绘制颜色渐变圆环 if (percent > 0) { LinearGradient linearGradient = new LinearGradient(circlePadding, circlePadding, getMeasuredWidth() - circlePadding, getMeasuredHeight() - circlePadding, gradientColorArray, null, Shader.TileMode.MIRROR); gradientCirclePaint.setShader(linearGradient); gradientCirclePaint.setShadowLayer(10, 10, 10, Color.RED); canvas.drawArc( new RectF(circlePadding * 2, circlePadding * 2, getMeasuredWidth() - circlePadding * 2, getMeasuredHeight() - circlePadding * 2), -90, (float) (percent / 100.0) * 360, false, gradientCirclePaint); //半径 float radius = (getMeasuredWidth() - circlePadding * 3) / 2; //X轴中点坐标 int centerX = getMeasuredWidth() / 2; //3.绘制100份线段,切分空心圆弧 for (float i = 0; i < 360; i += 3.6) { double rad = i * Math.PI / 180; float startX = (float) (centerX + (radius - circleBorderWidth) * Math.sin(rad)); float startY = (float) (centerX + (radius - circleBorderWidth) * Math.cos(rad)); float stopX = (float) (centerX + radius * Math.sin(rad) + 1); float stopY = (float) (centerX + radius * Math.cos(rad) + 1); canvas.drawLine(startX, startY, stopX, stopY, linePaint); } //4.绘制文字 float textWidth = textPaint.measureText(percent + "%"); int textHeight = (int) (Math.ceil(textPaint.getFontMetrics().descent - textPaint.getFontMetrics().ascent) + 2); canvas.drawText(percent + "%", centerX - textWidth / 2, centerX + textHeight / 4, textPaint); } } /** * 设置百分比 * * @param percent */ public void setPercent(int percent) { this.percent = percent; postInvalidate(); } public int getPercent() { return percent; } }
2:布局文件:
<?xml version="1.0" encoding="utf-8"?> <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:id="@+id/activity_main2" android:layout_width="match_parent" android:layout_height="match_parent" tools:context="test.bwie.com.lixiaoqian20170612.Main2Activity"> <test.bwie.com.lixiaoqian20170612.GradientProgressBar android:id="@+id/gpb" android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_alignParentTop="true" android:layout_centerHorizontal="true" android:layout_marginTop="254dp"/> <Button android:layout_margin="20dp" android:id="@+id/btn1" android:text="自动循环" android:layout_width="wrap_content" android:layout_height="wrap_content"/> <Button android:layout_margin="20dp" android:layout_alignParentRight="true" android:id="@+id/btn2" android:text="暂停" android:layout_width="wrap_content" android:layout_height="wrap_content"/> </RelativeLayout>
3:activity类
import android.os.Bundle; import android.os.Handler; import android.os.Message; import android.support.v7.app.AppCompatActivity; import android.view.View; import android.widget.Button; public class Main2Activity extends AppCompatActivity implements View.OnClickListener { private GradientProgressBar gpb; private Button btn1; private Button btn2; private boolean flag=false; private int progress; private boolean increase; private boolean decrease; private Handler handler = new Handler(){ @Override public void handleMessage(Message msg) { switch (msg.what){ case 0: increase=true; progress = gpb.getPercent(); gpb.setPercent(++progress); if(progress >= 100){ gpb.setPercent(100); if(flag){ increase=false; handler.removeMessages(0); handler.sendEmptyMessageDelayed(1,100); } }else{ handler.sendEmptyMessageDelayed(0,100); } break; case 1: decrease=true; gpb.setPercent(progress--); if(progress <= 0){ decrease=false; handler.removeMessages(1); gpb.setPercent(0); handler.sendEmptyMessageDelayed(0,100); }else{ handler.sendEmptyMessageDelayed(1,100); } break; } } }; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main2); initView(); handler.sendEmptyMessageDelayed(0,100); } private void initView() { gpb = (GradientProgressBar) findViewById(R.id.gpb); btn1 = (Button) findViewById(R.id.btn1); btn2 = (Button) findViewById(R.id.btn2); btn1.setOnClickListener(this); btn2.setOnClickListener(this); } @Override public void onClick(View v) { switch (v.getId()) { case R.id.btn1: flag=true; if(increase){ handler.sendEmptyMessageDelayed(0,100); }else{ handler.sendEmptyMessageDelayed(1,100); } break; case R.id.btn2: handler.removeMessages(0); handler.removeMessages(1); break; } } }