spine-runtimes icon indicating copy to clipboard operation
spine-runtimes copied to clipboard

[unity] SkeletonGraphic shall respect scale of its RectTransform

Open HaraldCsaszar opened this issue 4 years ago • 10 comments

Mentioned in this forum thread: http://esotericsoftware.com/forum/Unity-UI-scaling-with-Spine-objects-11049

Status: SkeletonGraphic currently ignores the RectTransform dimensions (unlike Unity's built-in UI elements, which scale within its bounds). This is very bad for automatically scaling UI elements based on different target device resolutions or aspect ratios.

Reason this was not implemented yet: Arguments against scaling it with the RectTransform were based on the fact that the animation changes the bounds of the skeleton every frame.

Desired behavior: Scaling should ignore any updates to the bounds of the skeleton vertices at runtime and use only the initially set RectTransform as a scale-reference. When the RectTransform changes, skeleton scale should adapt accordingly, no matter the current position of any vertices. This way the RectTransform can be perfectly matched in the Unity editor by setting the desired animation and hitting the Fit RectTransform with Mesh-Match button once. Then at runtime any UI layout changes would scale the skeleton accordingly.

HaraldCsaszar avatar Mar 11 '20 08:03 HaraldCsaszar

Awesome this describes it perfectly! Really appreciate you creating the ticket 👍.

Honestly would really love this to be implemented as I feel like it could be pretty hard to implement spine animations reliably in the unity ui otherwise.

thsbrown avatar Mar 13 '20 01:03 thsbrown

Sorry to follow up on this issue once more but my team and I are trying to figure out how to move forward on integrating our menu animations that were done in Spine into Unity. At the moment getting them implemented in Unity isn't time sensitive but we know we are going to have to implement them eventually.

Is this feature a priority for Spine (completed within the next 6 months or so?) or do you think it's best we figure out a solution of our own.

Thanks in advance! I understand that giving a timeline is not always possible so no pressure just trying to get a sense of where things are at.

thsbrown avatar Mar 14 '20 20:03 thsbrown

Is this feature a priority for Spine (completed within the next 6 months or so?) or do you think it's best we figure out a solution of our own.

It is very likely that the feature will be completed within this timeframe. We hopefully will be able to work on the SkeletonGraphic features in succession, so this shall be head of the queue soon.

HaraldCsaszar avatar Mar 16 '20 07:03 HaraldCsaszar

Thanks to ggzerosum, there is now a component shared on the forum/github: http://esotericsoftware.com/forum/Script-Make-SkeletonGraphic-respecting-RectTranform-13911 https://github.com/ggzerosum/SpineUtility/tree/master/RespectRectTransform

While we are still planning to support it natively in SkeletonGraphic, I'm sure this will help a lot of users in the meantime.

HaraldCsaszar avatar May 07 '20 09:05 HaraldCsaszar

Hey guys just wanted to note that I went ahead and implemented some menu animations with the component above.

While I really appreciate the work from ggzerosum it definitely left a lot to be desired in terms of ease of use. Also after implementing it looks like the animations break after build when using the component.

I say all this not to put down the current component created but just to say we still see this as a pretty high priority for getting our menu screens implemented in unity 👍.

Our current workaround is saving the animations out as movies and using those instead.

thsbrown avatar Jul 01 '20 20:07 thsbrown

Thanks for the info @thsbrown!

HaraldCsaszar avatar Jul 02 '20 12:07 HaraldCsaszar

Another possible solution is rendering the image with a RenderTexture and using it on UI with RawImage + AspectRatioFitter (or something similar to keep the aspect ratio of the image)

bilck avatar Sep 01 '21 02:09 bilck

Another possible solution is rendering the image with a RenderTexture and using it on UI with RawImage + AspectRatioFitter (or something similar to keep the aspect ratio of the image)

Life saver, this did the trick beautifully!

Towanime avatar Sep 07 '21 20:09 Towanime

Another possible solution is rendering the image with a RenderTexture and using it on UI with RawImage + AspectRatioFitter (or something similar to keep the aspect ratio of the image)

can you elaborate further on how to do this ?

i still not experienced on using render texture, and spine

billy-agate avatar Mar 17 '22 05:03 billy-agate

Another possible solution is rendering the image with a RenderTexture and using it on UI with RawImage + AspectRatioFitter (or something similar to keep the aspect ratio of the image)

can you elaborate further on how to do this ?

i still not experienced on using render texture, and spine

Create a render texture in your project, and a camera in your scene that outputs to that texture. Set the camera's culling mask to only see the spine animation layer, that way you'll have a separate camera that draws the animation to the render texture.

And then create a RawImage on your UI, and assign a render texture to it.

VladMelnychuk avatar Mar 18 '22 09:03 VladMelnychuk

This feature has just been implemented and pushed to the 4.1 and 4.2-beta branches. From the changelog:

SkeletonGraphic now supports automatic scaling based on its RectTransform bounds. Automatic scaling can be enabled by setting the added Layout Scale Mode Inspector property to either Width Controls Height, Height Controls Width, FitInParent or EnvelopeParent. It is set to None by default to keep previous behaviour and avoid breaking existing projects. To modify the reference layout bounds, hit the additional Edit Layout Bounds toggle button to switch into edit mode, adjust the bounds or hit Match RectTransform with Mesh, and hit the button again when done adjusting. The skeleton will now be scaled accordingly to fit the reference layout bounds to the object's RectTransform.

New 4.1 and 4.2-beta unitypackages are available for download here as usual: https://esotericsoftware.com/spine-unity-download

HaraldCsaszar avatar Mar 24 '23 14:03 HaraldCsaszar