Interactive event

Demo

https://eva.js.org/playground/#/event

Install

With NPM

npm i @eva/plugin-renderer @eva/plugin-renderer-event

In Browser

<script src="https://unpkg.com/@eva/plugin-renderer-event@1.2.x/dist/EVA.plugin.renderer.event.min.js"></script>

System

import { EventSystem } from '@eva/plugin-renderer-event'

moveWhenInside boolean optional

Touchmove will also be triggered if it is not inside the gameObject, default is false.

Options

hitArea object optional

Click the hot zone, the response area of ​​the picture with transparency is the rectangular area of ​​the entire GameObject, so the response area can be set through the hitArea property. The attribute value of the hitArea area is relative to the rectangular area of ​​the GameObject. Normally, there is no need to set hitArea.

import {Event, EventSystem, HIT_AREA_TYPE} from '@eva/plugin-renderer-event'
game.addSystem(new EventSystem({
  moveWhenInside: true // default is false
}))
const evt = image.addComponent(
  new Event({
    hitArea: {
      type: HIT_AREA_TYPE.Polygon,
      style: {
        paths: [107, 49, 148, 24, 172, 28, 198, 77, 189, 106, 123, 198, 71, 180, 10, 80, 34, 32, 90, 37]
      }
    }
  })
)

Method

Event Component is used to support the event binding of Entity, the events are

on (eventName, listener)

Listen for events

off (eventName, listener)

Remove monitor

emit (eventName, …args)

trigger event

once (eventName, listener)

Listen for one-time events

Instance Event’s Arguments

Parameters of the listener function

{
  data:{
    pointerId: number,
    position: {x, y}
  },
  stopPropagation: ()=>{},
  gameObject: gameObject
}

Prevent events from bubbling up

event.stopPropagation()