• Runtimes
  • Will Spine Runtime support for Flutter?

Wow, that's very cool. What Spine Runtime version does this support? It looks like this is based on the spine-ts 3.8 runtimes, correct? Did you do any benchmarking?

Mario wrote

What Spine Runtime version does this support?

The exported animation from Spine to 3.8 works correctly. The WEBP image format is supported also. A limitation was noticed: only rotations in atlases 0 and 270 are supported.

Mario wrote

Did you do any benchmarking?

There are no benchmarks. There are working examples with stable FPS: https://github.com/signmotion/spine_flutter/tree/enhanced_example

Very interesting, thanks! I've added it to the runtimes page. There are a number of forks, is the original project (jtakakura/spine_flutter) the best for people to check out?

I have converted spine 3.8 to dart and run. But when use triangleRendering=true in canvas, it has some white lines at the edge of each triangle. When running on the flutter web it doesn't happen

Nate wrote

Very interesting, thanks! I've added it to the runtimes page.

Nice, Nate! But I don't think we can split Dart & Flutter for animation: they work together.

Nate wrote

There are a number of forks, is the original project (jtakakura/spine_flutter) the best for people to check out?

Yes, the original fork is the best for people to check out.


conganhphamnd wrote

I have converted spine 3.8 to dart and run. But when use triangleRendering=true in canvas, it has some white lines at the edge of each triangle. When running on the flutter web it doesn't happen

I fixed that problem here: https://github.com/jtakakura/spine_core/issues/3
On Android this fix works. Sorry, I can't check for other platforms at this moment.

Cool! The rendering could be improved a lot by using Canvas.drawVertices():
https://api.flutter.dev/flutter/dart-ui/Canvas/drawVertices.html

Instead of submitting triangles individually, you can submit multiple triangles at once. You could also batch the triangles of consecutive attachments into a single Vertices instance if neither the texture nor the blend mode change, further decreasing the number of draw calls, increasing performance significantly.

4日 後
sign wrote

I fixed that problem here: https://github.com/jtakakura/spine_core/issues/3
On Android this fix works. Sorry, I can't check for other platforms at this moment.

I tried that before. I think the problem is 0.5 pixels (between 0-1 pixel). I tested on 3 devices: samsung tab (1), nokia full hd (2), samsung full hd (3).
(1) & (2) no problem, But on (3) it has some transparent lines at the bottom (at the edge of each triangle). It occurs when the spine uses triangles and vertices.

https://ibb.co/wWcSGw6


I don't know why, but I found this.


When using Draggable. When I drag from top to bottom, it has some white lines on the edge of each triangle

https://ibb.co/KDbrNyv
https://ibb.co/4MV8KkW


I think canvas.drawVertices can fix this problem. :grinfake

conganhphamnd wrote

I think canvas.drawVertices can fix this problem. :grinfake

It's likely. Rendering via Canvas drawVertices is also MUCH more efficient.

12日 後

Since Putler attacked my country, I think the opportunity to return to optimize the runtime I will not appear soon.

I'm so sorry to hear. Hope you and your loved ones can stay safe somehow.

4日 後
sign wrote

Since Putler attacked my country, I think the opportunity to return to optimize the runtime I will not appear soon.

I am really sad to hear this news :tear: . I hope good things come to you and your loved ones. I hope in the future you can continue to develop this library for the community. :yes: