自定义重复缩放动画

Question

我正在尝试实现从 0 到 1 开始，然后在 0.8 和 1 之间交替的缩放动画。我从 https://api.flutter.dev/flutter/widgets/ScaleTransition-class.html 复制了代码并且调整了值，但无法实现我想要的动画。下面的代码从 0.8 开始，动画到 1 并重复。关于如何实现上述动画有什么想法吗？蒂亚

late final AnimationController _controller = AnimationController(
    value: 0,
    duration: const Duration(seconds: 2),
    vsync: this,
  )..repeat(min: 0.8, max: 1, reverse: true);
  late final Animation<double> _animation = CurvedAnimation(
    parent: _controller,
    curve: Curves.fastOutSlowIn,
  );

  @override
  void dispose() {
    _controller.dispose();
    super.dispose();
  }

Answer 1

试试这个：

late final AnimationController _controller = AnimationController(
        duration: const Duration(seconds: 2),
        value: 0,
        vsync: this,
      )..addStatusListener((status) async {
          if (status == AnimationStatus.completed) {
            _controller.animateBack(0.5);
            _controller.animateTo(1);
            _controller.repeat(min: 0.5, max: 1, reverse: true);
          }
        });
      late final Animation<double> _animation = CurvedAnimation(
        parent: _controller,
        curve: Curves.fastOutSlowIn,
      );

完整样本：

class _MainAppState extends State<MainApp> with TickerProviderStateMixin {
      late final AnimationController _controller = AnimationController(
        duration: const Duration(seconds: 2),
        value: 0,
        vsync: this,
      )..addStatusListener((status) async {
          if (status == AnimationStatus.completed) {
            _controller.animateBack(0.5);
            _controller.animateTo(1);
            _controller.repeat(min: 0.5, max: 1, reverse: true);
          }
        });
      late final Animation<double> _animation = CurvedAnimation(
        parent: _controller,
        curve: Curves.fastOutSlowIn,
      );
    
      @override
      void initState() {
        super.initState();
      }
    
      @override
      void dispose() {
        _controller.dispose();
        super.dispose();
      }
    
      @override
      Widget build(BuildContext context) {
        return MaterialApp(
          home: Scaffold(
            body: Center(
              child: ScaleTransition(
                scale: _animation,
                child: const Padding(
                  padding: EdgeInsets.all(8.0),
                  child: FlutterLogo(size: 150.0),
                ),
              ),
            ),
          ),
        );
      }
    }