search

biocarl / drawing_animation

A Flutter library for gradually painting SVG path objects on canvas (drawing line animation).
https://pub.dartlang.org/packages/drawing_animation
BSD 2-Clause "Simplified" License
485 stars 121 forks source link

callback while rendering a path #3

Open 4mitabh opened 5 years ago

4mitabh commented 5 years ago

Awesome work on the library.

I was wondering if it is possible to add a callback as a Path is rendered. The onPaint callback is called after a entire path is completed.

I was trying to achieve results similar to this.

biocarl commented 5 years ago

Thanks @4mitabh, I'm happy you like it!

Let me see if I understood correctly: You would like to have a callback which fires one frame before a specific part of a Path element is painted so that you can overlay something (e.g. a drawing hand which points to the end of the stroke).

As far as I understand it this is not possible: Since the animation is controlled by an animation controller (possibly provided externally) I can't predict which element will be drawn beforehand (e.g. the animation controller can forward/reverse anytime). So if I would expose the callback as you described, then your overlay would always lag one frame behind.

But I will think about it a little bit more during the next days and possibly figure out a workaround. The first idea that comes to my mind is providing a callback which extends the current paint operation but still operating in the same frame. But this would mean that you need to manipulate the canvas directly (in your case probably something with drawImage). So your desired callback would be something like this:

onFrame:((canvas, pathSegment) => canvas.drawImage(img,pathSegment.path.computeMetrics().first.extractPath(length*0.99,length).getBounds().center, Paint()))