Блог

Я был рад, что в bcs было простое решение для пакета flare, но, к сожалению, теперь у меня есть формат .riv, поэтому для меня есть только пакет rive.

Все примеры, которые я видел, где анимация воспроизводится мгновенно после загрузки экрана, но мне нужно, чтобы она запускалась с помощью функции (кнопка, нажата и т. Д.).

 
class Animation extends StatefulWidget {
  @override
  _AnimationState createState() => _AnimationState();
}

class _AnimationState extends State<Animation> {
  RiveAnimationController controller;

  @override
  void initState() {
    super.initState();
    controller = SimpleAnimation('Animation 1');
  }

  @override
  Widget build(BuildContext context) {
    return Container(
      child: Center(
        child: RiveAnimation.asset(
          'match.riv',
          controllers: [controller],
        ),
      ),
    );
  }
}
 

Заранее спасибо

Из официальной документации rive передайте еще один параметр SimpleAnimation

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

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

class _PlayPauseAnimationState extends State<PlayPauseAnimation> {
  // Controller for playback
  late RiveAnimationController _controller;

  // Toggles between play and pause animation states
  void _togglePlay() =>
      setState(() => _controller.isActive = !_controller.isActive);

  /// Tracks if the animation is playing by whether controller is running
  bool get isPlaying => _controller.isActive;

  @override
  void initState() {
    super.initState();
    _controller = SimpleAnimation('Animation 1', autoplay: false);
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: RiveAnimation.network(
          'match.riv',
          controllers: [_controller],
          // Update the play state when the widget's initialized
          onInit: (_) => setState(() {}),
        ),
      ),
      floatingActionButton: FloatingActionButton(
        onPressed: _togglePlay,
        tooltip: isPlaying ? 'Pause' : 'Play',
        child: Icon(
          isPlaying ? Icons.pause : Icons.play_arrow,
        ),
      ),
    );
  }
}