Custom background with LWRP

Unity Engine
1

Hi there.

I’m currently working on an AR mini game with ARFoundation. I managed to make it work with the LWRP so I can use the shader graph.

What I’m trying to achieve is to apply a black and white effect, but only on the device camera. The 3D objects on the scene should stay colored. I tried various things :

  • Using Post processing : but it’s not possible to stack cameras rendering in LWRP ( source ). Not sure if still relevant, I did’nt find anything new on this subject.
  • Using the ARCameraBackground component : I tried to setup the cutom Material with an unlit shader graph behind, but the screen stays white and the 3D objects are no more drawn (screen space canvas shows up). I checked various names for the input texture in the shader (like “_Texture”, “_Main”, …) but nothing works.

What am I missing here ? Any idea on how to solve this ?

Custom AR Background With URP and AR Core
2

On ARCore devices, there is a single texture property named “_MainTex”.

On ARKit devices, there are 2 texture properties named “_textureY” and “_textureCbCr”. Please refer to the ARKit captureImage documentation for more details.

You can also refer to the ARCore and ARKit shaders to see how AR Foundation renders the background.

  • Library/PackageCache/com.unity.xr.arcore@3.1.0-preview.1/Assets/Shaders/ARCoreBackground.shader
  • Library/PackageCache/com.unity.xr.arkit@3.1.0-preview.1/Assets/Shaders/ARKitLWRPBackground.shader

Todd

1 Like
3

Hi there, sorry for the (very long) reply time;

Thanks for the insights Todd. I finally got time to finish this up. For those who might need this, here is what I did. First some upgrades :

  • Upgrade project to 2019.3+
  • Upgrage LWRP to URP 7.1.8
  • Upgrade ARFoundation to 3.0.1
  • Upgrade ARCore to 3.0.1
  • Upgrade ARKit to 3.0.1

I created two custom GLSL & HLSL shaders based on the ARCore and ARKit ones you mentioned. A simple copy-paste with the addition of the desaturation part (see attached files).

I added the ARCameraBackground component to the Camera.

Since my app needs to run on Android and iOS, I created a simple script to automatically setup the proper Material in the ARCameraBackground component :

[RequireComponent(typeof(ARCameraBackground))]
public class ARBackgroundSwitcher : MonoBehaviour
{
    [SerializeField] private Material m_AndroidMaterial;
    [SerializeField] private Material m_IOSMaterial;

    private void Awake()
    {
        ARCameraBackground background = GetComponent<ARCameraBackground>();
        background.useCustomMaterial = true;
#if UNITY_ANDROID
        background.customMaterial = m_AndroidMaterial;
#elif UNITY_IOS
        background.customMaterial = m_IOSMaterial;
#endif
    }
}

Each material uses respectively the Android and iOS shader. Problem solved. :slight_smile:

5568082–574336–DesaturateAndroidARBackground.shader (2.27 KB)
5568082–574339–DesaturateIOSARBackground.shader (2.44 KB)

2 Likes
4

@Drakulo Thank you so much! In my project, we need a sepia effect but only for the camera image. And it caused me a lot of trouble to even know where to start especially as we also develop for IOS and Android. Your solution still works today.

1 Like
5

@Drakulo I can’t get why ARCore shader is pink in URP 12.1.6. What URP are you using?