Stencil buffer mask render priority for Unity UI elements

101 Views Asked by At

Exposition.

Let's say we have some layers of UI elements:

  • backlane items [blue]
  • fog of war/curtain [grey]
  • stencil hole (fog of war reveal) [circle]
  • frontlane items (i.e. suggest bubbles) [red]

Here's what I want: expected result

Stencil hole should reveal a part of curtain and show items behind it. Also stencil hole has graphics on it and it should be rendered and placed in prefab above (after) the curtain.

Problem.

Things go wrong when I try to mask the stencil hole. I use the default Unity material as a base.

For hole: REF = 1, ALWAYS, REPLACE

For curtain: REF = 1, NOT EQUAL, REPLACE

  • in natural order, a hole renders later than a curtain and has no effect (curtain rendered without a hole).

backlane items not visible (blue missing)

  • if I change the render priority of the hole to Transparent-1, then the hole is rendered as expected. But the hole graphics go in the background and are not visible at all

hole graphics not visible (circle missing)

  • if I change the priority of the curtain to Transparent+1 then it overlaps frontlane items

curtain overlaps frontlane items (red cutted)

It's easy to change the order of elements—place the hole item before the curtain, and it would work. But I want to keep the stencil hole UI item above the curtain, closer to the frontlane - it's useful for positioning them next to each other. It also has some logic for building UI layers.

Question.

Is it possible to apply the mask of the hole in priority Transparent-1, but render it in default priority? So it goes mask → curtain → hole graphics

0

There are 0 best solutions below