Flutter-更改打开（白色）和关闭（红色）的动画图标颜色

Question

我在我的应用程序中使用动画图标来打开和关闭侧边菜单。我需要将关闭图标颜色更改为红色，打开图标颜色将变为白色。

AnimatedIcon(
   progress: _animationController.view,
   icon: menuClose,
   color: menuIconColor, >need to apply condition here
   size: 25.sp,
)

按钮的完整代码如下

Align(
    alignment: Alignment(0, .99),
    child: GestureDetector(
      onTap: () {
        onIconPressed();
      },
      child: ClipRRect(
        borderRadius: BorderRadius.circular(80),
        child: Container(
          width: 50.w,
          height: 45.h,
          color: colorAnimatedButton,
          alignment: Alignment.center,
          child: AnimatedIcon(
            progress: _animationController.view,
            icon: menuClose,
            color: iconColor,
            size: 25.sp,
          ),
        ),
      ),
    ),
  )

Answer 1

尝试使用此代码，我使用了 null 安全 sdk。

class AnimIconTest extends StatefulWidget {
  const AnimIconTest({Key? key}) : super(key: key);

  @override
  _AnimIconTestState createState() => _AnimIconTestState();
}

class _AnimIconTestState extends State<AnimIconTest>
    with TickerProviderStateMixin {
  late AnimationController _animationController;

  @override
  void initState() {
    super.initState();
    _animationController = AnimationController(
      vsync: this,
      duration: Duration(milliseconds: 400),
    );
  }

  Color iconColor = Colors.white;
  @override
  void dispose() {
    _animationController.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: Scaffold(
        backgroundColor: Colors.blueAccent,
        body: Center(
          child: InkWell(
            onTap: () {
              if (_animationController.status == AnimationStatus.completed) {
                _animationController.reverse();
                setState(() {
                  iconColor = Colors.white;
                });
              } else {
                _animationController.animateTo(1.0);

                setState(() {
                  iconColor = Colors.red;
                });
              }
            },
            child: AnimatedIcon(
              progress: _animationController,
              icon: AnimatedIcons.menu_close,
              color: iconColor,
            ),
          ),
        ),
      ),
    );
  }
}