MikalDev

For construct 3 users, we updated the basic Construct 3 runtime plugin with a few more features it's as good a time as any to release and for C3 devs to work with it. It's based on the Spine-TS runtime and rendering the Spine animation to a texture which C3 can then use to integrate into a C3 Spine object with Z ordering, position, scaling, rotation, etc.

Here's the C3 forum post with more details (also copied below)
https://www.construct.net/en/forum/construct-3/general-discussion-7/spine-plugin-update-153892

The C3 Spine plugin we (Igor and Mikal) developed has been updated with some new features (default animation mix and animation speed). For simple animation playback, pause, switch, it works and looks pretty good with a default mix. Performance is reasonable on the desktop systems I have tested on and recent iPhones (50+ Spine characters with 60fps). Android performance is more of a challenge, only a few characters at 60fps, something to review. Some examples are below. It includes skin changing and mesh deforms. For more details see the plugin webpage:

If you try it out on Construct, let us know, post your results.

https://gritsenko.github.io/c3_spine_plugin/

If you run into bugs, please leave issues on the github site here:
https://gritsenko.github.io/c3_spine_plugin/

Simple C3 example:
MikalDev
  • Posts: 46

Nate

It looks great, thanks for sharing! I've added it to the runtimes page:
Spine: Runtimes: Construct 3

Cheers! :beer:
User avatar
Nate

Nate
  • Posts: 10503

MikalDev

Updated plugin:

1.7.0: Add event trigger ACE (trigger when animation event occurs.)
1.6.0: Add Set region action (change region(texture) of an attachment in a slot on the current skin. Useful for character customization.
MikalDev
  • Posts: 46

Sebastien

Thanks Mikal and Igor for all the work done so far!

What can we do to help make official and support further this plugin? ;) :think:
User avatar
Sebastien
  • Posts: 1

starki

Thanks Mikal and Igor!
starki
  • Posts: 2

MikalDev

Update to version 1.8.0 to add options for better pixel art renders for the aboves examples and faster/more efficient skeleton instances.
Changes:
  • Add expressions TextureWidth, TextureHeight (texture size used to display Spine)
  • Add property RenderQuality (1-0), amount to downsample original Spine size (reduces texture size used also reduces GPU performance requirement, which is usually less of an issue.)
  • Load skeleton only once per Spine object, other instances of the same object are instances of the skeleton, saves a lot of texture memory to have only one skeleton texture atlas in GPU memory.
  • Move on skelton loaded to after texture has been created for the Spine object and initial animation bounds and other state is set.

Also, you are welcome starki!

---

Update to version 1.9.0:

08/14/2020 1.9.0: Fix export issues (change spine-webgl.js to an external runtime script).

---

Update to version 1.10.0:

08/17/2020 1.10.0: Add Keep Aspect Ratio checkbox.

---

Update to version 1.11.1:
09/05/2020 1.11.1 Remove spine instance from batcher when C3 Spine instance calls Release() (e.g. C3 object destroyed.)
09/05/2020 1.11.0 Implement batch render for improved performance with multiple Spine objects and instances.

---

A number of new updates. The batch render improves desktop performance of multiple instances by roughly 4X on my example system (1.11.x). The support for multiple atlas pages allows for multiple pngs to be loaded for a single skeleton (this can help with multiple skins with different textures per skin or attachment.)

09/11/2020 1.12.1 Change to comma separated instead of space separated for png paths.
09/10/2020 1.12.0 Add support for Atlas pages (multiple png, comma separated), finish implementation of Set Attachment action, fix webgl1 support (revealed on iOS w/o weblg2 enabled.)
09/05/2020 1.11.2 Move spineBatcher.init() to prevent race condition (seen on iOS)
MikalDev
  • Posts: 46

Mario

Super cool!
User avatar
Mario

Mario
  • Posts: 2489

MikalDev

Thanks Mario.

Added runtime custom skin support per instance (Create custom skin, Add to custom skin, Set custom skin). Can have multiple runtime created custom skins per instance.

Release 1.13.0



---

Release 1.14.0 Added C3 web worker support.
Release 1.14.1 Fix PMA bug regression (introduced in 1.11.0)

Thanks to Erikari for noticing the PMA issue in the last gif (now fixed.)

---

Release 1.15.0 Set Slot Color (temporary until new skin set), Set Custom Color Attachment (set color of attachment of a custom skin and set to the custom skin.) Fix one frame animation bug.

Example:


---

Release 1.16.2 Set Slot Color, Set Slot Dark Color. Apply Slot Color, Reset Slot Color. Set animation start (beginning, current time, current ratio). Set animation time/current ratio. Deprecate Set custom color attachment.

For Dark Color to take effect, the slot must have 'Tint Black' enabled.

---

- 1.17.0 Add debug property, SpineBBoxCenterX,Y expressions. UpdateBBoxes action.
Bounding Box Attachment
- SpineBBoxCenterX, SpineBBoxCenterY espressions give the average of the named slot/bbox polygon points. Useful for attaching C3 Sprite object / collision box to the center of the Bounding Box.
- The UpdateBBoxes updates the bounding box to the current point in the animation. It should be done just once per tick per instance, before the SpineBBoxCenterX/Y expressions are used.



---

1.18.0 Add SpineBBoxGetPoly expression returns poly points in JSON format of named slot/bounding box attachment. Use with C3 Spine Mesh to create a very accurate Bounding Box in C3.

MikalDev
  • Posts: 46

Nate

Super cool to be able to use the bounding box for physics! Many physics engines disallow making changes to physics bodies (or it is slow).
User avatar
Nate

Nate
  • Posts: 10503

Harald

This is very cool!
User avatar
Harald

Harri
  • Posts: 2410

MikalDev

Thanks folks! In this case the physics property for the bounding box is marked as 'immovable', which seems to make it work ok (even though I am moving it :) ). With the new C3 mesh, could make a much more complicated poly to match all the points in the sword also.

---

- 1.20.0 Add support for C3 R226 module mode, add Set Object Render Rate ACE.
- 1.19.0 Add Set animation mix {fromName} to {toName} with duration {seconds}.

Added a new render mode, since we are rendering to texture, we do not need to have spine-ts render every 60Hz frame to display the Spine object in C3, since we can just use the texture that was last rendered. So added a new Render Rate ACE that spreads out the rendering of the objects between a number of frames, dropping the perf needed on average. For example setting to 2 effectively renders at 30 fps (1/2 on even frame, 1/2 on odd frame), similar for 3 (20 fps) and 4 (15fps). The animations will be staggered by a number of frames, but generally looks fine. Now I get ~250 Spine characters at 60fps render (60 Hz display) and ~500 characters at 30 fps animation (60Hz display.)

Screen Shot 2020-12-02 at 7.21.05 PM.png
You do not have the required permissions to view the files attached to this post.
MikalDev
  • Posts: 46

porcupine

Is that mesh deformation I see? Not even Gamemaker 2 has that. Amazing work O_O
User avatar
porcupine
  • Posts: 4

MikalDev

Thanks and yup, it includes Mesh Deformation:



This is a Spine Object w/ a C3 Outline Effect applied to the object.

---

Release 1.22.2 Add animation track support. Default to track 0 for set, play, stop animation for backward compatibility, add isSekeltonLoaded ACE. Add track alpha control to blend animation between tracks. (Feature commissioned by Adrian - thank you!)

Example:



---

Release 1.23.0 Disable render to texture when offscreen (saves perf), animation continues for events, etc.
MikalDev
  • Posts: 46

porcupine

Here's a stress test I did. You might notice that I have no idea what I'm doing, so that's the reason for most weird things such as the slight overkill with bones and vertices :grinfake




Object's size is 672x465 but I shrunk the "Scale" in Spine properties to 0.5 because some animations went over the line. I'm guessing the default Animation should be the one that takes up most of the room.

So, here's the test:
http://porcupine-parkour.hr/spinetest/

Most modern home computers that aren't state of the line rtx beasts handle 100-300 of these tricorn dragongoats (also called goacorns) animating at once without dropping under 60fps. Phones seem to handle 1-20 of them :grinteeth:

In conclusio, it works beautifully for the things I will need when we start the actual development, I just need to prepare a bit better and I will chip in a donation for this lovely plugin, as soon as I bother to leave the house and visit my bank.
User avatar
porcupine
  • Posts: 4


Return to Runtimes