Type: mp.input
Inputs
Property | Description |
---|---|
eventsEnabled: boolean default true |
If true, events will be available for binding or spying. If false, no events will fire. |
userNavigationEnabled: boolean default true |
If set to false, all showcase user based navigation will be turned off. |
unfiltered: boolean default ‘true’ |
If set to false, the input component will only receive unhandled events. |
Events
Property | |
---|---|
INTERACTION.CLICK | |
INTERACTION.DRAG_BEGIN | |
INTERACTION.DRAG | |
INTERACTION.DRAG_END | |
INTERACTION.POINTER_MOVE | |
INTERACTION.POINTER_BUTTON | |
INTERACTION.SCROLL | |
INTERACTION.KEY | |
INTERACTION.LONG_PRESS_START | |
INTERACTION.LONG_PRESS_END | |
INTERACTION.MULTI_SWIPE | |
INTERACTION.MULTI_SWIPE_END | |
INTERACTION.PINCH | |
INTERACTION.PINCH_END | |
INTERACTION.ROTATE | |
INTERACTION.ROTATE_END |
Usage
This component dispatches input and gesture events. These events can be used by bindings and spies. In addition, this component can disable default user navigation to facilitate integration with a custom navigation scheme.
// Create a scene object and node with an input component.
// Note you will probably only need one instance of an input component
// for your entire application.
const [ sceneObject ] = await sdk.Scene.createObjects(1);
const node = sceneObject.addNode();
const inputComponent = node.addComponent('mp.input', {
eventsEnabled: true,
userNavigationEnabled: false,
});
node.start();
// Define a click event spy
class ClickSpy {
public eventType = 'INTERACTION.CLICK';
public onEvent(payload: unknown) {
console.log('received', payload);
}
}
// Spy on the click event
inputComponent.spyOnEvent(new ClickSpy());
// You can enable navigation after starting the node.
inputComponent.inputs.userNavigationEnabled = true;
// You can turn off all events and the spy wont receive any callbacks.
inputComponent.inputs.eventsEnabled = false;