Hi everyone!
I’m currently challenged with a rather simple UI design which seems unsolvable. I sat in front of it for 7 hours straight and I tried every combination but it won’t work.
Here is what I want to achieve:
Bottom half of the screen is the UI mask. Left side (green) is 1/3 ow the screen width. Right side is 2/3 of the screen width. They both will have their own layout groups inside of them in the future (like the green one already has).
When I add a horizontal layout group to the mask object to split these two in half (as my first step) and let the layout group control the width of by subobjects I get this:
For some reason Unity thinks that the orange box is not relevant anymore and removes the white image object contained in the orange box completely.
If I try to let the children (green and orange box) control the with and force my green box to something like 500 px I get the best results. Problem is of course, that when I scale my screen everything on the right falls apart and gets either cut off or overflows. As you can see here (orange object overflows canvas bounds):
There is no way to tell unity to stretch the orange box to the end of the screen width. I tried the stretching options, all different layout group settings, different parenting strategies and even the content fitter. Nothing works! This is my Hierarchy:
I provided you with a .unitypackage of the scene, where I configured the most logical setup. I hope someone can help! I created the wildest things in unity, but this UI stuff makes me cry a lot!
Greetings from Germany!
I’ll try out the technique and see if it fits my needs!