PixiJS v8 中处理指针/鼠标/触摸/滚轮交互时的事件…

在 PixiJS v8 中为显示对象启用并处理指针、鼠标、触摸、滚轮事件，包括 eventMode 设置、事件传播、命中测试、拖拽与光标样式。

适用场景

解决思路

1. 将需要交互的对象设置 container.eventMode = 'static' 以启用交互，然后用 .on()、addEventListener() 或 onEventName 属性处理器监听事件。
2. 理解 eventMode 取值：'none' 完全不交互且忽略子级；'passive' 为默认值，自身不交互但交互子级仍可用；'auto' 仅在父级可交互时才做命中测试；'static' 接收标准指针/鼠标/触摸事件；'dynamic' 类似 static，但指针静止时也会由 ticker 触发合成事件（用于光标下的动画对象）。
3. 按钮、UI 元素和拖拽目标使用 'static'；仅在对象会在静止光标下移动并需要持续 hover 更新时使用 'dynamic'。
4. 用 isInteractive() 检查对象是否能接收事件（'static' 返回 true，'passive' 返回 false）。
5. 跨设备兼容优先使用指针事件：pointerdown、pointerup、pointerupoutside、pointermove、pointerover、pointerout、pointerenter、pointerleave、pointertap、pointercancel。
6. 鼠标事件包括：mousedown、mouseup、mouseupoutside、mousemove、mouseover、mouseout、mouseenter、mouseleave、click、rightdown、rightup、rightupoutside、rightclick、wheel。
7. 触摸事件包括：touchstart、touchend、touchendoutside、touchmove、touchcancel、tap；每个触摸事件携带从原生 TouchEvent 复制的 altKey、ctrlKey、metaKey、shiftKey。
8. 全局移动事件 globalpointermove、globalmousemove、globaltouchmove 在指针每次移动时触发，无论指针是否在监听对象上。
9. 容器生命周期事件无需 eventMode：added、removed、destroyed、childAdded、childRemoved、visibleChanged。
10. 监听方式有三种：EventEmitter 风格（推荐）用 .on()、.once()、.off()；DOM 风格用 addEventListener() 并支持 { once: true }；属性式用 sprite.onclick = handler。
11. 在子级监听器中调用 event.stopPropagation() 阻止事件传播到父级。
12. 所有事件支持捕获阶段：在事件名后加 capture（如 pointerdowncapture、clickcapture），或在 addEventListener 中传 { capture: true }；捕获监听器在事件到达目标前触发，可用 event.stopImmediatePropagation() 阻止事件到达子级。
13. 命中测试遍历规则：eventMode = 'none' 的容器跳过自身及整个子树；interactiveChildren = false 的容器跳过其子级（容器自身仍可测试）；hitArea 覆盖基于边界的测试，只检查该形状；不可见、不可渲染或不可测量的对象被跳过。
14. 用 hitArea 覆盖基于边界的命中测试，可传入 Rectangle、Circle、Polygon，或自定义对象实现 contains(x, y) 方法；这也能通过减少检查的几何体来加速大型或复杂对象的命中测试。
15. 实现拖拽：在 pointerdown 中设 dragging = true，在 globalpointermove 中若 dragging 则更新位置（如 sprite.position.set(event.global.x, event.global.y) 或 button.parent.toLocal(event.global, undefined, button.position)），在 pointerup 和 pointerupoutside 中设 dragging = false。
16. 光标样式：按对象设置 cursor 属性；可复用光标可在事件系统上注册命名样式，如 app.renderer.events.cursorStyles.hover = "url('bunny_saturated.png'), auto"，然后 sprite.cursor = 'hover'；光标样式可为字符串（CSS cursor 值）、对象（作为 CSS 样式应用）或函数（以 mode 字符串调用）。
17. FederatedPointerEvent 常用字段：event.global（场景空间点）、event.client（相对视口的 CSS 像素点）、event.offset（相对目标容器的世界空间点，当前不支持）、event.target、event.currentTarget、event.pointerType（'mouse' | 'pen' | 'touch'）、event.pointerId、event.isPrimary、event.persistentDeviceId（始终为 0，为 DOM PointerEvent 类型兼容而存在）、event.pressure、event.button、event.buttons、event.altKey、event.ctrlKey、event.shiftKey、event.metaKey、event.nativeEvent，以及 event.preventDefault()、event.stopPropagation()、event.stopImmediatePropagation()。
18. FederatedWheelEvent 额外提供 deltaX、deltaY、deltaZ、deltaMode；滚轮事件在与指针事件相同的命中测试对象上触发。
19. 通过 eventFeatures 全局开关事件类别以提升性能：在 app.init 中配置 { move, globalMove, click, wheel }，或初始化后设置 app.renderer.events.features.globalMove = false。
20. 性能优化：对非交互子树设 eventMode = 'none' 完全跳过命中测试；对只需容器自身交互的容器设 interactiveChildren = false；对大型或复杂对象用 hitArea 以廉价形状检查替代边界测试；静止元素优先用 'static'，仅在对象在静止指针下移动或动画时用 'dynamic'；通过 eventFeatures 禁用未使用的事件特性（如 globalMove: false）以减少每帧开销。
21. 避免常见错误：默认 eventMode 是 'passive'，必须显式设为 'static' 或 'dynamic' 监听器才会触发；v8 已移除 buttonMode，用 cursor = 'pointer' 显示手型光标（interactive = true 仍可作为 eventMode = 'static' 的别名，但推荐用 eventMode）；v8 中 pointermove、mousemove、touchmove 仅在指针位于显示对象上时触发，拖拽或全局跟踪需用 globalpointermove、globalmousemove、globaltouchmove；cursor 不会从父级继承，只有直接命中目标的 cursor 值生效，若需统一光标需在每个可交互子级上单独设置，或在父级设 hitArea 并让子级不可交互。

适用边界 · 注意事项

• 非 PixiJS v8 项目或未使用 PixiJS 事件系统的场景不适用。
• 不需要任何指针/鼠标/触摸/滚轮交互的纯渲染或静态展示场景无需配置这些事件。
• 若已使用其他输入框架（如自定义输入层或第三方交互库）接管事件，则不应重复配置 PixiJS 事件系统。