package com.example.wireframe;import android.content.Context;import android.graphics.Canvas;import android.graphics.Paint;import android.graphics.Paint.Align;import android.graphics.Rect;import android.graphics.RectF;import android.util.AttributeSet;import android.util.Log;import android.view.View;import android.view.animation.Animation;import android.view.animation.Transformation;/* * 1.该view在设置属性之后时候会有数字和圆圈不断增长的效果 * 2.该view在按下和放开状态下显示不同的样式。 */public class CircleBar extends View {    private static final String TAG = "cn.netmoon.netmoondevicemanager.widget.CircleBar";    private RectF mColorWheelRectangle = new RectF();// 圆圈的矩形范围    private Paint mDefaultWheelPaint; // 绘制底部灰色圆圈的画笔    private Paint mColorWheelPaint;// 绘制蓝色扇形的画笔    private Paint textPaint; // 中间文字的画笔    private float mColorWheelRadius;// 圆圈普通状态下的半径    private float circleStrokeWidth;// 圆圈的线条粗细    private float pressExtraStrokeWidth;// 按下状态下增加的圆圈线条增加的粗细    private String mText;// 中间文字内容    private int mCount; // 为了达到数字增加效果而添加的变量，他和mText其实代表一个意思    private float mSweepAnglePer;// 为了达到蓝色扇形增加效果而添加的变量，他和mSweepAngle其实代表一个意思    private float mSweepAngle;// 扇形弧度    private int mTextSize;// 文字颜色    BarAnimation anim;// 动画类    public CircleBar(Context context) {        super(context);        init(null, 0);    }    public CircleBar(Context context, AttributeSet attrs) {        super(context, attrs);        init(attrs, 0);    }    public CircleBar(Context context, AttributeSet attrs, int defStyle) {        super(context, attrs, defStyle);        init(attrs, defStyle);    }    private void init(AttributeSet attrs, int defStyle) {        circleStrokeWidth = dip2px(getContext(), 10);        pressExtraStrokeWidth = dip2px(getContext(), 2);        // 构造方法调用之后，第一个调用的是init方法，在该方法        // 中初始化了各种画笔的颜色，风格等，字体大小和线条        // 粗细则使用了我自己定义的工具函数dip2px()，这样做的        // 目的是在不同分辨率的手机上，相同数值的最终显示效果        // 差别不大，比如字体大小mTextSize的初始化：        mTextSize = dip2px(getContext(), 40);        mColorWheelPaint = new Paint(Paint.ANTI_ALIAS_FLAG);        mColorWheelPaint.setColor(0xFF29a6f6);        mColorWheelPaint.setStyle(Paint.Style.STROKE);        mColorWheelPaint.setStrokeWidth(circleStrokeWidth);        mDefaultWheelPaint = new Paint(Paint.ANTI_ALIAS_FLAG);        mDefaultWheelPaint.setColor(0xFFeeefef);        mDefaultWheelPaint.setStyle(Paint.Style.STROKE);        mDefaultWheelPaint.setStrokeWidth(circleStrokeWidth);        textPaint = new Paint(Paint.ANTI_ALIAS_FLAG | Paint.LINEAR_TEXT_FLAG);        textPaint.setColor(0xFF333333);        textPaint.setStyle(Paint.Style.FILL_AND_STROKE);        textPaint.setTextAlign(Align.LEFT);        textPaint.setTextSize(mTextSize);        mText = "0";        mSweepAngle = 0;        anim = new BarAnimation();        anim.setDuration(2000);    }    @Override    protected void onDraw(Canvas canvas) {        canvas.drawArc(mColorWheelRectangle, -90, 360, false,                mDefaultWheelPaint);        // 在onDraw方法中我们绘制了圆圈、扇形以及文字，        // 但是绘制需要用到的一些坐标值是经过计算得出的，比如绘制扇形：        canvas.drawArc(mColorWheelRectangle, -90, mSweepAnglePer, false,                mColorWheelPaint);        Rect bounds = new Rect();        String textstr = mCount + "";        textPaint.getTextBounds(textstr, 0, textstr.length(), bounds);        canvas.drawText(textstr + "", (mColorWheelRectangle.centerX())                - (textPaint.measureText(textstr) / 2),                mColorWheelRectangle.centerY() + bounds.height() / 2, textPaint);    }    // mColorWheelRectangle是一个矩形，    // 这个矩形的上下左右边界都是在onMeasure方法中根据控件所分配的大小得出来的。    @Override    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {        int height = getDefaultSize(getSuggestedMinimumHeight(),                heightMeasureSpec);        int width = getDefaultSize(getSuggestedMinimumWidth(), widthMeasureSpec);        int min = Math.min(width, height);        setMeasuredDimension(min, min);        mColorWheelRadius = min - circleStrokeWidth - pressExtraStrokeWidth;        mColorWheelRectangle.set(circleStrokeWidth + pressExtraStrokeWidth,                circleStrokeWidth + pressExtraStrokeWidth, mColorWheelRadius,                mColorWheelRadius);    }    @Override    public void setPressed(boolean pressed) {        Log.i(TAG, "call setPressed ");        if (pressed) {            mColorWheelPaint.setColor(0xFF165da6);            textPaint.setColor(0xFF070707);            mColorWheelPaint.setStrokeWidth(circleStrokeWidth                    + pressExtraStrokeWidth);            mDefaultWheelPaint.setStrokeWidth(circleStrokeWidth                    + pressExtraStrokeWidth);            textPaint.setTextSize(mTextSize - pressExtraStrokeWidth);        } else {            mColorWheelPaint.setColor(0xFF29a6f6);            textPaint.setColor(0xFF333333);            mColorWheelPaint.setStrokeWidth(circleStrokeWidth);            mDefaultWheelPaint.setStrokeWidth(circleStrokeWidth);            textPaint.setTextSize(mTextSize);        }        super.setPressed(pressed);        this.invalidate();    }    public void startCustomAnimation() {        this.startAnimation(anim);    }    public void setText(String text) {        mText = text;        this.startAnimation(anim);    }    public void setSweepAngle(float sweepAngle) {        mSweepAngle = sweepAngle;    }    public class BarAnimation extends Animation {        /**         * Initializes expand collapse animation, has two types, collapse (1)         * and expand (0).         *          * @param view         *            The view to animate         * @param type         *            The type of animation: 0 will expand from gone and 0 size         *            to visible and layout size defined in xml. 1 will collapse         *            view and set to gone         */        public BarAnimation() {}        @Override        protected void applyTransformation(float interpolatedTime,                Transformation t) {            super.applyTransformation(interpolatedTime, t);            // 这个动画类利用了applyTransformation参数中            // 的interpolatedTime参数(从0到1)的变化特点，实现            // 了该View的某个属性随时间改变而改变。原理是在每            // 次系统调用animation的applyTransformation()方法时，            // 改变mSweepAnglePer，mCount的值，然后调用postInvalidate()不停的绘制view。            if (interpolatedTime < 1.0f) {                mSweepAnglePer = interpolatedTime * mSweepAngle;                mCount = (int) (interpolatedTime * Float.parseFloat(mText));            } else {                // mSweepAnglePer，mCount这两个属性只是动画过程中要用到的临时属性，                // mText和mSweepAngle才是动画结束之后表示扇形弧度和中间数值的真实值。                mSweepAnglePer = mSweepAngle;                mCount = Integer.parseInt(mText);            }            postInvalidate();        }    }    public static int dip2px(Context context, float dipValue) {        final float scale = context.getResources().getDisplayMetrics().density;        return (int) (dipValue * scale + 0.5f);    }}