2D UI for Oculus
Ashley Kwon (Spring 2023)
In this tutorial, I'll talk about how to build an interactive UI for Oculus on Unity. I referred to this video to make this tutorial.
Make a new Unity project and change the platform to Android under File -> Build Settings -> Platform.
Download and install the Oculus Integration package from Unity Asset Store.
Once you finish importing assets from the Oculus Integration package, you should see the Oculus folder under your Assets folder. Look for the UIHelpers and the OVRCameraRig prefabs in the Oculus folder and drag and drop them into your scene.
Add a Canvas object to your scene by right clicking in the Hierarchy window on the left-hand side as in the screenshot below:
5. Adding Canvas may add an Event Manager object in your scene by default. If so, delete this Event Manager object.
6. By clicking the Canvas object you just added, visualize the Inspector window on the right-hand side. Set the Layer to Default.
7. In the Oculus folder, look for the OVR Physics Raycaster script and add it to the OVRCameraRig in your scene by dragging and dropping the script to it.
8. Look for the OVR Raycaster script in the Oculus folder and add this script to Canvas.
9. (Only if you want your UI to move based on users' head position) If you click Canvas in the Hierarchy window, you will see in the Inspector window on the right-hand side that contains all settings for Canvas and scripts attached to it. Find Render Mode in the Inspector window and change it to Screen Space - Camera. Then, drag and drop CenterEyeAnchor, which is a child of OVRCameraRig.
10. In the Hierarchy window, click the triangle next to the UIHelpers object you added in 3. This will visualize all of its children. Click EventSystem and check in the Inspector window that it has the OVR Input Module script attached to it. Then, find RightHandAnchor, which is a child of OVRCameraRig's Tracking Space.
11. In the Inspector window for EventSystem, drag and drop RightHandAnchor to Ray Transform, which is under OVR Input Module, as in the screenshot below:
12. In the Hierarchy window, find LaserPointer, which is one of UIHelpers' children. Click LaserPointer to visualize its Inspector window and check LineRenderer as in the screenshot below. This will visualize a laser pointer from your controller when you run the app in your Oculus headset.
13. Right click on Canvas in the Hierarchy window and select UI elements you want to add under UI. These elements should be added as children of Canvas as in the screenshot below:
14. Write C# scripts for interactive UI functionalities you want to implement and attach them to Canvas. Usually if you want a function in your C# script to be run only upon certain interactions with UI element(s) on Canvas, your C# script will have a function that is run upon these interaction(s). This function should be a public function, which means it is accessible by components outside of your C# script. I'll refer to this function as SampleFunction.
15. Among Canvas' children, click the UI element you want to link SampleFunction to. Scroll down in the Inspector window and find "On Value Changed". Add a new interaction in this section by clicking the + tab at the bottom of this section.
16. In the newly created subsection for the interaction, drag and drop Canvas to which you attached your C# script in 14 and select the function you want to run by clicking the dropdown menu as in the screenshot below.
17. When you build and run the app in your Oculus headset, you should be able to trigger the interactive functionalities you added by pressing UI elements with your controller's trigger or buttons!