Hello.
I have a UI that lists other UI objects at runtime and they can be added/removed dynamically.
These objects have a ‘drop down menu’ as a child made from buttons and a panel using the layout elements/group components and as such cant be moved around in the hierarchy because of the layout components.
My issue is that if object 1’s drop-down menu is opened, it drops down behind the ‘newer’ object below it making the buttons hidden and unclickable.
I know of the sibling index variable but this (after experimentation) doesn’t fix it.
I vaguely remember in the beta (a few iterations ago) that we could straight up set the render order of individual elements, has this been utterly removed because I cant find that option anywhere.
As relatively simple solution should be to add a canvas to the drop-down and in there enable “override sorting” and make sure you have an appropriate value there.
Played around with a canvas at various points in the dropdown object and with varying sorting values including -999, -10, -1, 0, 1, 10, 999 but it will not alter the priority at all (inface it makes everything as a child of the canvas disappear).
Could you share a screenshot? Seeing the hierarchy might also help.
It sounds as if you might have more than one UI, maybe even an overlay and another one.
Everything highlighted in the hierarchy is the drop down menu containing possible items (the ButtonPrefab(Clone)'s).
.As you can see on the far right, when opened, the drop down menu falls behind the other pnlOBJECT.
The ‘DropDownMenu_ItemType’ object is a panel and is the start of the dropdown menu structure, it only has a script to populate the list.
‘btnDropDownButton’ Just has an onclick to open the menu.
‘itemTypeDropDown’ is a panel and has a ‘vertical layout group’ and ‘content size fitter’ to control the child buttons (menu selection) layout, and its anchor is set to the bottom of the parent button to ensure that it opens from the correct position.
‘ButtonPrefab(Clone)’ has a ‘Layout element’ so it adherers to its parents vertical layou group component.
As for the extra canvas you suggested to inset into the dropdown, I tried every variation in every part of the dropdown object as I could (adding and altering element components, changing sibling values, etc).
Yeh iv tried from scratch a couple of times.
From my understanding its the overall position in the canvas that’s causing it (referencing the draw order).
Also, sibling index will not work due to its sibling ‘scope’ is still too far down the tree.
One thing that comes to mind is to jump it out of its current hierarchy and place make it a child of the outermost canvas, ensuring it is drawn last.
This will need some tinkering with the layout elements to make sure it doesn’t jump around the canvas like it does currently if its moved to somewhere else with a specific layout component.
I was just hoping for some ‘out-of-the-box’ change this value and it works as expected.
If you create a canvas for the drop down, it will be taken out of the draw order of any parent canvas and uses instead the given values. I assume that there is an issue in your setup. Maybe there is another canvas which is drawn even after the the drop down.
The canvas named ‘Canvas’ is the only canvas in the scene.
As I say, I have tried adding a new canvas to ‘pnlOBJECT1’ object and making the dropdown a child of that new canvas.
The objects of the new child canvas still appear behind everything else and setting the ‘override sorting’ value to true caused the canvas and its contents to disappear from the screen no matter what new sort value is added.
Moving the new canvas as a direct child of the main canvas (at the end of the hierarchy) does allow the dropdown to be drawn properly, and with a simple script could be moved there and beck when opening and closing, but isn’t ideal.
My set-up also works If I move it to the direct child of the main canvas like in your image. It doesn’t seem to work if its further down a branch ie: child of a child of a child and so on.
What seems very odd on further inspection, is that when i drop the dropdown menu into its own canvas as a child of the main object, it does draw over the panel of the object its attached to but the input box’s and labels remain drawn over the top of the drop down menu.(even the input box’s and labels on the same object) even when last or first in the objects hierarchy.
The more I play around with it, the more it feels like a bug with the UI system.
Showing the same technique used as in your image (note that if I tick the ‘Override Sorting’ box the their canvas and its children disappear from the screen and remain hidden even if everything else is moved out of the way to see if it is just being block by the other objects). And I image that’s the key here, the object isnt playing well the the ‘override sorting’ option.
Still doing testing to try and get something that works that doesn’t involve moving the dropdown menu to a different parent object.
Yes but I’m saying it doesn’t work as expected. The canvas utterly disappears (is not hidden behind other elements or obscured in any way, it just completely is not drawn.
I have removed all my scripts from a second from scratch build using only the out of the box unity assets and components and this issue is replicated.
