Perspective Camera and UIDraggablePanel goofiness

[Zyxil]

I'm using NGUI in perspective mode and have modeled my scrolling panels off of Example 7 - Scroll View (Panel).

When working this way, the draggable panel will not appear properly so you have to "float" it many units in front of the window panel (more than the described -.1f or -1f that makes sense).  What happens is the draggable panel, when it's moving, will think it's behind the window when you are near the beginning or end of the scrolling extent.  Once movement stops the panel will pop to the desired front of the window.

This is a drawing problem. The actual positions of the items do not change.

You can reproduce this easily:

1. Open the Example 7 - Scroll View (Panel)
2. Change the Camera to perspective mode
3. Change the Window Root transform Z value to 600
4. Note that the UIPanel (Clipped View) will not be visible.  You will need to move the clipped view Z to about -7.8 for it to appear in edit mode.
5. Hit Play and use mouse wheel to scroll.  The panel will blink out while moving and appear again when movement stops.

If you pull the panel forward to about -100, you will be able to see that the window is in front of the panel while moving.  You will also see that when you are in the middle of your panel, the effect is lessened (the panel stays visible or less sensitive to movement).  When the scroll position is close to either end, the effect is much greater.

Any idea what's going on here?

[ArenMook]

Different panels mean different draw calls, so it's up to Unity to sort them based on the transform's Z value. When working with a 3D UI you have to either make sure to use only one atlas / panel per window, or put your foreground objects on a different material with a different shader that will be drawn after your original one (for example Unlit/Transparent Overlay shader). This "Depth vs Z" topic is covered extensively in the FAQ.

[Zyxil]

I duplicated the fantasy atlas asset items and made sure the new items referenced each other correctly.  I then assigned the duplicated assets to the UIPanel (Clipped View) and about half of the elements of the items in the grid (got tired of the clicky clicky).  And it still evidenced the same behavior--even though this is a different atlas.

I also assigned several different shaders to the duplicated material, to no effect.

Is it just a bad idea to use a scrolling panel in a 3d UI?  I would like to use it because it adds to the organic sense of motion and flow that the game elements use, but not if it's not supported or so far outside of the design constraints of NGUI that it would be too much hassle to implement and maintain.

[ArenMook]

Same material = same draw call, even if the atlas is different. You need to actually create a different material in this case, with an overlay shader as I suggested.

[Zyxil]

I did that.  I duplicated all of the fantasy assets and made sure they referenced each other properly (fantasy atlas duplicates.png).

I then switched fantasy atlas 1 (material) to different shaders:

Unlit Transparent Colored (original): No change, of course
Unlit Transparent Colored (alpha): No change(makes sense)
Unlit Transparent Colored (hard clip): No change(makes sense)
Unlit Transparent Colored (soft clip): No change (this one should work, I would think)
Unlit Transparent Colored Overlay: While drag in process, all items are visible (no clipping).  When no drag, clipping makes full items invisible, but there is no clip line clipping items on the border of the clip zone (improper clipping.png is Game window).  Note improper clipping 2.png showing the editor window. The left and right visible items cross the clipping zone borders.  I circled the items that disappeared once the drag operation finishes.

All of this can be recreated using the changes I've described in these posts.

[ArenMook]

This happens because there is no clipping shader for the overlay shader. Make a copy of the softclip shader and change its renderqueue to that of the overlay shader.

[Zyxil]

Success!

This solves the problem.

When copying the "Unlit/Transparent Colored (SoftClip)" shader, these steps need to happen:
- rename the shader to: "Unlit/Transparent Colored Overlay (SoftClip)"
- add "+1" to line 14, result: "Queue" = "Transparent+1"