Translucent UI Materials sorting with translucent world objects on iOS

Development Programming & Scripting UI
, , , , , , ,
1

I have a fairly basic UMG widget for a HUD, that uses translucent UI materials, that appears to be flickering on and off (on iOS only) trying to sort with translucent objects in the world. Here’s a short clip:

There are quite a few translucent things in the world at different times, but in the second half of the video you can see that the translucent HUD parts disappear at the same time as the pick-axes are spawning their effects.

  • This doesn’t happen on PC (the game has shipped on PC) or in Mobile preview, only on the device
  • Only the translucent “UserInterface” materials are having the issue - the alpha texture elements are fine
  • It worked ok on these devices before I converted to a code project and compiled/packaged on a Mac
  • Happens on both my devices - iPad 3 using ES2 and iPhone 6S Plus using Metal

So my first question is - is there anything iOS-shader-related that compiles differently on a Mac? Or depth buffer handled differently? Any random flags I can change that might affect sorting on the device?

This is a packaged shipping build.

2

I wasn’t able to figure this out in sufficient time so I just bit the bullet and converted my HUD to use only alpha textures and no UI materials. There are now no sorting conflicts with world particles. Pretty heavy limitation in the end but I can get away with it in my case.

For the record, some of the things I tried that didn’t help:

  • Moving the (orthographic) camera very far back from the play area
  • Setting all particles to use fixed, small bounds (in case any were overlapping the camera near plane)
  • Deleted anything in the world that was possibly overlapping camera near plane
  • Increased the Z order of all widgets when adding to viewport
  • Tried unchecking any world materials with “disable depth test” checked