Android自己设置View之数字自动增长

第一次写文，请多指教，有何问题及改进建议都可以告诉我-.-

Idea来自金山词霸App的单词计数，下面先放图

autoNumber.gif

如上图，就是，下面开始进入自己设置View

自己设置View步骤

1. 自己设置属性

2. 生成构造方法

3. onMeasure（可选）

4. onSizeChanged（可选）

5. onLayout（可选）

6. onDraw

我这里只重写了onSizeChanged，onMeasure和onLayout没有重写

1.自己设置属性

values里面新建attrs

<resources>    <declare-styleable name="AutoNumberView">        //变化速度        <attr name="auto_speed" format="integer"/>        //边框颜色        <attr name="stroke_color" format="color"/>        //数字颜色        <attr name="text_color" format="color"/>    </declare-styleable></resources>

2.生成构造方法

    public AutoNumberView(Context context) {        super(context);    }    public AutoNumberView(Context context, @Nullable AttributeSet attrs) {        super(context, attrs);        //自己设置属性        TypedArray typedArray = context.obtainStyledAttributes(attrs, R.styleable.AutoNumberView);        strokeColor = typedArray.getColor(R.styleable.AutoNumberView_stroke_color, context.getResources().getColor(R.color.colorPrimaryDark));        autoSpeed = typedArray.getInteger(R.styleable.AutoNumberView_auto_speed, 1000);        textColor = typedArray.getColor(R.styleable.AutoNumberView_text_color, context.getResources().getColor(R.color.black));        typedArray.recycle();        init();        initAnimation();    }

初始化动画和画笔

private void init() {        paint = new Paint();        paint.setColor(strokeColor);        paint.setStyle(Paint.Style.STROKE);        paint.setStrokeWidth(10);        paint.setAntiAlias(true);        textPaint = new Paint();        textPaint.setColor(textColor);        textPaint.setStyle(Paint.Style.STROKE);        textPaint.setTextAlign(Paint.Align.CENTER);        textPaint.setAntiAlias(true);    }    private void initAnimation() {        //根据属性动画值重绘数字        valueAnimator = ValueAnimator.ofFloat(0,1).setDuration(autoSpeed);        valueAnimator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {            @Override            public void onAnimationUpdate(ValueAnimator animation) {                value = (float) animation.getAnimatedValue();                invalidate();            }        });    }

3.onSizeChanged

    @Override    protected void onSizeChanged(int w, int h, int oldw, int oldh) {        super.onSizeChanged(w, h, oldw, oldh);        int min = Math.min(w, h);        //中心点X，Y        centerX = w / 2;        centerY = h / 2;        radius = (int) (min * 0.8f / 2);        textPaint.setTextSize(radius / 2);        //计算数字位于中心点的矩形        targetRect = new Rect(-min / 2, -min / 2, min / 2, min / 2);        Paint.FontMetricsInt fontMetrics = textPaint.getFontMetricsInt();        //中线        baseline = (targetRect.bottom + targetRect.top - fontMetrics.bottom - fontMetrics.top) / 2;    }

4.onDraw

    @Override    protected void onDraw(Canvas canvas) {        //移动中心点        canvas.translate(centerX, centerY);        //边框        canvas.drawCircle(0, 0, radius, paint);        //数字        canvas.drawText(String.valueOf((int)(value * number)), targetRect.centerX(), baseline, textPaint);    }

5.使用方法

public class MainActivity extends AppCompatActivity {    ...    @Override    protected void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.activity_main);        ButterKnife.bind(this);        //设置数值        autoNumberView.get(0).setNumber((int) (Math.random() * 500 + 1000));        autoNumberView.get(1).setNumber((int) (Math.random() * 500 + 1000));        autoNumberView.get(2).setNumber((int) (Math.random() * 500 + 1000));        showLoading.setOnClickListener(new View.OnClickListener() {            @Override            public void onClick(View v) {                //启动                for (AutoNumberView auto : autoNumberView) {                    auto.startAnimation();                }            }        });        numberValue.setOnSeekBarChangeListener(new SeekBar.OnSeekBarChangeListener() {            @Override            public void onProgressChanged(SeekBar seekBar, int progress, boolean fromUser) {                //设置数值                value.setText("设置值:" + progress + "* Math.random() * 1000");                for (AutoNumberView auto : autoNumberView) {                    auto.setNumber((int) ((Math.random() * 1000) * progress));                }            }        });        autoSpeed.setOnSeekBarChangeListener(new SeekBar.OnSeekBarChangeListener() {            @Override            public void onProgressChanged(SeekBar seekBar, int progress, boolean fromUser) {                //设置速度                speed.setText("设置速度:" + progress + "* 100");                for (AutoNumberView auto : autoNumberView) {                    auto.setAutoSpeed(100 * progress);                }            }        });    }}

最后一律代码地址(GitHub – alaidev/AutoNumber)