How does the 'interactable' component work?

I have a 3D model, and I want to be able to detect when you click on it,.

There is an interactable component with a ‘grab’ option that I think might be the key. Are there any posts or docs with a guid to how this component works?

Original Post on Discord

by user 563549194137239552

You can implement e.g. IPointerEventHandler on your component (it has a bunch of methods that you can use e.g. onPointerClick(args…))

Thanks! When I( click the arrow to go to docs on that component, it tries to open a video and fails… Windows 10… it also opens VS code, but trying to play a video was wierd

by user 563549194137239552

with those you will get callbacks automatically via the EventSystem. You need to have a raycaster component somewhere in your hierarchy tho (that is in the sample scenes a ObjectRaycaster component usually at the root - you can put it anywhere to remove objects from being hit-tested if you know you never want to interact with them)

On which component?

The interactable?

do you send or work with drag events as well? that would be so cool

by user 563549194137239552

yeah… on the interactable

by user 563549194137239552

it says "open script at /Interactables.ts and clicking it opens VS code, AND tries to play some video… probably VS Code trying to play the video and not you

by user 563549194137239552

Ok strange - for me it opens the docs :sweat_smile: win10 here still :slightly_smiling_face:

Oh ok

Ah you mean the blue link sorry I thought you meant the questionmark

blue link opens vscode + the script here. Strange

yeah… the blue l;ink

by user 563549194137239552

Do other blue links work?

You mean when you drag using the DragControls component or would you want to implement it yourself? The drag controls component also just uses those callbacks

e.g. onPointerDown onPointerUp onPointerEnter and onPointerExit

and DragControls has two events if you want to use those: “selectstart” and “selectend” right now

awesome info… this stuff is so hard to figure out how to do with raw three.js… you really have something here that’s very good for Unity folks to transition to WebXR

by user 563549194137239552