Android如何自定義帶動畫的半圓環型進度效果

小編給大家分享一下Android如何自定義帶動畫的半圓環型進度效果，相信大部分人都還不怎么了解，因此分享這篇文章給大家參考一下，希望大家閱讀完這篇文章后大有收獲，下面讓我們一起去了解一下吧！

具體內容如下

package com.newair.ondrawtext;

import android.animation.ValueAnimator;
import android.annotation.TargetApi;
import android.content.Context;
import android.content.res.TypedArray;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Paint;
import android.graphics.RectF;
import android.graphics.Typeface;
import android.os.Build;
import android.util.AttributeSet;
import android.view.View;
import android.view.animation.OvershootInterpolator;

/**
 * Created by ouhimehime on 16/6/15.
 * --------自定義控件-------
 */
public class CustomView extends View {


  //畫筆
  private Paint paint;
  private RectF oval;


  //圓弧顏色
  private int roundColor;
  //進度顏色
  private int progressColor;
  //文字內容
  private boolean textIsShow;
  //字體大小
  private float textSize = 14;
  //文字顏色
  private int textColor;
  //最大進度
  private int max = 1000;
  //當前進度
  private int progress = 300;
  //圓弧寬度
  private int roundWidth = 30;

  private int viewWidth; //寬度--控件所占區域

  private float nowPro = 0;//用于動畫

  private ValueAnimator animator;

  public CustomView(Context context) {
    super(context);
  }

  public CustomView(Context context, AttributeSet attrs) {
    super(context, attrs);
    initAttrs(attrs, context);
  }

  public CustomView(Context context, AttributeSet attrs, int defStyleAttr) {
    super(context, attrs, defStyleAttr);
    initAttrs(attrs, context);
  }

  @TargetApi(Build.VERSION_CODES.LOLLIPOP)
  public CustomView(Context context, AttributeSet attrs, int defStyleAttr, int defStyleRes) {
    super(context, attrs, defStyleAttr, defStyleRes);
    initAttrs(attrs, context);
  }


  private void initAttrs(AttributeSet attr, Context context) {
    TypedArray array = context.obtainStyledAttributes(attr, R.styleable.CustomView);


    roundColor = array.getColor(R.styleable.CustomView_roundColor, Color.BLACK);//環形顏色
    progressColor = array.getColor(R.styleable.CustomView_progressColor, Color.RED);//進度顏色
    textIsShow = array.getBoolean(R.styleable.CustomView_textIsShow, false);//文字
    textSize = array.getDimension(R.styleable.CustomView_textSize, 14);//文字大小
    textColor = array.getColor(R.styleable.CustomView_textColor, Color.BLACK);//文字顏色
    roundWidth = array.getInt(R.styleable.CustomView_roundWidth, 30);//圓環寬度

    array.recycle();

    //動畫
    animator = ValueAnimator.ofFloat(0, progress);
    animator.setDuration(1800);
    animator.setInterpolator(new OvershootInterpolator());
    animator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
      @Override
      public void onAnimationUpdate(ValueAnimator animation) {
        nowPro = (float) animation.getAnimatedValue();
        postInvalidate();
      }
    });
    animator.start();

  }

  @Override
  protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {

    final int widthSpecMode = MeasureSpec.getMode(widthMeasureSpec);
    final int widthSpecSize = MeasureSpec.getSize(widthMeasureSpec);

    if (widthSpecMode == MeasureSpec.AT_MOST) {//可獲得最大空間
      setMeasuredDimension(widthMeasureSpec, (widthSpecSize / 2) + (int) (Math.cos(20) * (widthSpecSize / 2)));
    } else if (widthMeasureSpec == MeasureSpec.EXACTLY) {//一般指精確值
      setMeasuredDimension(widthMeasureSpec, (widthSpecSize / 2) + (int) (Math.cos(20) * (widthSpecSize / 2)));
    } else {
      setMeasuredDimension(widthMeasureSpec, (viewWidth / 2) + (int) (Math.cos(20) * (viewWidth / 2)));
    }
  }

  @Override
  protected void onSizeChanged(int w, int h, int oldw, int oldh) {
    super.onSizeChanged(w, h, oldw, oldh);

    viewWidth = w;//得到寬度以此來計算控件所占實際大小

    //計算畫布所占區域
    oval = new RectF();
    oval.left = roundWidth + getPaddingLeft();
    oval.top = roundWidth + getPaddingTop();
    oval.right = viewWidth - roundWidth - getPaddingRight();
    oval.bottom = viewWidth - roundWidth - getPaddingBottom();

  }


  @Override
  protected void onDraw(Canvas canvas) {
    super.onDraw(canvas);

    Paint paint = new Paint();
    paint.setAntiAlias(true);            //設置畫筆為無鋸齒
    paint.setColor(roundColor);           //設置畫筆顏色
    paint.setStrokeWidth(roundWidth);        //線寬
    paint.setStyle(Paint.Style.STROKE);       //空心
    canvas.drawArc(oval, 160, 220, false, paint);  //繪制圓弧

    //畫進度層
    paint.setColor(progressColor);
    paint.setStrokeWidth(roundWidth + 1);
    canvas.drawArc(oval, 160, 220 * nowPro / max, false, paint); //繪制圓弧


    if (textIsShow) {
      paint.setColor(textColor);
      paint.setStrokeWidth(0);
      paint.setTypeface(Typeface.DEFAULT);
      paint.setTextSize(textSize * 2);
      float textWidth = paint.measureText((int) ((nowPro / (float) max) * 100) + "%");
      canvas.drawText((int) ((nowPro / (float) max) * 100) + "%", viewWidth / 2 - textWidth / 2, viewWidth / 2, paint);
    }

  }


  private int getDefaultHeight() {
    return 0;
  }

  private int getDefaultWidth() {
    return 0;
  }


  public int getRoundColor() {
    return roundColor;
  }

  public void setRoundColor(int roundColor) {
    this.roundColor = roundColor;
  }

  public int getProgressColor() {
    return progressColor;
  }

  public void setProgressColor(int progressColor) {
    this.progressColor = progressColor;
  }

  public boolean getText() {
    return textIsShow;
  }

  public void setText(boolean text) {
    this.textIsShow = text;
  }

  public float getTextSize() {
    return textSize;
  }

  public void setTextSize(float textSize) {
    this.textSize = textSize;
  }

  public int getTextColor() {
    return textColor;
  }

  public void setTextColor(int textColor) {
    this.textColor = textColor;
  }

  public int getMax() {
    return max;
  }

  public void setMax(int max) {
    this.max = max;
  }

  public int getProgress() {
    return progress;
  }

  public void setProgress(int progress) {
    this.progress = progress;
  }
}

自定義屬性

<declare-styleable name="CustomView">
    <attr name="roundColor" format="color" />
    <attr name="progressColor" format="color" />
    <attr name="textIsShow" format="boolean" />
    <attr name="textSize" format="dimension" />
    <attr name="textColor" format="color" />
    <attr name="roundWidth" format="integer" />
  </declare-styleable>

用法

<com.newair.ondrawtext.CustomView
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:visibility="visible"
    app:progressColor="@android:color/holo_orange_dark"
    app:roundColor="@android:color/holo_blue_dark"
    app:roundWidth="45"
    app:textColor="@android:color/black"
    app:textIsShow="true"
    app:textSize="14sp" />

以上是“Android如何自定義帶動畫的半圓環型進度效果”這篇文章的所有內容，感謝各位的閱讀！相信大家都有了一定的了解，希望分享的內容對大家有所幫助，如果還想學習更多知識，歡迎關注億速云行業資訊頻道！