> For the complete documentation index, see [llms.txt](https://spectrexr.gitbook.io/octoxr/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://spectrexr.gitbook.io/octoxr/user-interface/how-to-use.md).

# How To Use

### Setting Up

Drag and drop *<mark style="color:blue;">**LeftHand**</mark>* and *<mark style="color:blue;">**RightHand**</mark>* prefabs in the scene.

Reference *<mark style="color:blue;">**XRRig**</mark>* to *<mark style="color:blue;">**InputRoot**</mark>* of *<mark style="color:blue;">**MultiSourceInputDataProvider**</mark>* for each hand.

Make sure that there are no input modules or event systems in the scene.

Drag and drop *<mark style="color:blue;">**UIPointer**</mark>* prefab in the scene.

### Adjusting UIPointer

Reference corresponding dependencies to each concrete pointer implementation (right input provider and right palm if you want the pointer to be for right hand)

<figure><img src="/files/xloCMyrqNO2J92JsAROA" alt=""><figcaption></figcaption></figure>

<figure><img src="/files/GAzKfoUGlfAXTL1JPrGn" alt=""><figcaption></figcaption></figure>

Style your ray using *<mark style="color:blue;">**RayVisuals**</mark>*.

![](/files/kW4Gvwi4PluWtxXdmGyC)

### Testing

Use pinch gestures to operate UI elements

![](/files/XSDXMVDhBncwHtrxcbtF) ![](/files/bI0GP8g9k2QGrGAoFXot)

### NEED TO KNOW

*<mark style="color:blue;">**UIPointer**</mark>* uses *<mark style="color:blue;">**GraphicRaycaster**</mark>* to manipulate the canvas which means that canvas needs graphic elements. This can lead to unwanted behavior when no graphical elements are found on canvas. Make sure that every canvas has an *<mark style="color:blue;">**Image**</mark>* that covers whole width and height of the canvas. You can make that picture transparent. Then your *<mark style="color:blue;">**UIPointer**</mark>* will recognize the whole canvas.

Never rotate your UI elements by 180 degrees around Y axis, rather scale your element to negative value on X axis. That is because Z axis needs to point away from canvas!

<mark style="color:blue;">**UIPointer**</mark> component needs at least one concrete pointer to work (Hand, controller or your custom one).