pub package

用于数字或字符串文本之间动画的简单小部件。适用于数字递增/递减动画、货币值动画或字符串内容更改动画。

特点

  • 类似于简单的文本小部件。
  • 使用 AnimatedNumberText 在数字(整数或浮点数)之间进行动画。
  • 使用 AnimatedStringText 在字符串之间进行动画,它将分别插值每个字符。
  • 支持 TextStyle 动画。
  • 可以将其视为 Flutter 的内置动画小部件,如 AnimatedOpacity、AnimatedAlign 等,但用于文本。

入门

  • 首先导入它
import 'package:animated_text_lerp/animated_text_lerp.dart';

用法

AnimatedNumberText

该小部件支持在数值之间进行插值。只需使用当前值调用 setState,小部件就会开始动画到该值。

AnimatedNumberText(
  value, // int or double
  curve: Curves.easeIn,
  duration: const Duration(seconds: 1),
  style: const TextStyle(fontSize: 30),
  formatter: (value) {
    final formatted =
    intl.NumberFormat.currency(locale: "en").format(value);
    return formatted;
  },
)

AnimatedStringText

该小部件支持在字符串值之间进行插值。只需使用当前值调用 setState,小部件就会开始动画到该值。每个字符将分别插值到新的对应字符。

AnimatedStringText(
  value, // string
  curve: Curves.easeIn,
  duration: const Duration(seconds: 1),
  style: const TextStyle(fontSize: 30),
)

GitHub

查看 Github