第一次写文，请多指教，有何问题及改进建议都可以告诉我-.-
Idea来自金山词霸App的单词计数，下面先放图
autoNumber.gif
如上图，就是，下面开始进入自己设置View
自己设置View步骤
1. 自己设置属性
2. 生成构造方法
3. onMeasure(可选)
4. onSizeChanged(可选)
5. onLayout(可选)
6. onDraw
我这里只重写了onSizeChanged，onMeasure和onLayout没有重写
1.自己设置属性
values里面新建attrs //变化速度 //边框颜色 //数字颜色
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)
