如何在 Flutter 中制作反转图标的动画？

Question

在给Icon做旋转动画的时候发现一个奇怪的问题

我用

RotationTransition

来制作

Icons.sync

的动画。而且我还使用

Transform

，因为我需要图标的镜像版本。结果很奇怪——它不是旋转，而是按圆形轨迹运动，然后断裂。没有

Transform

一切都OK.

它现在是如何工作的（新点击按钮不会启动动画，只有页面加载启动它）：

没有

Transform

它是如何工作的（如扩展）

动画图标小部件代码：

class _AnimatedSyncIconState extends State<AnimatedSyncIcon>
    with SingleTickerProviderStateMixin {
  late final AnimationController controller;
  late final Animation<double> rotateAnimation;

  @override
  void initState() {
    super.initState();
    controller =
        AnimationController(vsync: this, duration: const Duration(seconds: 1));
    rotateAnimation = CurvedAnimation(parent: controller, curve: Curves.linear);
    _animate();
  }

  @override
  void didUpdateWidget(final AnimatedSyncIcon oldWidget) {
    super.didUpdateWidget(oldWidget);
    if (widget.isActive != oldWidget.isActive) _animate();
  }

  void _animate() {
    if (widget.isActive) {
      controller.repeat();
    } else {
      controller.reset();
    }
  }

  @override
  Widget build(final BuildContext context) {
    return RotationTransition(
      turns: rotateAnimation,
      child: Transform(
        transform: Matrix4.rotationY(pi),
        child: const Icon(Icons.sync),
      ),
    );
  }
}

如何使镜像图标正常工作？