Android自定義view實現圓環進度條效果
本文實例為大傢分享瞭Android自定義view實現圓環進度條效果的具體代碼，供大傢參考，具體內容如下
一、實現效果圖
二、核心代碼
自定義view的屬性
<?xml version="1.0" encoding="utf-8"?> <resources> <declare-styleable name="RingProgressBar"> <attr name="ringColor" format="color" /> <attr name="ringProgressColor" format="color" /> <attr name="ringWidth" format="dimension"></attr> <attr name="textColor" format="color" /> <attr name="textSize" format="dimension" /> <attr name="max" format="integer"></attr> <attr name="textIsDisplayable" format="boolean"></attr> <attr name="style"> <enum name="STROKE" value="0"></enum> <enum name="FILL" value="1"></enum> </attr> </declare-styleable> </resources>
自定義view
package com.czhappy.ringprogressdemo.view;
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.util.AttributeSet;
import android.util.Log;
import android.view.View;
import com.czhappy.ringprogressdemo.R;
/**
* Description:
* User: chenzheng
* Date: 2017/2/10 0010
* Time: 15:11
*/
public class RingProgressBar extends View {
/**
* 畫筆對象的引用
*/
private Paint ringPaint;
private Paint ringProgressPaint;
private Paint txtPaint;
/**
* 圓環的顏色
*/
private int ringColor;
/**
* 圓環進度的顏色
*/
private int ringProgressColor;
/**
* 中間進度百分比的字符串的顏色
*/
private int textColor;
/**
* 中間進度百分比的字符串的字體
*/
private float textSize;
/**
* 圓環的寬度
*/
private float ringWidth;
/**
* 最大進度
*/
private int max;
/**
* 當前進度
*/
private int progress;
/**
* 是否顯示中間的進度
*/
private boolean textIsDisplayable;
private Context mContext;
/**
* 進度的風格，實心或者空心
*/
private int style;
public static final int STROKE = 0;
public static final int FILL = 1;
public RingProgressBar(Context context) {
this(context, null);
}
public RingProgressBar(Context context, AttributeSet attrs) {
this(context, attrs, 0);
}
public RingProgressBar(Context context, AttributeSet attrs, int defStyleAttr) {
super(context, attrs, defStyleAttr);
this.mContext = context;
// 獲取自定義的屬性
initAttrs(context, attrs);
initPaint();
}
private void initAttrs(Context context, AttributeSet attrs) {
TypedArray mTypedArray = context.obtainStyledAttributes(attrs,
R.styleable.RingProgressBar);
//獲取自定義屬性和默認值
ringColor = mTypedArray.getColor(R.styleable.RingProgressBar_ringColor, Color.GRAY);
ringProgressColor = mTypedArray.getColor(R.styleable.RingProgressBar_ringProgressColor, Color.GREEN);
textColor = mTypedArray.getColor(R.styleable.RingProgressBar_textColor, Color.GREEN);
textSize = mTypedArray.getDimension(R.styleable.RingProgressBar_textSize, 16);
ringWidth = mTypedArray.getDimension(R.styleable.RingProgressBar_ringWidth, 5);
max = mTypedArray.getInteger(R.styleable.RingProgressBar_max, 100);
textIsDisplayable = mTypedArray.getBoolean(R.styleable.RingProgressBar_textIsDisplayable, true);
style = mTypedArray.getInt(R.styleable.RingProgressBar_style, 0);
//資源回收
mTypedArray.recycle();
}
/**
* 初始化畫筆
*/
private void initPaint() {
//圓環畫筆
ringPaint = new Paint();
ringPaint.setColor(ringColor); //設置圓環的顏色
ringPaint.setStyle(Paint.Style.STROKE); //設置空心
ringPaint.setStrokeWidth(ringWidth); //設置圓環的寬度
ringPaint.setAntiAlias(true); //消除鋸齒
//圓環進度畫筆
ringProgressPaint = new Paint();
ringProgressPaint.setColor(ringProgressColor); //設置圓環的顏色
ringProgressPaint.setStrokeWidth(ringWidth); //設置圓環的寬度
ringProgressPaint.setAntiAlias(true); //消除鋸齒
switch (style) {
case STROKE:
ringProgressPaint.setStyle(Paint.Style.STROKE);
break;
case FILL:
ringProgressPaint.setStyle(Paint.Style.FILL_AND_STROKE);
break;
}
//百分比文字畫筆
txtPaint = new Paint();
txtPaint.setColor(textColor);
txtPaint.setTextSize(textSize);
txtPaint.setTypeface(Typeface.DEFAULT_BOLD); //設置字體
}
@Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
//圓心坐標
int mXCenter = getWidth() / 2;
int mYCenter = getHeight() / 2;
int radius = (int) (mXCenter - ringWidth / 2); //圓環的半徑
//繪制圓環
canvas.drawCircle(mXCenter, mYCenter, radius, ringPaint);
//繪制圓環進度
RectF oval = new RectF(mXCenter - radius, mYCenter - radius, mXCenter
+ radius, mYCenter + radius); //用於定義的圓弧的形狀和大小的界限
switch (style) {
case STROKE:
canvas.drawArc(oval, -90, 360 * progress / max, false, ringProgressPaint); //根據進度畫圓弧
break;
case FILL:
if (progress != 0)
canvas.drawArc(oval, -90, 360 * progress / max, true, ringProgressPaint); //根據進度畫圓弧
break;
}
//繪制百分比數字
//文字繪制
String txt = progress + "%";
//文字的長度
float mTxtWidth = txtPaint.measureText(txt, 0, txt.length());
Log.e("tag", textIsDisplayable+","+progress+(style==STROKE));
if(textIsDisplayable && progress!=0 && style==STROKE){
canvas.drawText(txt, mXCenter - mTxtWidth / 2, mYCenter+textSize/2, txtPaint);
}
}
public synchronized int getMax() {
return max;
}
/**
* 設置進度的最大值
* @param max
*/
public synchronized void setMax(int max) {
if(max < 0){
throw new IllegalArgumentException("max not less than 0");
}
this.max = max;
}
/**
* 獲取進度.需要同步
* @return
*/
public synchronized int getProgress() {
return progress;
}
/**
* 設置進度，此為線程安全控件，由於考慮多線程的問題，需要同步
* 刷新界面調用postInvalidate()能在非UI線程刷新
* @param progress
*/
public synchronized void setProgress(int progress) {
if(progress < 0){
throw new IllegalArgumentException("progress not less than 0");
}
if(progress > max){
progress = max;
}
if(progress <= max){
this.progress = progress;
postInvalidate();
}
}
public int getRingColor() {
return ringColor;
}
public void setRingColor(int ringColor) {
this.ringColor = ringColor;
}
public int getRingProgressColor() {
return ringProgressColor;
}
public void setRingProgressColor(int ringProgressColor) {
this.ringProgressColor = ringProgressColor;
}
public int getTextColor() {
return textColor;
}
public void setTextColor(int textColor) {
this.textColor = textColor;
}
public float getTextSize() {
return textSize;
}
public void setTextSize(float textSize) {
this.textSize = textSize;
}
public float getRingWidth() {
return ringWidth;
}
public void setRingWidth(float roundWidth) {
this.ringWidth = roundWidth;
}
}
MainActivity.java
package com.czhappy.ringprogressdemo.activity;
import android.os.Bundle;
import android.support.v7.app.AppCompatActivity;
import android.view.View;
import com.czhappy.ringprogressdemo.R;
import com.czhappy.ringprogressdemo.view.RingProgressBar;
public class MainActivity extends AppCompatActivity {
private RingProgressBar myProgress;
@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
myProgress = (RingProgressBar) findViewById(R.id.myProgress);
}
public void beginAnim(View view){
new Thread(){
@Override
public void run() {
super.run();
for(int i=0; i<=60; i++){
try {
Thread.sleep(20);
} catch (InterruptedException e) {
e.printStackTrace();
}
myProgress.setProgress(i);
}
}
}.start();
}
}
佈局文件
<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:ring="http://schemas.android.com/apk/res-auto" android:id="@+id/activity_main" android:gravity="center_horizontal" android:layout_width="match_parent" android:layout_height="match_parent" android:orientation="vertical"> <Button android:layout_width="match_parent" android:onClick="beginAnim" android:layout_height="wrap_content" android:text="開始動畫"/> <com.czhappy.ringprogressdemo.view.RingProgressBar android:id="@+id/myProgress" android:layout_width="100dp" android:layout_height="100dp" android:layout_marginTop="20dp" ring:ringColor="@color/ring_color" ring:ringProgressColor="@color/ring_progress_color" ring:textColor="@color/ring_progress_color" ring:textIsDisplayable="true" ring:ringWidth="6dp" ring:textSize="16sp"/> </LinearLayout>
以上就是本文的全部內容，希望對大傢的學習有所幫助，也希望大傢多多支持WalkonNet。
推薦閱讀：
- android實現倒計時動態圈
- 詳解Android如何自定義view實現圓形進度條
- android實現圓環倒計時控件
- Android自定義view實現圓形進度條效果
- Android ProgressBar 模擬進度條效果的實現