3.0 UIPanel Depth/DrawCall Management

[Ferazel]

Awesome thanks everyone for their feedback. The goal here is to try to come up with some solutions to this problem and hopefully help ArenMook fix the problem. The new UIPanel inspector is a step in the right direction, but it still doesn't solve the problem of having this global depth space being difficult to manage.

With the reduced functionality of the UIPanel I think the best solution is to have the UIPanel's responsibility to be the depth parent. The problem comes when you start parenting UIPanels (such as a drag panel inside of a dialog). If we don't want to the local depths on a per UIPanel system like it was before some other options are per UICamera or per Unity layer so that at least you don't have a global range of widget depth to deal with.

[zedia.net]

I also think the new depth system is quite unmanageable. Our GUI is composed of 1000 of Widget layered in 5 to 6 layers. It is unthinkable to manage those individually by setting a depth that can only be used once. I get it, that having a dual system with z and depth was confusing, but I think that going with depth was a mistake. The good thing about the z was that it had a local / global component, you could set the localPosition.z of a widget/panel/gameObject and it would impact the z order of its children. This would make it possible to fix z order at a local scale while having nearly no effect on anything on the global scale.

Now, there is no way to organize the depth of widget by grouping them. GameObjects and panels don't have depth.

I know that it is frowned upon to talk about Flash in a Unity forum ( ), but the Flash's Display List is pretty awesome. It does away with the numbering of layers and insures that no two visual items are on the same layer. It uses a tree structure (much like the hierarchy) to order layers.

If we could have some way to organize widgets, have some base depth that we can set on a panel I think it could work. Otherwise it is just too tedious. We need to break the big problem of organizing depth into smaller ones so that we can wrap our mind around it.

Anyway, I'm just saying, what do I know I have just been doing UI for the past 8 years.

[ArenMook]

When instantiating prefabs inside a panel (for example objects inside a draggable panel), don't bring them to front.

If you need to adjust their depth, don't do so blindly. Drag & drop your prefab into where it's supposed to be instantiated in the UI hierarchy, adjust the depth there, then hit Apply. This way when you instantiate this prefab, it will already have the correct depth.

There is a lot I could do if I wasn't tied by certain Unity conventions, and tree based approach would indeed make sense. However it's just not feasible with the way Unity's hierarchy works right now.

The upcoming Unity GUI system does work with a tree-based depth approach where children are always drawn after parents, and you can change the order of siblings, and it works well -- but there had to be some code written on the C++ side in order to make moving of objects possible. It also is currently causing other issues that we're working on, but I won't get into those...

TLDR version is this: there is no perfect solution in a plug-in. The only way a perfect solution can happen is if the system itself (read: Unity) was designed with all this in mind to begin with.

[ArenMook]

But tell you guys what... I'm going to add a "depth" property to the panel in the next update. It will default to 0 (which will behave as it does now). Currently widgets are sorted just by their depth, but now it will first sort by panel depth, then by widget depth -- meaning that if you give a panel a higher depth value, its widgets will always be in front because the sorting algorithm will order the widgets to be last.

So if you were doing a popup, you'd just give its panel a higher depth value.

[mishaps]

that sounds awesome!

[ChrisR]

First off, thanks for taking all of this onboard Aren. And yes, that change does sound great.

Just a question (I assume the answer is yes, but just double checking) you will continue to provide support on NGUI 2.7.0 right?

Regarding a specific answer you had for me:

When instantiating prefabs inside a panel (for example objects inside a draggable panel), don't bring them to front.

If you need to adjust their depth, don't do so blindly. Drag & drop your prefab into where it's supposed to be instantiated in the UI hierarchy, adjust the depth there, then hit Apply. This way when you instantiate this prefab, it will already have the correct depth.

This works if the prefab only needs to be instantiated onto that specific panel. If the prefab gets used in multiple locations  - for example, an inventory of cards, but also a pack of cards, etc, then this becomes much more difficult to manage.

But it doesn't really matter, because I believe your change will fix my issues with this.

[zedia.net]

Thanks for the panel change, I think it should make it work.

Here is another suggestion: have a way of having widget sorted just by z. My guess is that you didn't want to go that way for 3D GUI, but if we could set the ordering somewhere to only use z because you know you are only using 2D that could be nice. So we could choose to use depth or z, but not both at the same time like before.

I am really happy to hear that Unity3D will use the tree approach in the future, if we could use the hierarchy to organize our layering that would be sick. It would actually be better than what Flash provided.

And by the way I love that you created the width and height properties. I was quite tired of creating a Vector3 every time I was just changing the with. Also it is way more readable.

[Ferazel]

Thanks for listening ArenMook. I understand that you try to find compromises all the time and it isn't easy to weigh everyone's needs.

Here is another suggestion: have a way of having widget sorted just by z. My guess is that you didn't want to go that way for 3D GUI, but if we could set the ordering somewhere to only use z because you know you are only using 2D that could be nice. So we could choose to use depth or z, but not both at the same time like before.

Using a Z-Depth only sounds pretty appealing to me. Not to mention that we can multi-edit transform z values, but it would also allow us to parent transforms. This would also allow us to intermix 3D elements with our UIs as mentioned in this post (http://www.tasharen.com/forum/index.php?topic=5999.0). Which is functionality we lost with the UIPanel no longer determining the Z-Positioning of the rendering in a 3D scene. I figure that this concept doesn't appeal to you though as depth has always been present in NGUI (and it does have purpose in regards to 3D UIs and perspective camera sorting/rendering).

[Nicki]

I'm in the middle of putting together a depth overview tool, so you can more easily handle many draw calls and set depths for many widgets at once. I'll post it here or maybe give it to ArenMook if he wants to include it or whatevers. This might be useful for more complex UIs, or at least that's why I'm making it - because I need it myself.

[N3uRo]

But tell you guys what... I'm going to add a "depth" property to the panel in the next update. It will default to 0 (which will behave as it does now). Currently widgets are sorted just by their depth, but now it will first sort by panel depth, then by widget depth -- meaning that if you give a panel a higher depth value, its widgets will always be in front because the sorting algorithm will order the widgets to be last.

So if you were doing a popup, you'd just give its panel a higher depth value.

Awesome!!!

[ArenMook]

I will never go back to using Z. It's as simple as that. First of all, I don't want to use the Transform. Second, Z is a float. Integers are faster, and easier to work with. Lastly, Z is just one of 3 components that defines the object's position in the 3D world. 2D and 3D UIs need to be consistent, and using Z one way with one, and another way with the other breaks consistency.

The panel depth has already been added yesterday, and is available for Pro users to play with.

[Markov]

so. what should I do without z order?
http://www.youtube.com/watch?v=KFA_x18yX3o&feature=youtu.be
And lots of stuff like this depends on z order in our project.

[ArenMook]

Panels and widgets both have Z. Use it.

[Markov]

Can you explane it better?
Now labels with name and exp everytime appear in front of BG sprite OR behind it(if I set depth < GB.depth in inspector)

[ArenMook]

All widgets are first sorted by their panel depth, and if the panel depth matches -- by their own depth. Higher depth causes stuff to appear in front.