Android canvas path drawing animation

I would like to animate the drawing of the path, i.e. gradually display it on the screen. I use canvas, and so far I am guessing to use ObjectAnimator to care for the animation. However, I cannot figure out how to draw the corresponding path segment in the onDraw () method. Is there a way to do this? Should I include path effects for this?

Edit: Using DashPathEffect and setting its β€œon” and β€œoff” intervals in the animation to cover part of the path we want to take for this step seems to work here, but it requires allocating a new DashPathEffect for each animation step. I will leave the question open if there is a better way.

+4
source share
2 answers

Answering my own question, I figured out how to do it.

The trick is to use an ObjectAnimator to gradually change the current stroke length and DashPathEffect to control the length of the current stroke. The DashPathEffect parameter will set its own hyphen parameter:

 float[] dashes = { 0.0f, Float.MAX_VALUE }; 

The first float is the length of the visible impact, the second length of the invisible part. The second length is chosen extremely high. The initial settings correspond to a completely invisible shock.

Then, each time the object animator updates the stroke length value, a new DashPathEffect is created with a new visible part and set to the Painter object, and the view is invalid:

 dashes[0] = newValue; mPaint.setPathEffect(new DashPathEffect(dashes, 0)); invalidate(); 

Finally, the onDraw () method uses this artist to draw a path that will contain only the part we want:

 canvas.drawPath(path, mPaint); 

The only drawback that I see is that we have to create a new DashPathEffect at each step of the animation (since they cannot be reused), but on a global scale this is satisfactory - the animation is nice and smooth.

+9
source

As far as I know, the only way is to start from an empty path and have a runnable that adds points to the path at certain intervals until it is complete.

0
source

Source: https://habr.com/ru/post/1438257/


All Articles