Digital change animation

Usage

const numberAnimation = require('js-number-animation');

import NumberAnimation from 'js-number-animation';

// use

const numAmt = new NumberAnimation({
  begin = 100;
  during = 300;
})

numAmt.change(function(value) {
  console.log(value);
})

numAmt.finally(function(obj) {

})

numAmt.start(200);

description

NumberAnimation config

|name|description|default|type| |-|-|-|-| |begin|begin number|0|number| |during|during time|300(ms)|number| |step|Variable Delta|'auto'|'auto'/number| |decimals|decimal digit|-|number|

methods

numberAnimation.onChange(fn: Function) // Triggered on change

numberAnimation.setBegin(num: number) // Set begin number

numberAnimation.getValue() // Get current end value

numberAnimation.finally(obj: NumberAnimation) // Trigger at end

numberAnimation.start(num: number) // Specify the end value and execute the method

tips

• ~~Value must be an integer~~

• We have calculated the optimal configuration based on the value,Unnecessary, don't customize step

• At the end, the start of the object is the end value, which can be called in a chain.

var numberAnimation = new NumberAnimation();
numberAnimation.onChange(v => console.log(v));
numberAnimation.finally(obj => {
  let value = obj.getValue();
  if (value < 1000) {
    obj.start(value += 100);
  }
})
numberAnimation.start(100);

Historical version

• v1.0.0:

  • Basic version

• v1.1.0:

  • Solve known problems
  • Supports negative numbers and decimals