Search code examples
flutterflutter-animationlottieanimationcontroller

How to play lottie animation for specific time duration in flutter


I want to play lottie animation for specific time duration in flutter. I don't want to play it by fast forwarding. Like If my animation contains total 90 frames then If I only want to play first 30 frames so can I achieve this? or like If my animation has total 2 seconds but I only want to play 1st second. then How can I do this with using animation controller or any other thing?


Solution

  • Okay you could try directly editing the controller instead, so you're initState will look like this:

      @override
      void initState() {
        super.initState();
        _controller = AnimationController(vsync: this);
        _controller.addListener(() {
          print(_controller.value);
        //  if the full duration of the animation is 8 secs then 0.5 is 4 secs
          if (_controller.value > 0.5) {
    // When it gets there hold it there.
            _controller.value = 0.5;
          }
        });
      }
    

    and then your lottie widget looks like this:

      Lottie.asset( 
          'asset/path.json', 
           controller: _controller, 
           onLoaded: (comp){
              _controller
              ..duration = comp.duration
              ..forward(); 
        })
    

    ----------- Previous answer below -----------

    haven't had a chance to check this but try adding a controller to your animation and using animateTo on the onLoaded.

     Lottie.asset( 
      'asset/path.json', 
       controller: _controller, 
       onLoaded: (comp){
          _controller.animateTo(frameNumber); 
    })