Rive 101 logoRive 101
关于项目📋 变更总览EN
0%
进度0/88
6.9

监听器

3m 25s
Rive 101 - Listeners
  • 核心教学目标: 掌握 Rive 中监听器 (Listeners) 的配置流程,实现无需编写外部代码即可在状态机内闭环响应指针事件。
  • 背景痛点: 状态机中的状态切换通常依赖输入源(如布尔值 Boolean)的数值改变。若没有监听器,设计师必须依赖开发人员在外部绑定事件,或者手动在测试面板中勾选输入源,无法在产品内直接交付自带完整交互逻辑的资产。
  • 最终业务效益: 监听器构建了设计与运行时的交互桥梁。通过将指针移入 (Pointer Enter)、移出 (Pointer Exit) 等物理事件与状态机内部的输入源进行映射绑定,设计师可以独立完成复杂的 UI 组件级交互设计(如 Hover、Click 悬停与点击反馈),大幅度缩短动效交接的沟通路径。
  • Click 与 Pointer Down/Up 的空间约束差异: 标称的 Click 事件具有严格的空间拓扑限制,即指针必须在同一个 Target 图层的边界区域内完成按下与抬起全套动作;而 Pointer DownPointer Up 是离散的单步动作捕捉,用于实现更细腻的物理按压深度反馈。
  • 事件驱动数据流: Rive 内部的监听器逻辑遵循 事件 → 输入源 (Input) → 状态机条件 (Condition) → 时间轴跳转 的严谨闭环数据流。这意味着监听器不直接控制时间轴,而是通过修改底层数学变量(布尔、数值、触发器)间接影响状态。
  • 性能协作最佳实践: 自带监听器的 .riv 文件对前端或移动端开发极其友好。由于交互触发在 Rive 引擎内部完全自包含,运行时代码(Runtime Code)只需要加载视图,而不需要在页面层级重复编写复杂的 addEventListener 事件冒泡和拦截逻辑。
  • 区域触碰边界: 监听器所识别的“热区(Vicinity)”取决于绑定图层的绝对几何边界(Bounding Box)或矢量路径。若图层带有不规则的网格变形或透明通道,其热区边界仍由该资产的交互路径形状决定。