• Runtimes
  • Spine TS click event on character

Related Discussions
...

Hello, is there any event that touches on or clicks the mouse on the character using spine ts runtime canvas?
E.g. When I touch on character, it laughs as if it's being tickled

8 giorni dopo

Hello, I'm sorry your post was not replied to sooner. I am currently working on creating an example using the spine-ts runtime that demonstrates a mouse click event. I'll post the demo here as soon as it's done!


UPDATE: Please see below for the link to my example!
Link: https://gist.github.com/lukeeingram/f8326635b7d998736bb1cf57044d2755

To be more precise, the code relevant to your question is here:
https://gist.github.com/lukeeingram/f8326635b7d998736bb1cf57044d2755#file-click-example-html-L42

It sets a click listener on the canvas. In case the user clicked, the head bone is fetched from the skeleton and the mouse coordinates of the click are checked for whether they are within a specific radius of the headbone position.

I've created a codepen so you can play around with it: https://codepen.io/badlogicgames/pen/yLpyJxG?editors=1010

If you have Spine Professional, you can also create bounding box attachments in your skeleton. These allow for much more precise hit detection. Spineboy has a bounding box around his head:

In code, you then create a SkeletonBounds instance, update it with the current pose of the skeleton (skelBounds.update(skeleton)) and then use one of the hit/intersection testing methods to check if a bounding box attachment was hit. (skeltBounds.containsPoint(mouseX, mouseY)). I've created a codepen demonstrating this here:
https://codepen.io/badlogicgames/pen/WNdbpea?editors=1010