Previously we saw how to set up a Unity project to work with Oculus Passthrough API and how we can create an augmented interactable object. If you haven’t checked out the first two parts of this series, we highly recommend checking it out as the API will not work without the right settings and the knowledge from previous parts is required here as well.
In this blog post, we’ll learn how to customize the passthrough layer. There are various ways to customize passthrough. It could be through styling or composite layering or by surface-projected passthrough implementation. Our focus, for now, is going to be on styling, where we will write a script that will allow us to change the brightness, contrast, alpha and posterize values of the passthrough.
Let's start by creating a canvas with four sliders. The values from these sliders will later be used to change the brightness, contrast, alpha and posterize values of the passthrough.
The result of what we have created is the UI Canvas. Now, you hit play and view the canvas.
Note: While in play mode make any position or size adjustment if needed → copy the values → exit the play mode and paste the values back into the component.
At this current state, we’ll be just able to view the UI canvas but not interact with it. To make it interactable we need to add a few components and helper prefabs to our scene.
You can now hit play and test the UI interaction.
Now that we have the slider UI ready, we can write a script that will take the slider values to adjust different parameters of the passthrough layer. Thus, we will be able to customize it.
In the next section we have the breakdown of the code as well, so don't worry if you are not able to understand the code immediately.
Create a new C# script, name it as StylingPassthrough and copy the following code. The code will use the events from the slider to update the parameters of the passthrough layer.
Declaration
Variable NameTypeUsepassthroughLayerfloatTo store the value between 0 and 1 from the slider. The value will determine the brightness of the passthrough layer.setBrightnessfloatTo store the value between 0 and 1 from the slider. The value will determine the brightness of the passthrough layer.setContrastfloatTo store the value between 0 and 1 from the slider. The value will determine the contrast of the passthrough layer.setPosterizefloatTo store the value between 0 and 1 from the slider. The value will determine the posterize of the passthrough layer.setEdgeColorColorTo store the alpha Color of the rendered edges.
Initialization
At the start when this script is enabled for the first time, we want the Passthrough Layer’s fields to be set to zero. In particular, we want to set the brightness, contrast, alpha value of edge color and posterize to zero. So using the properties of the Passthrough Layer the respective field is initialized to zero.
Methods
The UI sliders have an event called On Value Changed which gets called when the value of the slider changes. The event can send the current value as a float type dynamic argument. So by making use of that feature we can change the Passthrough Layer’s fields dynamically using public methods.
When the OnBrightnessChanged method is invoked by the On Value Changed event of the slider, it passes the slider values as float parameters to this method. Which then sets the Passthrough filter’s brightness to that value.
Other methods OnContrastChanged, OnAlphaChangedwork and OnPosterizeChanged work in the same way as well. The only then we need to be care full about is to assign the right method to the right slider
In this section, we’ll see how to set up the OVRPassthroughLayer component. We’ll also see how to assign the StylingPassthrough component’s methods to the slider's events.
With that, we have finished setting up our scene for customizing the Passthrough during run time. You can hit play and test it.
The whole intent of this blog was to understand and learn about the passthrough filter. When you play around with this scene you will be able to have a better understanding of the passthrough filter. What we saw above was just one part of this. There are other ways of using a passthrough filter as well as we mentioned earlier. You can find different types of example scenes showing the various implementation of passthrough in the Oculus Integration package. In the project folder navigate to Assets → Oculus → SampleFramework → Usage → Passthrough, to find the example scenes. To learn more you can check out this documentation.
If you've enjoyed the insights shared here, why not spread the word? Share the post with your friends and colleagues who might also find it valuable.
Your support means the world to us and helps us create more content you'll love.