• Unity
  • SkeletonAnimation + layout

  • Изменено
Related Discussions
...

Hello guys!

I'm rather new to Spine + Unity. What I'm trying to achieve is to align my Unity UI elements (eg. health bars, status icons, etc.) with my characters, which are made using Spine animations. In other words, I'm looking for a way to anchor UI stuff to characters, so that it would respect character sizing (which may vary). So on the screenshot below, the health bar is obviously expected to be above character heads all the time )

From what I see, Spine Animations rely on Mesh Renderer, which has nothing to do with the Rect Transform, but I wonder if there's any way of making them friends ?

How are your UI elements organized? Are they part of the character's prefab, or are all of the health bars managed under a single (separate) canvas?

You can use meshRenderer.bounds to get the (current) bounding box of the entire character and position it based on that.

UI elements are coming inside of character's prefab, yes. I was thinking about meshRenderer bounds, but these seem to use worldSpace coordinates, so I'm not exactly sure how to tie them to UI objects. Should this be achieved via custom code or there is a way to do that in the editor?

olegbolshakov написал

UI elements are coming inside of character's prefab, yes. I was thinking about meshRenderer bounds, but these seem to use worldSpace coordinates, so I'm not exactly sure how to tie them to UI objects. Should this be achieved via custom code or there is a way to do that in the editor?

There are a couple ways you could do it - here is one way:

1) Set up your character prefab so that the Skeleton Animation is not on the 'parent' gameobject of the prefab, but on a child, so now you can scale your Skeleton Animation gameobject without scaling the entire prefab.

2) Create another gameobject "CanvasContainer" that will just be a container for your Canvas/UI. This should not be a child of the Skeleton Animation gameobject.

3) Position your CanvasContainer to the centerpoint of where you want your canvas to be.

4) Create the canvas as a child of the CanvasContainer, and set it up as-needed (Render Mode: World Space, Width/Height, disable Graphic Raycaster if you dont want it to receive mouse events)

5) Now create a gameobject that IS a child of the SkeletonAnimation, and name it "CanvasPositioner". Also place this where you want the centerpoint of the canvas to be (over the character's head).

6) Place a script on the CanvasContainer that simply sets its Transform.position to the Transform.position of CanvasPositioner in Update().

Now you can scale your SkeletonAnimation, which will correctly move the CanvasPositioner, but won't scale your Canvas (since its not a child gameobject), and your CanvasContainer will follow the CanvasPositioner.

Let me know if that makes sense, and works for you. There are a lot of other ways you could do it, but this one is probably the most simple, and gives you the flexibility of positioning the CanvasPositioner exactly where it looks best.

First - thank you for the guidance! I experimented a bit with this approach, and realized after some failures made it work in an even simpler setup: I set my UI canvas position to rootObject + meshRenderer.bounds.y, and that works totally fine. So the main problem is completely solved by this trick.

However, I noticed one related issue that may potentially cause problems:

Canvas expects a camera to be set, but I'm not sure if it's even possible to set a camera for the prefab. It says I may run into issues when trying to handle UI events, does that mean I cannot catch screen clicks? If so, is there any workaround?

olegbolshakov написал

First - thank you for the guidance! I experimented a bit with this approach, and realized after some failures made it work in an even simpler setup: I set my UI canvas position to rootObject + meshRenderer.bounds.y, and that works totally fine. So the main problem is completely solved by this trick.

However, I noticed one related issue that may potentially cause problems:

Canvas expects a camera to be set, but I'm not sure if it's even possible to set a camera for the prefab. It says I may run into issues when trying to handle UI events, does that mean I cannot catch screen clicks? If so, is there any workaround?

I'm not sure - I haven't used a World Space canvas that required click events. I did notice that on my Canvas (which is part of a prefab, and has the same warning) I disabled the "Graphic Raycaster" - so that leads me to believe that it was intercepting clicks haha.

If you need to get clicks, and aren't receiving them, then you probably just need to set the Camera at runtime. AKA put a script on the canvas gameobject that sets it to your Camera, on Awake() or Start().

That's something I thought as well, just wanted to make sure there's nothing wrong with the setup )

Thank you!

8 дней спустя

Thanks Jamez0r for being a wonderful help! :cooldoge: