动态图标

Flutter 动态图标

Flutter

图标列表

  • 勾选
  • 失败
  • 警报
  • 上升趋势
  • 下降趋势
  • search
  • message
  • 加号
  • 下载
  • 菜单
  • 蓝牙

⚡ 安装

dependencies:
  animated_icons: ^<latest_version>

? GIF

? 用法

  1. 设置动画

class _FooClassState extends State<FooClass> with SingleTickerProviderStateMixin {

  late AnimationController _animationController;
  late Animation<double> _animation;

  @override
  void initState()  {
    _animationController = AnimationController(vsync: this, duration: const Duration(milliseconds: 700));
    _animation = Tween<double>(begin: 0, end: 1).animate(CurvedAnimation(parent: _animationController, curve: Curves.easeInOutCirc));
    super.initState();
  }

  void _showIcon() {
    _animationController.forward();
  }
  
  ...
  1. 添加小部件

IconAnimated(
  color: Colors.green,
  progress: _animation,
  size: 100,
  iconType: IconType.check,
),
  1. 触发小部件动画

_showIcon()

/// If you want to do the reverse
/// do this
/// _animationController.reverse();

?注意

此包可用于商业用途。我们将在每次更新时添加新图标。如果您需要任何图标，请通过电子邮件发送 png 或 svg 图标到 [email protected] 或 Git Issue。

GitHub

查看 Github