动画与 Tween:让反馈清楚,也能安全中断
动画的第一职责是告诉玩家“发生了什么”。加分目标轻轻缩放、失败面板滑入,比没有反馈更容易理解。但动画不应该成为规则成立的唯一依据。

选哪一种工具
| 工具 | 适合什么 | 注意 |
|---|---|---|
| Tween | 脚本控制的位移、缩放等数值变化 | 明确目标、停止与复位 |
| Animation | 编辑器里编排可复用的属性时间线 | 管理播放状态与结束事件 |
| Spine/DragonBones 等骨骼方案 | 角色骨骼动作 | 资源版本、运行时与性能要匹配 |
| 粒子 | 爆炸、烟雾、收集特效 | 控制数量、透明覆盖与生命周期 |
最小 Tween 片段
// 函数片段:node 为有效 Node,base 为提前保存的原始缩放。
const feedback = tween(node)
.to(0.06, { scale: new Vec3(base.x * 0.9, base.y * 0.9, base.z) })
.to(0.06, { scale: base.clone() })
.start();
// 重开或停用时:
feedback.stop();
node.setScale(base);
需要从 cc 导入 tween、Vec3;完整装配脚本见ClickCollector。这里保存动画实例,停止范围清楚,不会把其他系统挂在同一节点上的所有动画一起停掉。
为什么越点越小
如果每次点击都把“当前缩放”当成原始值,而当前缩放可能处于动画中间,下一次就会继续缩小。正确做法是保存稳定基准,重新播放前停止旧反馈并复位。
Creator 3.8.4 起,Node 目标的 Tween 支持随节点 active 状态暂停和恢复;禁用某个组件与停用整个节点不同。对象池回收、重开和组件停用仍应明确清理自己拥有的动画。
中断必须有定义
结算时点击反馈怎么办?切关时场上飘字怎么办?加载失败后按钮的旋转动画怎么办?为每种动画确定:继续、停止并保持、停止并复位,或直接回收对象。
不要用“动画播完再加分”隐式决定玩法。确实需要等待,例如宝箱开启后显示奖励,也应让规则状态先锁定,动画结束只负责显示下一步。
给 AI:“实现短点击反馈,保存原始缩放;连点重播不累积变形;重开、禁用组件、回收时停止自己拥有的 Tween 并复位。请列出中断行为。”