事件类型
了解自动事件、交互事件、状态事件、碰撞事件、旋转事件和变量事件
Adseed 提供六种事件类型,覆盖从简单交互到复杂逻辑的各种场景。每种事件类型对应不同的触发机制,您可以根据需求选择合适的事件来实现交互效果。
自动事件
自动事件在页面加载完成后自动触发,无需用户操作。它是最简单的事件类型,适合用于实现入场效果和自动化行为。
触发机制
页面加载完成后,系统根据设置的延迟时间自动触发事件。
配置参数
| 参数 | 说明 |
|---|---|
| 延迟时间 | 页面加载后到事件触发的等待时间,单位为毫秒 |
使用场景
- 入场动画 — 页面加载后自动播放组件的出现动画
- 延迟提示 — 页面打开若干秒后弹出引导提示
- 自动播放背景音乐 — 页面加载时自动开始播放音频
- 序列入场效果 — 通过设置不同的延迟时间,让多个组件依次出现
将延迟时间设为 0 可以实现页面加载后立即触发。如果需要多个组件依次入场,可以为每个组件分别设置不同的延迟时间(如 0ms、300ms、600ms),营造出有节奏的序列入场效果。
交互事件
交互事件由用户操作触发,是最常用的事件类型。用户与组件进行交互时,系统会根据配置的交互方式触发对应的事件。
触发机制
用户对指定组件执行特定的交互操作时触发。
配置参数
| 参数 | 说明 |
|---|---|
| 交互组件 | 接收交互的组件或标签。选择标签时,该标签下任何组件的交互都会触发 |
| 交互方式 | 点击(click)、按下(mouseDown)、抬起(mouseUp) |
交互方式说明
- 点击(click) — 用户完成一次按下并松开的操作后触发,适用于按钮、链接等常规交互
- 按下(mouseDown) — 用户手指或鼠标按下的瞬间触发,响应速度最快
- 抬起(mouseUp) — 用户手指或鼠标松开时触发
使用场景
- 按钮点击 — 点击按钮后切换页面、显示弹窗
- 可点击元素 — 点击图片或文字触发动画效果
- 长按交互 — 结合 mouseDown 和 mouseUp 实现按住持续播放、松开停止的效果
- 拖拽配合 — mouseDown 开始拖拽,mouseUp 结束拖拽
交互组件支持选择标签,这样可以让多个相同标签的组件共享同一个交互事件,非常适合批量按钮或列表项的交互场景。结合 mouseDown 和 mouseUp 可以实现"按住说话"等按压式交互。
状态事件
状态事件在组件的内部状态发生变化时触发,主要用于监听组件的生命周期变化,例如动画播放结束、视频播放完毕等。
触发机制
当被监听的组件的指定属性发生变化时,系统自动触发事件。
配置参数
| 参数 | 说明 |
|---|---|
| 监听组件 | 要监听状态变化的组件 |
| 监听属性 | 要监听的特定属性(可选,留空则监听该组件的任何状态变化) |
常见的状态变化
- 动画播放结束 — 某个动画效果执行完毕
- 视频播放完成 — 视频组件播放到结尾
- 音频播放结束 — 音频组件播放完毕
- Spine 动画完成 — Spine 动画的某个动作播放结束
使用场景
- 串联动画 — 动画 A 播放结束后自动开始播放动画 B,形成动画链
- 视频播放后自动跳转 — 视频播放完成后自动切换到下一页
- 音频结束后显示内容 — 旁白音频结束后显示互动按钮
- 多段动画编排 — 多个动画按顺序接力播放,构建完整的动画叙事
状态事件是创建序列动画流程的关键工具。通过监听前一个动画的结束状态来触发下一个动画的播放,您可以精确地编排复杂的动画序列,而无需手动计算延迟时间。
碰撞事件
碰撞事件在两个组件的碰撞区域发生重叠时触发,是实现互动游戏和拖拽判定的核心事件类型。
触发机制
当碰撞源与碰撞目标的碰撞区域产生重叠时触发。
前置条件
使用碰撞事件前,参与碰撞的两个组件(或标签下的组件)都必须在属性面板中开启碰撞检测,并选择碰撞形状。
配置参数
| 参数 | 说明 |
|---|---|
| 碰撞源 | 第一组碰撞体(可以选择组件或标签) |
| 碰撞目标 | 第二组碰撞体(可以选择组件或标签) |
碰撞形状
- 矩形 — 使用矩形区域进行碰撞检测,适合方形或规则形状的组件
- 圆形 — 使用圆形区域进行碰撞检测,适合圆形或接近圆形的组件
自定义碰撞区域
碰撞区域的宽度和高度可以独立于组件的视觉尺寸进行配置。例如,您可以为一个小图标设置较大的碰撞区域,让用户更容易触发碰撞,提升操作体验。
使用场景
- 拖拽拼图 — 将拼图块拖到正确位置时触发吸附效果
- 接物游戏 — 移动篮子接住掉落的物品
- 配对游戏 — 将元素拖到对应的目标区域进行匹配
- 物理碰撞 — 模拟物体之间的碰撞反应
使用碰撞事件前,请确保相关组件已在属性面板中开启碰撞检测并选择了碰撞形状(矩形或圆形)。未开启碰撞检测的组件无法参与碰撞判定。
更多关于组件碰撞检测属性的设置,请参阅组件概览。
旋转事件
旋转事件在移动设备的屏幕方向发生变化时触发,用于响应横竖屏切换。
触发机制
设备从竖屏旋转为横屏,或从横屏旋转为竖屏时触发。
配置参数
| 参数 | 说明 |
|---|---|
| 触发方向 | 竖屏(portrait)或 横屏(landscape) |
使用场景
- 横竖屏布局切换 — 旋转设备时自动调整页面布局
- 方向特定内容 — 横屏时显示全景图片,竖屏时显示常规排版
- 创意互动 — 提示用户旋转手机以解锁隐藏内容
旋转事件仅在移动设备上有效。仅可在舞台级别使用,组件模板内不可用。
变量事件
变量事件在全局变量的值发生变化时触发,是实现计分系统、条件分支等高级交互逻辑的基础。
触发机制
当被监听的全局变量的值发生任何变化时触发。
配置参数
| 参数 | 说明 |
|---|---|
| 监听变量 | 要监听值变化的全局变量 |
使用场景
- 分数显示更新 — 分数变量变化时实时更新分数显示文本
- 进度追踪 — 监听进度变量,自动更新进度条
- 条件分支 — 结合条件判断,实现"当分数达到指定值时触发特定效果"
- 状态切换 — 监听状态变量,在不同状态之间切换页面内容
关于全局变量的创建和管理,请参阅全局变量。
变量事件在变量每次变化时都会触发。结合条件判断,可以实现"当分数达到 100 时显示通关画面"等复杂逻辑。如果只需要在变量达到特定值时触发效果,请在事件的条件配置中添加相应的判断条件。
这个页面有帮助吗?