Flutter useAnimationController 钩子不会重建小部件

Question

我正在使用 flutter hooks 包在屏幕上对元素进行动画处理，但显然我做错了一些事情，因为该元素没有重建为动画。这是我的代码。

class Ball extends HookWidget {
  @override
  Widget build(BuildContext context) {
    final xController = useAnimationController(
      duration: Duration(seconds: 3),
      lowerBound: 0,
      upperBound: 2,
      initialValue: 1,
    );

    final yController = useAnimationController(
      duration: Duration(seconds: 3),
      lowerBound: 0,
      upperBound: 2,
      initialValue: 1,
    );

    useEffect(() {
      xController.repeat(reverse: true);
      yController.repeat(reverse: true);

      return () {};
    });

    return Align(
      alignment: Alignment(
        xController.value - 1,
        yController.value - 1,
      ),
      child: Container(
        width: 12,
        height: 12,
        decoration: BoxDecoration(
          color: Colors.grey[900],
          shape: BoxShape.circle,
        ),
      ),
    );
  }
}

渲染时，该小部件位于堆栈内。在运行时或构建时都不会引发错误。

Answer 1

对于将来查看此内容的任何人，您必须执行此操作

final xController = useAnimationController({ ... })
useAnimation(xController)