search

LottieFiles / lottie-react

lottie web player as a react component
https://lottiefiles.com
MIT License
717 stars 80 forks source link

Segment Play on Scroll: Can't Force Play #136

Closed tbloomer4 closed 1 year ago

tbloomer4 commented 1 year ago

Overview

Hi!

I see you updated the 'play' action to accept frames in scroll mdoe quite a while ago: https://github.com/LottieFiles/lottie-interactivity/issues/55

However, unlike 'loop''s implementation of this feature, it doesn't override the currently playing segment. I'm trying to implement an animation that plays different segments on scroll, but does not loop. When using type='play', the new segment isn't played if the player is currently playing a segment. When using type='loop', the new segment immediately overrides the currently playing segment.

I would expect the 'play' behavior to match loop's, with the exception of looping.

If this is not an option, I would ask to be able to pass the 'force' flag as an option with the action, to be passed to playSegements, in order to mimic the existing behavior + provide the option to override it

loop implementation play implementation

my example code:

create({
        mode: 'scroll',
        player: anim,
        container: "#scroll-container",
        actions: [
          {
            visibility: [0, 0.5],
            type: 'play',
            frames: [0, 200],
          },
         //when using type: 'play', this segment isn't played on scroll unless the previous segment has finished
        //this works fine with loop, but I don't want it to loop
         {
            visibility: [0.5, 1],
            type: 'play',
            frames: [200, 400],
          },
        ]
      });

...

Consuming repo

What repo were you working in when this issue occurred?

...

Labels