仿IOS圆形下载进度条

/**
 * Created by C058 on 2016/5/25.
 */
public class MyHoriztalProgressBar extends ProgressBar {

    private static final int DEFAULT_REACH_COLOR = 0xff24F569;
    private static final int DEFAULT_UNREACH_COLOR = 0xffC0C0C0;
    private static final int DEFAULT_REACH_HEIGHT = 1;
    private static final int DEFAULT_UNREACH_HEIGHT = 2;
    private static final int DEFAULT_TEXT_COLOR = DEFAULT_REACH_COLOR;
    private static final int DEFAULT_TEXT_SIZE = 12;
    private static final int DEFAULT_TEXT_OFFSET = 5;

    protected int mReachColor = DEFAULT_REACH_COLOR;
    protected int mUnReachColor = DEFAULT_UNREACH_COLOR;
    protected int mReachHeight = dp2px(DEFAULT_REACH_HEIGHT);
    protected int mUnReachHeight = dp2px(DEFAULT_UNREACH_HEIGHT);
    protected int mTextColor = DEFAULT_TEXT_COLOR;
    protected int mTextSize = sp2px(DEFAULT_TEXT_SIZE);
    protected int mTextOffset = dp2px(DEFAULT_TEXT_OFFSET);

    protected Paint mPaint = new Paint();
    private int mRealWidth;

    public MyHoriztalProgressBar(Context context) {
        this(context, null);
    }

    public MyHoriztalProgressBar(Context context, AttributeSet attrs) {
        this(context, attrs, 0);
    }

    public MyHoriztalProgressBar(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        TypedArray ta = getContext().obtainStyledAttributes(attrs, R.styleable.MyHoriztalProgressBar);
        mReachColor = ta.getColor(R.styleable.MyHoriztalProgressBar_progressbar_reach_color, mReachColor);
        mUnReachColor = ta.getColor(R.styleable.MyHoriztalProgressBar_progressbar_unreach_color, mUnReachColor);
        mReachHeight = (int) ta.getDimension(R.styleable.MyHoriztalProgressBar_progressbar_reach_height, mReachHeight);
        mUnReachHeight = (int) ta.getDimension(R.styleable.MyHoriztalProgressBar_progressbar_unreach_height, mUnReachHeight);
        mTextColor = ta.getColor(R.styleable.MyHoriztalProgressBar_progressbar_text_color, mTextColor);
        mTextSize = (int) ta.getDimension(R.styleable.MyHoriztalProgressBar_progressbar_text_size, mTextSize);
        mTextOffset = (int) ta.getDimension(R.styleable.MyHoriztalProgressBar_progressbar_text_offset, mTextOffset);
        ta.recycle();
        mPaint.setTextSize(mTextSize);
    }

    @Override
    protected synchronized void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        int widthVal = MeasureSpec.getSize(widthMeasureSpec);
        int heightVal = measureHeight(heightMeasureSpec);

        setMeasuredDimension(widthVal, heightVal);
        mRealWidth = getMeasuredWidth() - getPaddingLeft() - getPaddingRight();
    }

    @Override
    protected synchronized void onDraw(Canvas canvas) {
        //draw reachBar
        String text = getProgress() + "%";
        int textWidth = (int) mPaint.measureText(text);
        boolean noNeedUnrechBar = false;

        canvas.save();
        canvas.translate(getPaddingLeft(), getMeasuredHeight() / 2);
        float radio = getProgress() * 1.0f / getMax();
        float progressX = mRealWidth * radio;
        if (progressX + textWidth > mRealWidth) {
            progressX = mRealWidth - textWidth;
            noNeedUnrechBar = true;
        }
        //draw reachbar
        mPaint.setColor(mReachColor);
        mPaint.setStrokeWidth(mReachHeight);
        float endX = progressX - mTextOffset / 2;
        canvas.drawLine(0, 0, endX, 0, mPaint);
        //draw text
        mPaint.setColor(mTextColor);
        float y = -(mPaint.descent() + mPaint.ascent())/2;
        canvas.drawText(text, progressX,y, mPaint);
        //draw unreachbar
        if (!noNeedUnrechBar) {
            mPaint.setColor(mUnReachColor);
            mPaint.setStrokeWidth(mUnReachHeight);
            float startX = progressX + textWidth + mTextOffset / 2;
            canvas.drawLine(startX, 0, mRealWidth, 0, mPaint);
        }
        canvas.restore();
    }

    private int measureHeight(int heightMeasureSpec) {
        int mode = MeasureSpec.getMode(heightMeasureSpec);
        int height = MeasureSpec.getSize(heightMeasureSpec);
        int result = 0;
        if (mode == MeasureSpec.EXACTLY||mode == MeasureSpec.UNSPECIFIED) {
            result = height;
        } else if (mode == MeasureSpec.AT_MOST) {
            int textHeight = (int) (mPaint.descent() - mPaint.ascent());
            result = getPaddingTop() + getPaddingBottom() + Math.max(Math.max(mReachHeight, mUnReachHeight), textHeight);
//            {
//                result = Math.min(result, height);
//            }
        }
        return result;
    }

    protected int dp2px(int dp) {
        return (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, dp, getResources().getDisplayMetrics());
    }

    protected int sp2px(int sp) {
        return (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_SP, sp, getResources().getDisplayMetrics());
    }
}
/**
 * Created by C058 on 2016/5/26.
 * 模仿ios app store应用下载圆形进图条
 */
public class MyRoundProgressBar extends MyHoriztalProgressBar {

    private static final int DEFAULT_PROGRESS_RADIUS = 30;
    private int mRadius = dp2px(DEFAULT_PROGRESS_RADIUS);
    private int mInRadius;
    private RectF mRectf, mInRectf;

    public MyRoundProgressBar(Context context) {
        this(context, null);
    }

    public MyRoundProgressBar(Context context, AttributeSet attrs) {
        this(context, attrs, 0);
    }

    public MyRoundProgressBar(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        TypedArray ta = getContext().obtainStyledAttributes(attrs, R.styleable.MyRoundProgressBar);
        mRadius = (int) ta.getDimension(R.styleable.MyRoundProgressBar_progressbar_radius, mRadius);
        ta.recycle();

        mReachHeight = mUnReachHeight * 2;
        mPaint.setAntiAlias(true);//抗锯齿
        mPaint.setDither(true); //防抖动模式
        mPaint.setStyle(Paint.Style.STROKE);//画笔风格设置为空心
        mPaint.setStrokeCap(Paint.Cap.ROUND);
    }

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

        int diameter = mRadius * 2 + getPaddingLeft() + getPaddingRight() + mUnReachHeight * 2; //控件宽度 默认四个padding一致
        int width = resolveSize(diameter, widthMeasureSpec);
        int height = resolveSize(diameter, heightMeasureSpec);
        int realWidth = Math.min(width, height);//当宽高设置不一致,取小的那个
        //外圆的半径
        mRadius = (realWidth - getPaddingLeft() - getPaddingRight() - mUnReachHeight) / 2;
        mRectf = new RectF(0, 0, mRadius * 2, mRadius * 2);
        //内圆的半径
        mInRadius = mRadius - mUnReachHeight;
        mInRectf = new RectF(0, 0, mInRadius * 2, mInRadius * 2);
        setMeasuredDimension(realWidth, realWidth);
    }

    @Override
    protected synchronized void onDraw(Canvas canvas) {

        canvas.save();
        canvas.translate(getPaddingLeft(), getPaddingTop());
        //draw unreachbar
        mPaint.setColor(mUnReachColor);
        mPaint.setStrokeWidth(mUnReachHeight);
        //从圆点开始画圆
//        canvas.drawCircle(mRadius, mRadius, mRadius, mPaint);
        //draw reachbar
        //将画布移动到画内圆的位置
        canvas.translate(mUnReachHeight, mUnReachHeight);
        mPaint.setColor(mReachColor);
        mPaint.setStrokeWidth(mReachHeight);
        float sweepAngle = getProgress() * 1.0f / getMax() * 360;
        canvas.drawArc(mInRectf, -90, sweepAngle, false, mPaint);
//        //draw text
//        String text = getProgress() + "%";
//        int textWidth = (int) mPaint.measureText(text);
//        int textHeight = (int) ((mPaint.descent() + mPaint.ascent()) / 2);
//        mPaint.setColor(mTextColor);
//        canvas.drawText(text, mRadius - textWidth / 2, mRadius - textHeight, mPaint);
        canvas.restore();
    }
}
    <declare-styleable name="MyHoriztalProgressBar">
        <attr name="progressbar_reach_color" format="color" />
        <attr name="progressbar_unreach_color" format="color" />
        <attr name="progressbar_reach_height" format="dimension" />
        <attr name="progressbar_unreach_height" format="dimension" />
        <attr name="progressbar_text_color" format="color" />
        <attr name="progressbar_text_size" format="dimension" />
        <attr name="progressbar_text_offset" format="dimension" />
    </declare-styleable>
    <declare-styleable name="MyRoundProgressBar">
        <attr name="progressbar_radius" format="dimension" />
    </declare-styleable>
    <declare-styleable name="MyHoriztalProgressBar2">
        <attr name="reach_color" format="color" />
        <attr name="unreach_color" format="color" />
        <attr name="progressbar_height" format="dimension" />
    </declare-styleable>
 new Timer().schedule(new TimerTask() {
    int currentIndex = (int) Math.floor(current * 100 / total);
    int sumIndex = 0;

    @Override
    public void run() {
        if (currentIndex > sumIndex) {
            sumIndex = currentIndex;
            LogHelp.i("polyv", "current:" + current + "-------total:" + total + "-------currentIndex:" + currentIndex);
            holder.videoList_progress.setProgress(sumIndex);
        }
    }
}, 200, 200);
时间: 2024-08-23 04:22:00

仿IOS圆形下载进度条的相关文章

仿苹果AppStore 下载进度条

以前项目自己写的 ,一个模仿苹果AppStore 下载进度条的winfrom用户控件,GDI绘制.效果如图 1 using System.Drawing; 2 using System.Windows.Forms; 3 using System.ComponentModel; 4 namespace test 5 { 6 public class CircleProgressBar : Control 7 { 8 float _progress = 0F; 9 float _Wpen = 1;

关情纸尾-----Quartz2D绘制圆形下载进度条,饼图

绘制下载进度条 1.搭建界面. 2.拖动滑竿的时候让他里面的能够跟着我的拖动,数字在改变. 数字改变时有一个注意点, 就是要显示%,它是一个特殊的符号,要用两个%%代表一个% 3.拖动滑竿的时候就是在上面画弧. 从最上面,按顺时针画,所以,它的起始角度是-90度.结束角度也是-90度 也是从起始角度开始画, 起始角度-90度, 看你下载进度是多少 假如说你下载进度是100,就是1 * 360度 也就是说这个进度占你360度多少分之一 CGContextRef ctx = UIGraphicsGe

在DrawingVisual上绘制圆形的进度条,类似于IOS系统风格。

1.说明:在WPF中,文件下载时需要显示下载进度,由于系统自带的条型进度条比较占用空间,改用圆形的进度条,需要在DrawingVisual上呈现. 运行的效果如图: private Point GetPointOnCir(Point CenterPoint, double r, double angel) { Point p = new Point(); p.X = Math.Sin(angel * Math.PI / 180) * r + CenterPoint.X; p.Y = Center

Andorid自定义圆形渐变色进度条的从实现到开源

信自己也是一种信仰. 写在前面的话 3月初我在自定义控件概述中挖下的几个坑,前一段时间已经基本填完了,自定义控件的几种实现方式也分别写了demo来进行说明.今天我们来聊一聊如何把自己封装一个圆形渐变色进度条控件开源到github,并且上传到jcenter方便别人远程依赖.先看下效果图: 连接github并提交新项目 前提条件: 安装Git客户端(下载地址) 有GitHub账号 创建新项目并提交到Github: 在AndroidStudio中新建一个项目 配置Git:Settings -> Ver

Xamarin iOS教程之进度条和滚动视图

Xamarin iOS教程之进度条和滚动视图 Xamarin iOS 进度条 进度条可以看到每一项任务现在的状态.例如在下载的应用程序中有进度条,用户可以很方便的看到当前程序下载了多少,还剩下多少.QQ音乐播放器中也使用到了进度条,它可以让用户看到当前音乐播放了多少,还剩多少等.在Xamarin.iOS中也提供实现进度条的类,即UIProgressView. [示例2-23]以下将实现进度条加载的效果.具体步骤如下: (1)创建一个Single View Application类型的工程,命名为

Flex 4.6 下载进度条 IPreLoaderDisplay生命周期

Flex4.6 程序的主类实际上为SystemManager的子类.SystemManager会创建Preloader对象,然后调用PreLoader对象的initialize方法,该方法有如下签名  public function initialize(showDisplay:Boolean,                                 displayClassName:Class,                                backgroundColo

关情纸尾-----Quartz2D绘制下载进度条,饼图

绘制下载进度条 1.搭建界面. 2.拖动滑竿的时候让他里面的能够跟着我的拖动,数字在改变. 数字改变时有一个注意点, 就是要显示%,它是一个特殊的符号,要用两个%%代表一个% 3.拖动滑竿的时候就是在上面画弧. 从最上面,按顺时针画,所以,它的起始角度是-90度.结束角度也是-90度 也是从起始角度开始画, 起始角度-90度, 看你下载进度是多少 假如说你下载进度是100,就是1 * 360度 也就是说这个进度占你360度多少分之一 CGContextRef ctx = UIGraphicsGe

如何实现圆形的进度条(ProgressBar)

在我们实际的工作中可能经常使用到圆形的进度条,但是这是怎么实现的呢?其实这只不过是修改了一下ProgressBar的模板,我们在下面的代码中我们将ProgressBar的Value值绑定到Border的Background上面,并且使用了一个ValueToProcessConverter的转换器进行相应地转换,这里重点介绍一下这个转换器 <ProgressBar Name="pb" Minimum="0" Maximum="100" >

用 CALayer 定制下载进度条控件

// // RPProgressView.h // CALayer定制下载进度条控件 // // Created by RinpeChen on 16/1/2. // Copyright © 2016年 rinpe. All rights reserved. // #import <UIKit/UIKit.h> @interface RPProgressView : UIView @property (nonatomic, assign) CGFloat progressValue; // 进