如何旋轉 Flutter 中的小部件？

Question

有沒有辦法為小部件的旋轉設置動畫？ 我嘗試RotatedBox ，但沒有用。

Answer 1

使用AnimatedBuilder

AnimatedBuilder(
  animation: _animation, // pass AnimationController to it
  child: YourContainer(),
  builder: (_, child) {
    return Transform.rotate(
      angle: _animation.value * play_around_with_values,
      child: child,
    );
  },
)

---

截屏：

---

完整代碼：

class _MainPageState extends State<MainPage> with SingleTickerProviderStateMixin {
  AnimationController _controller;

  @override
  void initState() {
    super.initState();

    _controller = AnimationController(vsync: this, duration: Duration(seconds: 2))..repeat();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(),
      body: Center(
        child: AnimatedBuilder(
          animation: _controller,
          builder: (_, child) {
            return Transform.rotate(
              angle: _controller.value * 2 * math.pi,
              child: child,
            );
          },
          child: FlutterLogo(size: 200),
        ),
      ),
    );
  }
}