Hit detection and draw order of overlapping elements

[GarbageBin]

Hi, I have a small problem that I don't know how to solve. I have created a scroll view and placed two buttons under it. It kinda disturbs me that the scroll view(SV) elements are still pressable even after they are outside of the SV windows, but I guess that it can be solved by putting a box collider above and bellow of the window. The real problem is that I can't get the right element above. The two buttons are always under the scroll view no matter what depth I set them or what z value I set for their position. The collider for the right button oddly seems to be on top (it reacts to clicks). If I move the SV elements up, the left button is also clickable. All of them are in the same panel, on the same camera and the graphics are in the same atlas. I have created the elements programmatically. I have included a image below.

[ArenMook]

Different panels = different draw calls. Adjust Z to determine what's in front of what. Check the FAQ.

[GarbageBin]

I kinda forgot that the scroll view was also a panel. I had the scroll view panel as a child of a panel. Now that I moved them both to be children of a anchor and changed the Z value, everything works as intended.

[GarbageBin]

I have encountered another problem with my scroll view. After filling the grid with elements, the position of the first element is at the middle. After clicking on one of the elements or after giving it a little push, it moves back to the top (the differences can be seen in the images). I wanted to reset the position of the elements. I tried UIDraggablePanel.ResetPosition -> changeContent -> UIGrid.Reposition -> UIDraggablePanel.ResetPosition, I tried UIDraggablePanel.SetDragAmount and I tried currentMomentum = currentMomentum + delta. It moves the elements to the right position, but it also somehow locks the scroll view, it does not react to any click and drag events anymore. What could be the reason?

[ArenMook]

Simplest solution: in edit mode, add a row prefab to your list. It will be in the middle. Now move the list so that it's positioned properly and delete the row prefab.

[GarbageBin]

What do you mean with "Edit mode"? Do you mean that I should add the element in the editor and reposition the starting element? That will kinda be impossible to do because I'm doing this all programmatically, I do not create the element in the editor. The repositioning can also be done in code. But that is not the problem. The problem is the following, if I try any of the  three methods mentioned in the previous post like for instance "currentMomentum = currentMomentum + delta", the scroll view locks up, it is not possible to move its elements anymore.

[ArenMook]

You're doing too much programmatically. Rather than creating the whole UI setup you have, you should instead create all your layout and save it as a prefab. You should then create a single row entry for your list, and save that as a prefab as well. When populating the list programmatically, instantiate the row prefab, fill the data, rinse and repeat. This way everything will look and behave correctly, and you still get the whole "populated programmatically" deal.

As for locking up -- I don't see why it would ever lock up, so I can't advise you here. You might have to debug it via some careful Debug.Logs.