Create Poke Interactions
In this tutorial, you learn how to use poke interactions to poke a rectangular button with your hands, controllers, or controller driven hands. To try poke interactions in a pre-built scene, see the
PokeExamples scene.
Poke interactors let you initiate a poke with your hands, controllers, or controller driven hands. There are two types of poke interactor, HandPokeInteractor for hands and controller driven hands, and ControllerPokeInteractor for controllers.
Adding Hand Poke Interactors for Hands
- Open the Unity scene where you set up your hands.
Under Project, search for HandPokeInteractor, and drag the HandPokeInteractor prefab from the search results onto OVRInteraction > OVRHands > LeftHand > HandInteractorsLeft. The prefab contains all the components needed for poke to work out of the box.
Your hierarchy should look like this.
- Under Hierarchy, select HandInteractorsLeft.
- Under Inspector, add a new element to the Interactors list by clicking +.
Set the element to HandPokeInteractor by dragging HandPokeInteractor from Hierarchy to the element’s property.
Repeat these steps for the right hand.
Your hierarchy should look like this, with a HandPokeInteractor for each hand.
Adding Hand Poke Interactors for controller driven hands
- Open the Unity scene where you set up your controller driven hands.
Under Project, search for HandPokeInteractor, and drag the HandPokeInteractor prefab from the search results onto OVRInteraction > OVRControllerDrivenHands > LeftControllerHand > ControllerHandInteractors.
Your hierarchy should look like this.
- Under Hierarchy, select ControllerHandInteractors.
- Under Inspector, add a new element to the Interactors list by clicking +.
Set the element to HandPokeInteractor by dragging HandPokeInteractor from Hierarchy to the element’s property.
Repeat these steps for the right controller hand.
Your hierarchy should now have a HandPokeInteractor for each controller hand.
Adding Controller Poke Interactors
- Open the Unity scene where you set up your controllers.
Under Project, search for ControllerPokeInteractor, and drag the ControllerPokeInteractor prefab from the search results onto OVRInteraction > OVRControllers > LeftController > ControllerInteractors.
Your hierarchy should look like this.
- Under Hierarchy, select ControllerInteractors.
- Under Inspector, in the Best Hover Interactor Group component, click the + to add a new element to the Interactors list.
Set the element to ControllerPokeInteractor.
- Repeat these steps for the right controller.
Poke interactables let you poke the object they’re attached to.
- Add an empty GameObject named Button to your scene by right-clicking in Hierarchy and selecting Create Empty.
- Position Button in front of the camera.
- Add two empty children to Button named Model and Visuals by right-clicking Button and then selecting Create Empty.
- Add an empty child to Model named Surface. Surface will determine the backstop of the button.
Add a plane to Visuals named ButtonVisual by right-clicking Visuals and then selecting 3D Object > Plane.
Your hierarchy should look like this.
- Under Hierarchy, select Button.
- Under Inspector, add a Poke Interactable by clicking Add Component and then searching for Poke Interactable.
- Under Hierarchy, select Surface.
- Under Inspector, add these components, which define the button’s pokable surface.
- Plane Surface
- Clipped Plane Surface
- Bounds Clipper
Your Surface GameObject should look like this.
- Under Hierarchy, select ButtonVisual.
Under Inspector, remove Plane (Mesh Filter) and Mesh Collider by clicking the 3 dots on each component and then selecting Remove Component.
ButtonVisual after deleting the components.
- Add these components, which define how the button looks.
- Poke Interactable Visual
- Mesh Filter
- Material Property Block Editor
- Rounded Box Properties
- Interactable Color Visual
ButtonVisual after adding the new components.
In the Mesh Renderer component, in the Materials list, set the Element 0 property to RoundedBoxUnlit by clicking the small round button to the right of the input field and searching for RoundedBoxUnlit. If the material doesn’t appear in the results, then instead in the Project window’s search bar, enter RoundedBoxUnlit.
- In the Poke Interactable Visual component, set the Poke Interactable property to Button and the Button Base Transform property to Surface.
In the Mesh Filter component, set the Mesh property to Quad by clicking the Object Picker button (the small round button to the right of the input field) and searching for Quad. Quad makes the button a rectangle. However, you can choose a different option if you’d rather use a different shape.
In the Interactable Color Visual component, set the Interactable View property to Button and the Editor property to ButtonVisual.
- Under Hierarchy, select Surface.
- Under Inspector, in the Transform component, in the Scale property, set Z to 0.001.
- In the Clipped Plane Surface component, set the Plane Surface property to Surface.
- In the same component, click the + to add an element to the Clippers list.
Set the element to Surface.
The Clipped Plane Surface component should look like this.
- Under Hierarchy, select Button.
Under Inspector, in the Poke Interactable component, set the Surface Patch property to Surface.
- Under Hierarchy, select Visuals.
- Move Visuals on the Z-axis so it is slightly closer to the camera than the Model GameObject. This allows the button to visually move backwards when you poke it.
Select File > Build And Run, or if you have a Link connected, click Play.
When the current scene loads, use your hands or controllers to press the button. When you press the button, it moves away from you, and returns to its original position when you release it.