简单的圆形下载进度条

Posted 摘星猿

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了简单的圆形下载进度条相关的知识,希望对你有一定的参考价值。

  1. 上截图
  2. 代码片段
    package org.zhx.rounprogress;
    
    
    import android.content.Context;
    import android.content.res.TypedArray;
    import android.graphics.Canvas;
    import android.graphics.Color;
    import android.graphics.Paint;
    import android.graphics.Path;
    import android.graphics.PathMeasure;
    import android.graphics.RectF;
    import android.graphics.Typeface;
    import android.util.AttributeSet;
    import android.util.Log;
    import android.view.View;
    
    /*
     * -----------------------------------------------------------------
     * Copyright (C) 2018-2020, by vogtec, All rights reserved.
     * -----------------------------------------------------------------
     * File: RoundProgress.java
     * Author: zhouxue
     * Version: 1.0
     * Create: 2018/5/25 14:23
     * Changes (from 2018/5/25)
     * -----------------------------------------------------------------
     * 2018/5/25 : Create RoundProgress.java (zhouxue);
     * -----------------------------------------------------------------
     */
    public class RoundProgress extends View 
        private String TAG=RoundProgress.class.getSimpleName();
        /**
         * 画笔对象的引用
         */
        private Paint paint;
    
        /**
         * 圆环的颜色
         */
        private int roundColor;
    
        /**
         * 圆环进度的颜色
         */
        private int roundProgressColor;
    
        /**
         * 中间进度百分比的字符串的颜色
         */
        private int textColor;
    
        /**
         * 中间进度百分比的字符串的字体
         */
        private float textSize;
    
        /**
         * 圆环的宽度
         */
        private float roundWidth;
    
        /**
         * 最大进度
         */
        private int max;
    
        /**
         * 当前进度
         */
        private int progress;
        /**
         * 是否显示中间的进度
         */
        private boolean textIsDisplayable;
    
        /**
         * 进度的风格,实心或者空心
         */
        private int style;
    
        public static final int STROKE = 0;
        public static final int FILL = 1;
    
        public RoundProgress(Context context) 
            this(context, null);
        
    
        public RoundProgress(Context context, AttributeSet attrs) 
            this(context, attrs, 0);
        
    
        public RoundProgress(Context context, AttributeSet attrs, int defStyle) 
            super(context, attrs, defStyle);
    
            paint = new Paint();
    
    
            TypedArray mTypedArray = context.obtainStyledAttributes(attrs,
                    R.styleable.RoundProgressBar);
    
            //获取自定义属性和默认值 (可以在xml 文件里 进行配置)
            roundColor = mTypedArray.getColor(R.styleable.RoundProgressBar_roundColor, Color.RED);
            roundProgressColor = mTypedArray.getColor(R.styleable.RoundProgressBar_roundProgressColor, Color.GREEN);
            textColor = mTypedArray.getColor(R.styleable.RoundProgressBar_roundtextColor, Color.GREEN);
            textSize = mTypedArray.getDimension(R.styleable.RoundProgressBar_roundtextSize, 15);
            roundWidth = mTypedArray.getDimension(R.styleable.RoundProgressBar_roundWidth, 5);
            max = mTypedArray.getInteger(R.styleable.RoundProgressBar_max, 100);
            textIsDisplayable = mTypedArray.getBoolean(R.styleable.RoundProgressBar_textIsDisplayable, true);
            style = mTypedArray.getInt(R.styleable.RoundProgressBar_style, 0);
    
            mTypedArray.recycle();
        
    
        @Override
        protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) 
            super.onMeasure(widthMeasureSpec, heightMeasureSpec);
        
    
        @Override
        protected void onDraw(Canvas canvas) 
            super.onDraw(canvas);
    
            /**
             * 画最外层的大圆环
             */
            int centre = getWidth()/2; //获取圆心的x坐标
            float dotWidth=4+roundWidth;// 圆弧上小圆点的半径
            int radius = (int) (centre - roundWidth/2-dotWidth); //圆环的半径
            paint.setColor(roundColor); //设置圆环的颜色
            paint.setStyle(Paint.Style.STROKE); //设置空心
            paint.setStrokeWidth(roundWidth); //设置圆环的宽度
            paint.setAntiAlias(true);  //消除锯齿
            canvas.drawCircle(centre, centre, radius, paint); //画出圆环
            /**
             * 画进度百分比
             */
            paint.setStrokeWidth(0);
            paint.setColor(textColor);
            paint.setTextSize(textSize);
            paint.setTypeface(Typeface.DEFAULT_BOLD); //设置字体
    
    
            int percent = (int)(((float)progress / (float)max) * 100);  //中间的进度百分比,先转换成float在进行除法运算,不然都为0
            float textWidth = paint.measureText(percent + "%");   //测量字体宽度,我们需要根据字体的宽度设置在圆环中间
    //        Log.e("log", centre + "@@"+percent+"!!!"+(textIsDisplayable +"!"+(percent != 0) +(style == STROKE)));
            if(textIsDisplayable && percent != 0 && style == STROKE)
                canvas.drawText(percent + "%", centre - textWidth / 2, centre + textSize/2, paint); //画出进度百分比
            
    
    
            /**
             * 画圆弧 ,画圆环的进度
             */
    
            //设置进度是实心还是空心
            paint.setStrokeWidth(roundWidth); //设置圆环的宽度
            paint.setColor(roundProgressColor);  //设置进度的颜色
            RectF oval = new RectF(centre - radius, centre - radius, centre
                    + radius, centre + radius);  //用于定义的圆弧的形状和大小的界限
    
            switch (style) 
                case STROKE:
                    paint.setStyle(Paint.Style.STROKE);
                    canvas.drawArc(oval, 0, 360 * progress / max, false, paint);  //根据进度画圆弧
                    break;
                
                case FILL:
                    paint.setStyle(Paint.Style.FILL_AND_STROKE);
                    if(progress !=0)
                        canvas.drawArc(oval, 0, 360 * progress / max, true, paint);  //根据进度画圆弧
                    break;
                
            
            // 圆弧上的小圆点
            if(progress<max) 
                paint.setStyle(Paint.Style.FILL);
                //计算当前进度 在圆弧上的位置
                Path path = new Path();
                path.addArc(oval, 0, 360 * progress / max);
                PathMeasure measure = new PathMeasure(path, false);
                float[] floats = new float[2];
                measure.getPosTan(measure.getLength(), floats, null);
    
                //在当前进度末端 加上一个小圆点
    //            Log.e("!!!!!!!", floats[0] + "@@" + floats[1]);
                canvas.drawCircle(floats[0], floats[1], dotWidth,
                        paint);
            
        
    
    
        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)
                progress=0;
            
            if(progress > max)
                progress = max;
            
            if(progress <= max)
                this.progress = progress;
                Log.e(TAG, progress + "");
                postInvalidate();
            
    
        
    
    
        public int getCricleColor() 
            return roundColor;
        
    
        public void setCricleColor(int cricleColor) 
            this.roundColor = cricleColor;
        
    
        public int getCricleProgressColor() 
            return roundProgressColor;
        
    
        public void setCricleProgressColor(int cricleProgressColor) 
            this.roundProgressColor = cricleProgressColor;
        
    
        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 getRoundWidth() 
            return roundWidth;
        
    
        public void setRoundWidth(float roundWidth) 
            this.roundWidth = roundWidth;
        
    
    
    
    
    

    4、下载demo 地址 https://github.com/zhoulinxue/RounProgress.git

 

 

 

以上是关于简单的圆形下载进度条的主要内容,如果未能解决你的问题,请参考以下文章

简单的圆形下载进度条

Android自定义view之圆形进度条

首页2--动态自定义圆形进度条

异步下载圆形进度条显示进度

圆形进度条:简单实现倒计时圆形进度条

仿IOS圆形下载进度条