跳到主要内容

动画与 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 并复位。请列出中断行为。”

依据:Tween 接口、Tween 示例、动画系统。