Android自定義View之圓形進度條源碼

版權(quán)聲明:本文為博主原創(chuàng)文章,未經(jīng)博主允許不得轉(zhuǎn)載。
教程原文:Android自定義View——從零開始實現(xiàn)圓形進度條

大家要是看到有錯誤的地方或者有啥好的建議,歡迎留言評論

源碼已上傳至github,要獲取最新源碼可點此傳送

CircleBarView.java

public class CircleBarView extends View {
    private Paint bgPaint;//繪制背景圓弧的畫筆
    private Paint progressPaint;//繪制圓弧的畫筆
    private RectF mRectF;//繪制圓弧的矩形區(qū)域
    private CircleBarAnim anim;
    private float progressNum;//可以更新的進度條數(shù)值
    private float maxNum;//進度條最大值
    private int progressColor;//進度條圓弧顏色
    private int bgColor;//背景圓弧顏色
    private float startAngle;//背景圓弧的起始角度
    private float sweepAngle;//背景圓弧掃過的角度
    private float barWidth;//圓弧進度條寬度
    private int defaultSize;//自定義View默認的寬高
    private float progressSweepAngle;//進度條圓弧掃過的角度
    private TextView textView;
    private OnAnimationListener onAnimationListener;
    public CircleBarView(Context context, AttributeSet attrs) {
        super(context, attrs);
        init(context,attrs);
    }
    private void init(Context context,AttributeSet attrs){
        TypedArray typedArray = context.obtainStyledAttributes(attrs,R.styleable.CircleBarView);
        progressColor = typedArray.getColor(R.styleable.CircleBarView_progress_color,Color.GREEN);
        bgColor = typedArray.getColor(R.styleable.CircleBarView_bg_color,Color.GRAY);
        startAngle = typedArray.getFloat(R.styleable.CircleBarView_start_angle,0);
        sweepAngle = typedArray.getFloat(R.styleable.CircleBarView_sweep_angle,360);
        barWidth = typedArray.getDimension(R.styleable.CircleBarView_bar_width,DpOrPxUtils.dip2px(context,10));
        typedArray.recycle();//typedArray用完之后需要回收,防止內(nèi)存泄漏

        progressNum = 0;
        maxNum = 100;
        defaultSize = DpOrPxUtils.dip2px(context,100);
        mRectF = new RectF();
        anim = new CircleBarAnim();

        progressPaint = new Paint();
        progressPaint.setStyle(Paint.Style.STROKE);//只描邊,不填充
        progressPaint.setColor(progressColor);
        progressPaint.setAntiAlias(true);//設(shè)置抗鋸齒
        progressPaint.setStrokeWidth(barWidth);
        progressPaint.setStrokeCap(Paint.Cap.ROUND);//設(shè)置畫筆為圓角

        bgPaint = new Paint();
        bgPaint.setStyle(Paint.Style.STROKE);//只描邊,不填充
        bgPaint.setColor(bgColor);
        bgPaint.setAntiAlias(true);//設(shè)置抗鋸齒
        bgPaint.setStrokeWidth(barWidth);
        bgPaint.setStrokeCap(Paint.Cap.ROUND);
    }
    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        super.onMeasure(widthMeasureSpec, heightMeasureSpec);
        int height = measureSize(defaultSize, heightMeasureSpec);
        int width = measureSize(defaultSize, widthMeasureSpec);
        int min = Math.min(width, height);// 獲取View最短邊的長度
        setMeasuredDimension(min, min);// 強制改View為以最短邊為長度的正方形
        if(min >= barWidth*2){
            mRectF.set(barWidth/2,barWidth/2,min-barWidth/2,min-barWidth/2);
        }
    }
    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        canvas.drawArc(mRectF,startAngle,sweepAngle,false,bgPaint);
        canvas.drawArc(mRectF,startAngle,progressSweepAngle,false, progressPaint);
    }
    public class CircleBarAnim extends Animation{
        public CircleBarAnim(){
        }
        @Override
        protected void applyTransformation(float interpolatedTime, Transformation t) {
            super.applyTransformation(interpolatedTime, t);
            progressSweepAngle = interpolatedTime * sweepAngle * progressNum / maxNum;
            if(textView !=null){
                textView.setText(onAnimationListener.howToChangeText(interpolatedTime, progressNum,maxNum));
            }
            onAnimationListener.howTiChangeProgressColor(progressPaint,interpolatedTime, progressNum,maxNum);
            postInvalidate();
        }
    }
    private int measureSize(int defaultSize,int measureSpec) {
        int result = defaultSize;
        int specMode = View.MeasureSpec.getMode(measureSpec);
        int specSize = View.MeasureSpec.getSize(measureSpec);
        if (specMode == View.MeasureSpec.EXACTLY) {
            result = specSize;
        } else if (specMode == View.MeasureSpec.AT_MOST) {
            result = Math.min(result, specSize);
        }
        return result;
    }
    /**
     * 設(shè)置進度條最大值
     * @param maxNum
     */
    public void setMaxNum(float maxNum) {
        this.maxNum = maxNum;
    }
    /**
     * 設(shè)置進度條數(shù)值
     * @param progressNum 進度條數(shù)值
     * @param time 動畫持續(xù)時間
     */
    public void setProgressNum(float progressNum, int time) {
        this.progressNum = progressNum;
        anim.setDuration(time);
        this.startAnimation(anim);
    }
    /**
     * 設(shè)置顯示文字的TextView
     * @param textView
     */
    public void setTextView(TextView textView) {
        this.textView = textView;
    }
    public interface OnAnimationListener {
        /**
         * 如何處理要顯示的文字內(nèi)容
         * @param interpolatedTime 從0漸變成1,到1時結(jié)束動畫
         * @param updateNum 進度條數(shù)值
         * @param maxNum 進度條最大值
         * @return
         */
        String howToChangeText(float interpolatedTime, float updateNum, float maxNum);
        /**
         * 如何處理進度條的顏色
         * @param paint 進度條畫筆
         * @param interpolatedTime 從0漸變成1,到1時結(jié)束動畫
         * @param updateNum 進度條數(shù)值
         * @param maxNum 進度條最大值
         */
        void howTiChangeProgressColor(Paint paint, float interpolatedTime, float updateNum, float maxNum);
    }
    public void setOnAnimationListener(OnAnimationListener onAnimationListener) {
        this.onAnimationListener = onAnimationListener;
    }
}

DpOrPxUtils.java

public class DpOrPxUtils {
    public static int dip2px(Context context, float dpValue) {
        final float scale = context.getResources().getDisplayMetrics().density;
        return (int) (dpValue * scale + 0.5f);
    }
    public static int px2dip(Context context, float pxValue) {
        final float scale = context.getResources().getDisplayMetrics().density;
        return (int) (pxValue / scale + 0.5f);
    }
}

ShowActivity.java

public class ShowActivity extends AppCompatActivity {
    private Button btnRestart;
    private CircleBarView circleBarView;
    private TextView textProgress;
    private CircleBarView circleBarView2;
    private TextView textProgress2;
    private int num;
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_show);
        textProgress = (TextView) findViewById(R.id.text_progress);
        circleBarView = (CircleBarView)findViewById(R.id.circle_view);
        circleBarView.setTextView(textProgress);
        circleBarView.setOnAnimationListener(new CircleBarView.OnAnimationListener() {
            @Override
            public String howToChangeText(float interpolatedTime, float updateNum, float maxNum) {
                DecimalFormat decimalFormat=new DecimalFormat("0.00");
                String s = decimalFormat.format(interpolatedTime * updateNum / maxNum * 100)+"%";
                return s;
            }
            @Override
            public void howTiChangeProgressColor(Paint paint, float interpolatedTime, float updateNum, float maxNum) {
                LinearGradientUtil linearGradientUtil = new LinearGradientUtil(Color.YELLOW,Color.RED);
                paint.setColor(linearGradientUtil.getColor(interpolatedTime));
            }
        });
        circleBarView.setProgressNum(80,1000);
        
        textProgress2 = (TextView) findViewById(R.id.text_progress2);
        circleBarView2 = (CircleBarView)findViewById(R.id.circle_view2);
        circleBarView2.setTextView(textProgress2);
        circleBarView2.setOnAnimationListener(new CircleBarView.OnAnimationListener() {
            @Override
            public String howToChangeText(float interpolatedTime, float updateNum, float maxNum) {
                DecimalFormat decimalFormat=new DecimalFormat("0.00");
                String s = decimalFormat.format(interpolatedTime * updateNum / maxNum * 100)+"%";
                return s;
            }
            @Override
            public void howTiChangeProgressColor(Paint paint, float interpolatedTime, float updateNum, float maxNum) {
            }
        });
        num = 0;
        setProgressNumInThread();
        
        btnRestart = (Button) findViewById(R.id.btn_restart);
        btnRestart.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                circleBarView.setProgressNum(80,1000);
                setProgressNumInThread();
            }
        });
    }
    private Handler handler=new Handler(){
        @Override
        public void handleMessage(Message msg) {
            super.handleMessage(msg);
            switch (msg.what){
                case 0:
                    circleBarView2.setProgressNum(num,0);
                    break;
            }
        }
    };
    private void setProgressNumInThread(){
        new Thread(new Runnable() {
            @Override
            public void run() {
                try {
                    for (int i=1;i<=100;i++){
                        num = i;
                        handler.obtainMessage(0).sendToTarget();
                        Thread.sleep(50);
                    }
                } catch (InterruptedException e) {
                    e.printStackTrace();
                }
            }
        }).start();
    }
}

activity_show.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context="com.anlia.bauzviews.activity.ShowActivity">
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">
        <Button
            android:id="@+id/btn_restart"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="重置"
            android:layout_gravity="center_horizontal"
            android:layout_marginTop="10dp"/>
        <RelativeLayout
            android:layout_width="100dp"
            android:layout_height="100dp"
            android:layout_gravity="center_horizontal"
            android:layout_marginTop="10dp">
            <com.anlia.progressbar.CircleBarView
                android:id="@+id/circle_view"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:layout_gravity="center_horizontal"
                app:start_angle="135"
                app:sweep_angle="270"
                app:progress_color="@color/red"
                app:bg_color="@color/gray_light"
                app:bar_width="8dp"/>
            <TextView
                android:id="@+id/text_progress"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_centerVertical="true"
                android:layout_centerHorizontal="true"/>
        </RelativeLayout>
        <TextView
            android:layout_width="200dp"
            android:layout_height="wrap_content"
            android:layout_gravity="center_horizontal"
            android:text="單次設(shè)置進度條數(shù)值,動畫時間為1秒"
            android:layout_marginTop="5dp"/>
        <RelativeLayout
            android:layout_width="100dp"
            android:layout_height="100dp"
            android:layout_gravity="center_horizontal"
            android:layout_marginTop="15dp">
            <com.anlia.progressbar.CircleBarView
                android:id="@+id/circle_view2"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:layout_gravity="center_horizontal"
                app:start_angle="270"
                app:sweep_angle="360"
                app:progress_color="@color/green_light"
                app:bg_color="@color/gray_light"
                app:bar_width="8dp"/>
            <TextView
                android:id="@+id/text_progress2"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_centerVertical="true"
                android:layout_centerHorizontal="true"/>
        </RelativeLayout>
        <TextView
            android:layout_width="200dp"
            android:layout_height="wrap_content"
            android:layout_gravity="center_horizontal"
            android:text="模擬多線程下載,進度條數(shù)值緩慢遞增,動畫時間設(shè)為0"
            android:layout_marginTop="5dp"/>
    </LinearLayout>
</RelativeLayout>
最后編輯于
?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請聯(lián)系作者
【社區(qū)內(nèi)容提示】社區(qū)部分內(nèi)容疑似由AI輔助生成,瀏覽時請結(jié)合常識與多方信息審慎甄別。
平臺聲明:文章內(nèi)容(如有圖片或視頻亦包括在內(nèi))由作者上傳并發(fā)布,文章內(nèi)容僅代表作者本人觀點,簡書系信息發(fā)布平臺,僅提供信息存儲服務(wù)。

相關(guān)閱讀更多精彩內(nèi)容

友情鏈接更多精彩內(nèi)容