Android 自定义View (三) 圆环交替 等待效果

转载请标明出处:

一个朋友今天有这么个需求(下图),我觉得那自定义View来做还是很适合的,就做了下,顺便和大家分享下,,对于自定义View多练没坏处么。如果你看了前两篇,那么这篇一定so easy 。

效果就这样,分析了一下,大概有这几个属性,两个颜色,一个速度,一个圆环的宽度。

还是我们自定View的那几个步骤:

1、自定义View的属性

2、在View的构造方法中获得我们自定义的属性

[3、重写onMesure ]

4、重写onDraw

——————————————————————————————————————-

1、自定义属性:

<?xml version="1.0" encoding="utf-8"?><resources><attr name="firstColor" format="color" /><attr name="secondColor" format="color" /><attr name="circleWidth" format="dimension" /><attr name="speed" format="integer" /><declare-styleable name="CustomProgressBar"><attr name="firstColor" /><attr name="secondColor" /><attr name="circleWidth" /><attr name="speed" /></declare-styleable></resources>2、在View的构造方法中获得我们自定义的属性/** * 第一圈的颜色 */private int mFirstColor;/** * 第二圈的颜色 */private int mSecondColor;/** * 圈的宽度 */private int mCircleWidth;/** * 画笔 */private Paint mPaint;/** * 当前进度 */private int mProgress;/** * 速度 */private int mSpeed;/** * 是否应该开始下一个 */private boolean isNext = false;public CustomProgressBar(Context context, AttributeSet attrs){this(context, attrs, 0);}public CustomProgressBar(Context context){this(context, null);}/** * 必要的初始化,获得一些自定义的值 * * @param context * @param attrs * @param defStyle */public CustomProgressBar(Context context, AttributeSet attrs, int defStyle){super(context, attrs, defStyle);TypedArray a = context.getTheme().obtainStyledAttributes(attrs, R.styleable.CustomProgressBar, defStyle, 0);int n = a.getIndexCount();for (int i = 0; i < n; i++){int attr = a.getIndex(i);switch (attr){case R.styleable.CustomProgressBar_firstColor:mFirstColor = a.getColor(attr, Color.GREEN);break;case R.styleable.CustomProgressBar_secondColor:mSecondColor = a.getColor(attr, Color.RED);break;case R.styleable.CustomProgressBar_circleWidth:mCircleWidth = a.getDimensionPixelSize(attr, (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_PX, 20, getResources().getDisplayMetrics()));break;case R.styleable.CustomProgressBar_speed:mSpeed = a.getInt(attr, 20);// 默认20break;}}a.recycle();mPaint = new Paint();// 绘图线程new Thread(){public void run(){while (true){mProgress++;if (mProgress == 360){mProgress = 0;if (!isNext)isNext = true;elseisNext = false;}postInvalidate();try{Thread.sleep(mSpeed);} catch (InterruptedException e){e.printStackTrace();}}};}.start();}3、直接重写onDraw,这不需要重写onMeasure@Overrideprotected void onDraw(Canvas canvas){int centre = getWidth() / 2; // 获取圆心的x坐标int radius = centre – mCircleWidth / 2;// 半径mPaint.setStrokeWidth(mCircleWidth); // 设置圆环的宽度mPaint.setAntiAlias(true); // 消除锯齿mPaint.setStyle(Paint.Style.STROKE); // 设置空心RectF oval = new RectF(centre – radius, centre – radius, centre + radius, centre + radius); // 用于定义的圆弧的形状和大小的界限if (!isNext){// 第一颜色的圈完整,第二颜色跑mPaint.setColor(mFirstColor); // 设置圆环的颜色canvas.drawCircle(centre, centre, radius, mPaint); // 画出圆环mPaint.setColor(mSecondColor); // 设置圆环的颜色canvas.drawArc(oval, -90, mProgress, false, mPaint); // 根据进度画圆弧} else{mPaint.setColor(mSecondColor); // 设置圆环的颜色canvas.drawCircle(centre, centre, radius, mPaint); // 画出圆环mPaint.setColor(mFirstColor); // 设置圆环的颜色canvas.drawArc(oval, -90, mProgress, false, mPaint); // 根据进度画圆弧}}大功完成了,当然了,唯一比较纠结的地方就是两个颜色何时切换,如何切换,我采用上面的办法,你也可以自己想想怎么实现。

好了,各位看官留个言,顶一个吧~

源码点击下载

你所缺少的部分,也早已被我用想像的画笔填满。

Android 自定义View (三) 圆环交替 等待效果

相关文章:

你感兴趣的文章:

标签云: