animated_flip_counter

一个隐式动画小部件,可在提供的角度更改时自动随时间翻转。

用法

它对于显示不断变化的信息非常有用。

动画计数器

像 Flutter 中的任何其他隐式动画组件一样,只需传入一个 value 和一个可选的 durationcurve 即可。

AnimatedFlipCounter(
  duration: Duration(milliseconds: 500),
  value: _value, // pass in a value like 2014
)

小数显示

使用 fractionDigits 指定小数点后显示多少位数字。它也能处理负值。

AnimatedFlipCounter(
  value: _value,
  fractionDigits: 2, // decimal precision
  suffix: "%",
  textStyle: TextStyle(
      fontSize: 40,
      color: _value >= 0 ? Colors.green : Colors.red,
  ),
)

自定义样式

使用熟悉的 TextStyle 参数进行样式设置,并使用 prefixsuffix 添加额外的文本。

AnimatedFlipCounter(
  value: _value,
  prefix: "Level ",
  textStyle: TextStyle(
    fontSize: 80,
    fontWeight: FontWeight.bold,
    letterSpacing: -8.0,
    color: Colors.yellow,
    shadows: [
      BoxShadow(
        color: Colors.orange,
        offset: Offset(8, 8),
        blurRadius: 8,
      ),
    ],
  ),
)

GitHub

https://github.com/h65wang/flutter-animated-counter