Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.

...

How it works

In order to have the 2D Ui UI Canvas on any 3D object in the scene, the canvas is first rendered to a texture in screen space using a separate camera in the scene. On this canvas is a virtual cursor that is used to do collision testing with the UI elements on the canvas. With the "Virtual Input Module", the virtual cursor can interact with the elements on this UI as if it was in 2D.

...

  1. Import your canvas into the scene and set the render mode to "Screen Space - Camera"

  2. Add a "Graphic Raycaster" component to your canvas if it does not have one.

  3. In the asset browser go to "Assets->IglooToolkit->Resources->Prefabs->3D GUI"

  4. Add "UICamera" prefab to your scene and add the camera to the canvas "Render Camera"

  5. Add "Virtual Input Cursor" as the top child of your canvas.

  6. Add "Virtual input Event System" to your scene.

  7. Open the event system in the inspector. On the "Virtual Input Module" script add the cursor object to "Virtual Cursor" input, and add the "UICamera" to the "Canvas Camera" input.

  8. If the UICamera does not have a "Target Texture", create a renderTexture and apply.

  9. In the asset browser If there is not already an IglooManager prefab in your scene go to " Assets->IglooToolkit->Materials" and apply "3D_UI_Display" to the object that you want to display the UI. (If the render texture is not applied, apply it as the shader input)>Resources->Prefabs” and add one.

  10. Open the Igloo Manager in the inspector then add your canvas to “UI Canvas“, add the Cursor to “UI Cursor“ and add your render texture to “UI Texture“

Image Added

Usage

The “Example“ GameObject in the scene contains a script showing how the UI can be shown and hidden via scripting during Play.

...

Notes

  • The Cursor object does not get movement data from the windows cursor. You'll have to use your own method of input to translate the cursor on the canvas. In the example scene, we use the script "Player Pointer" attached to the main camera object, and the "Draw UI" script on the "6m_Screen" object to alter it's position.

  • It's recommended to add a new render layer for your 3D GUI, and go to the "Graphic Raycaster" on the canvas to set the "Blocking Mask" to your 3D GUI layer. Apply the layer to all the UI elements you want to be interactable.

...