Animation scrubber that follows curved playhead.

[dMurphy]

Hi there,

New to forums in general but here goes. Would it be possible to create a Playerhead or scrubber that followed a pre-set path? For instance could you drag an MC along a curved line that also controlled the playback of an animation instead of a traditional horizontal playhead?

 

Thanks!

[GreenSock]

Absolutely, but this isn't a trivial thing at all, and there's no simple canned solution I can offer you. Ultimately it has to do with mapping x/y coordinates to the path and then figuring out the progress value that represents along the path, then feeding that to the progress() of the tween/timeline. 

 

One idea that may simplify things a bit is to do a bezier tween of the scrubber along that path, and then you map the x-coordinate progress to the progress of that tween. For example, if the curve starts at x:0 and ends at x:100, on mouseDown you could start a MOUSE_MOVE listener that watches the x position of the mouse and calculates the progress. Like if x is at 40, that means the progress is 0.4 and you feed that to the tween's progress to move the scrubber appropriately (tween.progress(0.4)). And of course you could also feed that progress value to a complex TimelineLite where you have a bunch of animations synchronized. Just a thought.