A panel tightly fitting the image element it contains

I’ve been living through a world of pain with Unity UI as it seems impossible to do the simplest thing to get a decent UI going on so I’ll try doing it one step at a time.

First, how do I make it so that a UI object boundaries are tightly fit around an image component it contains, image that is set to “preserve aspect”.

6150895--671956--Untitled.png I actually want the green border (actually the parent object) to “tightly fit” the image in the child.
But for starters the image isn’t taking the whole of the object (because it’s set as “preserve aspect”, which I want, so I want to fit the object - and the object parent too, with a small border - to the image).

6150895--671959--Untitled2.png The prefab is put into a parent object that will be in a vertical layout, but that’s a problem for another time.

So, how do I do that? And go easy because all the special components I find really hard to understand (I’ll be honest, they make no sense to me).

Thanks in advance.

I am getting ready to pursue this also for my HUD. Should be interesting to see the answers. Unity headaches are the worst. Too much time is spent futzing around with things that dont work.

Exactly! It’s a small project, the logic has been done for ages and I’ve been stuck months on this (plus with unity remote not working :P)

I have seen the ‘Experienced developer’ posting ‘Find what works around Unity failures and go with that’. I have 41 years in development and this will eventually lead you down a rosey path into hell. There are slick tricks one can do but then the code is way outside the box from standards. And to get to the point where one can implement a slick trick costs too much time. That is why there are standards or tools promoted that are supposed to work in a given fashion but dont.

I haven’t worked on desktop applications in foreverer but I don’t remember UI ever being so complicated.

1 Like

Have you tried using a Content Size Fitter on the parent? It can indeed be tricky to get stuff to size properly, especially when one level depends on the other. You may even need layout groups in my experience.
We’re currently working in UI Toolkit to make runtime UI that will be easier to layout with flexbox and avoid these situations, but that’s still in preview :slight_smile:

I’ll probably wait for that then, I’m starting to get crazy because I’ve been trying for months with layouts and fitters and it just doesn’t make sense to me. :frowning:

If you want to start taking a look at UI Toolkit I recommend going to the forum, also the preview announcements are here .

Thanks. Thorough tutorials would be great. :stuck_out_tongue:

There’s a demo project, you can find it on the initial announcement but here’s the direct link: GitHub - Unity-Technologies/UIToolkitUnityRoyaleRuntimeDemo: This is a sample project to introduce the use of UI Toolkit in Runtime

Thanks! I’ll look into it.

Annoying to have to redo the UI of my project. I hope this is simpler to use. :stuck_out_tongue:

As I mentioned, this is still in preview so not yet ready for production, and no one has to redo their UI anyway, but it’ll be a different way of doing UI that should be easier in the sense of creating layout like this.

Well I can’t do anything with the current tools so… I’m still in the process of making it anyway… :confused: