feat(guide): 添加引导手势动画播放功能

新增dianji(点击)、huadong(滑动)两款手势动画资源及元数据文件
扩展GuideComp引导组件:新增CCString导入、动画名称配置属性,实现延迟加载并播放指定动画的逻辑,包含异常日志处理
更新引导预制体:将原hand节点重命名为shouzhi,添加Animation组件并绑定两款动画剪辑,调整默认配置
This commit is contained in:
pan
2026-06-12 08:57:44 +08:00
parent 1c74138334
commit 531343c0d7
7 changed files with 1547 additions and 240 deletions

View File

@@ -0,0 +1,258 @@
[
{
"__type__": "cc.AnimationClip",
"_name": "dianji",
"_objFlags": 0,
"__editorExtras__": {
"embeddedPlayerGroups": []
},
"_native": "",
"sample": 15,
"speed": 1,
"wrapMode": 2,
"enableTrsBlending": false,
"_duration": 0.6666666666666666,
"_hash": 500763545,
"_tracks": [
{
"__id__": 1
}
],
"_exoticAnimation": null,
"_events": [],
"_embeddedPlayers": [],
"_additiveSettings": {
"__id__": 11
},
"_auxiliaryCurveEntries": []
},
{
"__type__": "cc.animation.VectorTrack",
"_binding": {
"__type__": "cc.animation.TrackBinding",
"path": {
"__id__": 2
},
"proxy": null
},
"_channels": [
{
"__id__": 3
},
{
"__id__": 5
},
{
"__id__": 7
},
{
"__id__": 9
}
],
"_nComponents": 3
},
{
"__type__": "cc.animation.TrackPath",
"_paths": [
"position"
]
},
{
"__type__": "cc.animation.Channel",
"_curve": {
"__id__": 4
}
},
{
"__type__": "cc.RealCurve",
"_times": [
0,
0.3333333333333333,
0.6666666666666666
],
"_values": [
{
"__type__": "cc.RealKeyframeValue",
"interpolationMode": 0,
"tangentWeightMode": 0,
"value": 0,
"rightTangent": 0,
"rightTangentWeight": 1,
"leftTangent": 0,
"leftTangentWeight": 1,
"easingMethod": 0,
"__editorExtras__": {
"tangentMode": 0
}
},
{
"__type__": "cc.RealKeyframeValue",
"interpolationMode": 0,
"tangentWeightMode": 0,
"value": 20.685,
"rightTangent": 0,
"rightTangentWeight": 1,
"leftTangent": 0,
"leftTangentWeight": 1,
"easingMethod": 0,
"__editorExtras__": {
"tangentMode": 0
}
},
{
"__type__": "cc.RealKeyframeValue",
"interpolationMode": 0,
"tangentWeightMode": 0,
"value": 0,
"rightTangent": 0,
"rightTangentWeight": 1,
"leftTangent": 0,
"leftTangentWeight": 1,
"easingMethod": 0,
"__editorExtras__": {
"tangentMode": 0
}
}
],
"preExtrapolation": 1,
"postExtrapolation": 1
},
{
"__type__": "cc.animation.Channel",
"_curve": {
"__id__": 6
}
},
{
"__type__": "cc.RealCurve",
"_times": [
0,
0.3333333333333333,
0.6666666666666666
],
"_values": [
{
"__type__": "cc.RealKeyframeValue",
"interpolationMode": 0,
"tangentWeightMode": 0,
"value": 0,
"rightTangent": 0,
"rightTangentWeight": 1,
"leftTangent": 0,
"leftTangentWeight": 1,
"easingMethod": 0,
"__editorExtras__": {
"tangentMode": 0
}
},
{
"__type__": "cc.RealKeyframeValue",
"interpolationMode": 0,
"tangentWeightMode": 0,
"value": -58.235,
"rightTangent": 0,
"rightTangentWeight": 1,
"leftTangent": 0,
"leftTangentWeight": 1,
"easingMethod": 0,
"__editorExtras__": {
"tangentMode": 0
}
},
{
"__type__": "cc.RealKeyframeValue",
"interpolationMode": 0,
"tangentWeightMode": 0,
"value": 0,
"rightTangent": 0,
"rightTangentWeight": 1,
"leftTangent": 0,
"leftTangentWeight": 1,
"easingMethod": 0,
"__editorExtras__": {
"tangentMode": 0
}
}
],
"preExtrapolation": 1,
"postExtrapolation": 1
},
{
"__type__": "cc.animation.Channel",
"_curve": {
"__id__": 8
}
},
{
"__type__": "cc.RealCurve",
"_times": [
0,
0.3333333333333333,
0.6666666666666666
],
"_values": [
{
"__type__": "cc.RealKeyframeValue",
"interpolationMode": 0,
"tangentWeightMode": 0,
"value": 0,
"rightTangent": 0,
"rightTangentWeight": 1,
"leftTangent": 0,
"leftTangentWeight": 1,
"easingMethod": 0,
"__editorExtras__": {
"tangentMode": 0
}
},
{
"__type__": "cc.RealKeyframeValue",
"interpolationMode": 0,
"tangentWeightMode": 0,
"value": 0,
"rightTangent": 0,
"rightTangentWeight": 1,
"leftTangent": 0,
"leftTangentWeight": 1,
"easingMethod": 0,
"__editorExtras__": {
"tangentMode": 0
}
},
{
"__type__": "cc.RealKeyframeValue",
"interpolationMode": 0,
"tangentWeightMode": 0,
"value": 0,
"rightTangent": 0,
"rightTangentWeight": 1,
"leftTangent": 0,
"leftTangentWeight": 1,
"easingMethod": 0,
"__editorExtras__": {
"tangentMode": 0
}
}
],
"preExtrapolation": 1,
"postExtrapolation": 1
},
{
"__type__": "cc.animation.Channel",
"_curve": {
"__id__": 10
}
},
{
"__type__": "cc.RealCurve",
"_times": [],
"_values": [],
"preExtrapolation": 1,
"postExtrapolation": 1
},
{
"__type__": "cc.AnimationClipAdditiveSettings",
"enabled": false,
"refClip": null
}
]

View File

@@ -0,0 +1,13 @@
{
"ver": "2.0.3",
"importer": "animation-clip",
"imported": true,
"uuid": "70fd0e99-c640-4497-b2c2-936f5179f227",
"files": [
".cconb"
],
"subMetas": {},
"userData": {
"name": "dianji"
}
}

View File

@@ -0,0 +1,258 @@
[
{
"__type__": "cc.AnimationClip",
"_name": "huadong",
"_objFlags": 0,
"__editorExtras__": {
"embeddedPlayerGroups": []
},
"_native": "",
"sample": 10,
"speed": 1,
"wrapMode": 2,
"enableTrsBlending": false,
"_duration": 1,
"_hash": 500763545,
"_tracks": [
{
"__id__": 1
}
],
"_exoticAnimation": null,
"_events": [],
"_embeddedPlayers": [],
"_additiveSettings": {
"__id__": 11
},
"_auxiliaryCurveEntries": []
},
{
"__type__": "cc.animation.VectorTrack",
"_binding": {
"__type__": "cc.animation.TrackBinding",
"path": {
"__id__": 2
},
"proxy": null
},
"_channels": [
{
"__id__": 3
},
{
"__id__": 5
},
{
"__id__": 7
},
{
"__id__": 9
}
],
"_nComponents": 3
},
{
"__type__": "cc.animation.TrackPath",
"_paths": [
"position"
]
},
{
"__type__": "cc.animation.Channel",
"_curve": {
"__id__": 4
}
},
{
"__type__": "cc.RealCurve",
"_times": [
0,
0.7,
1
],
"_values": [
{
"__type__": "cc.RealKeyframeValue",
"interpolationMode": 0,
"tangentWeightMode": 0,
"value": 0,
"rightTangent": 0,
"rightTangentWeight": 1,
"leftTangent": 0,
"leftTangentWeight": 1,
"easingMethod": 0,
"__editorExtras__": {
"tangentMode": 0
}
},
{
"__type__": "cc.RealKeyframeValue",
"interpolationMode": 0,
"tangentWeightMode": 0,
"value": 0,
"rightTangent": 0,
"rightTangentWeight": 1,
"leftTangent": 0,
"leftTangentWeight": 1,
"easingMethod": 0,
"__editorExtras__": {
"tangentMode": 0
}
},
{
"__type__": "cc.RealKeyframeValue",
"interpolationMode": 0,
"tangentWeightMode": 0,
"value": 0,
"rightTangent": 0,
"rightTangentWeight": 1,
"leftTangent": 0,
"leftTangentWeight": 1,
"easingMethod": 0,
"__editorExtras__": {
"tangentMode": 0
}
}
],
"preExtrapolation": 1,
"postExtrapolation": 1
},
{
"__type__": "cc.animation.Channel",
"_curve": {
"__id__": 6
}
},
{
"__type__": "cc.RealCurve",
"_times": [
0,
0.7,
1
],
"_values": [
{
"__type__": "cc.RealKeyframeValue",
"interpolationMode": 0,
"tangentWeightMode": 0,
"value": 0,
"rightTangent": 0,
"rightTangentWeight": 1,
"leftTangent": 0,
"leftTangentWeight": 1,
"easingMethod": 0,
"__editorExtras__": {
"tangentMode": 0
}
},
{
"__type__": "cc.RealKeyframeValue",
"interpolationMode": 0,
"tangentWeightMode": 0,
"value": 213.527,
"rightTangent": 0,
"rightTangentWeight": 1,
"leftTangent": 0,
"leftTangentWeight": 1,
"easingMethod": 0,
"__editorExtras__": {
"tangentMode": 0
}
},
{
"__type__": "cc.RealKeyframeValue",
"interpolationMode": 0,
"tangentWeightMode": 0,
"value": 0,
"rightTangent": 0,
"rightTangentWeight": 1,
"leftTangent": 0,
"leftTangentWeight": 1,
"easingMethod": 0,
"__editorExtras__": {
"tangentMode": 0
}
}
],
"preExtrapolation": 1,
"postExtrapolation": 1
},
{
"__type__": "cc.animation.Channel",
"_curve": {
"__id__": 8
}
},
{
"__type__": "cc.RealCurve",
"_times": [
0,
0.7,
1
],
"_values": [
{
"__type__": "cc.RealKeyframeValue",
"interpolationMode": 0,
"tangentWeightMode": 0,
"value": 0,
"rightTangent": 0,
"rightTangentWeight": 1,
"leftTangent": 0,
"leftTangentWeight": 1,
"easingMethod": 0,
"__editorExtras__": {
"tangentMode": 0
}
},
{
"__type__": "cc.RealKeyframeValue",
"interpolationMode": 0,
"tangentWeightMode": 0,
"value": 0,
"rightTangent": 0,
"rightTangentWeight": 1,
"leftTangent": 0,
"leftTangentWeight": 1,
"easingMethod": 0,
"__editorExtras__": {
"tangentMode": 0
}
},
{
"__type__": "cc.RealKeyframeValue",
"interpolationMode": 0,
"tangentWeightMode": 0,
"value": 0,
"rightTangent": 0,
"rightTangentWeight": 1,
"leftTangent": 0,
"leftTangentWeight": 1,
"easingMethod": 0,
"__editorExtras__": {
"tangentMode": 0
}
}
],
"preExtrapolation": 1,
"postExtrapolation": 1
},
{
"__type__": "cc.animation.Channel",
"_curve": {
"__id__": 10
}
},
{
"__type__": "cc.RealCurve",
"_times": [],
"_values": [],
"preExtrapolation": 1,
"postExtrapolation": 1
},
{
"__type__": "cc.AnimationClipAdditiveSettings",
"enabled": false,
"refClip": null
}
]

View File

@@ -0,0 +1,13 @@
{
"ver": "2.0.3",
"importer": "animation-clip",
"imported": true,
"uuid": "be8b49e0-c726-4c44-823e-d50921b886d3",
"files": [
".cconb"
],
"subMetas": {},
"userData": {
"name": "huadong"
}
}

View File

@@ -24,23 +24,23 @@
],
"_active": true,
"_components": [
{
"__id__": 12
},
{
"__id__": 14
},
{
"__id__": 16
},
{
"__id__": 18
}
],
"_prefab": {
"__id__": 18
"__id__": 20
},
"_lpos": {
"__type__": "cc.Vec3",
"x": 0,
"y": 640,
"y": 0,
"z": 0
},
"_lrot": {
@@ -82,11 +82,11 @@
"_active": true,
"_components": [
{
"__id__": 9
"__id__": 11
}
],
"_prefab": {
"__id__": 11
"__id__": 13
},
"_lpos": {
"__type__": "cc.Vec3",
@@ -119,7 +119,7 @@
},
{
"__type__": "cc.Node",
"_name": "hand",
"_name": "shouzhi",
"_objFlags": 0,
"__editorExtras__": {},
"_parent": {
@@ -133,10 +133,13 @@
},
{
"__id__": 6
},
{
"__id__": 8
}
],
"_prefab": {
"__id__": 8
"__id__": 10
},
"_lpos": {
"__type__": "cc.Vec3",
@@ -240,6 +243,39 @@
"__type__": "cc.CompPrefabInfo",
"fileId": "e4qJ7s1yxD9JrYdfGLFkVo"
},
{
"__type__": "cc.Animation",
"_name": "",
"_objFlags": 0,
"__editorExtras__": {},
"node": {
"__id__": 3
},
"_enabled": true,
"__prefab": {
"__id__": 9
},
"playOnLoad": false,
"_clips": [
{
"__uuid__": "70fd0e99-c640-4497-b2c2-936f5179f227",
"__expectedType__": "cc.AnimationClip"
},
{
"__uuid__": "be8b49e0-c726-4c44-823e-d50921b886d3",
"__expectedType__": "cc.AnimationClip"
}
],
"_defaultClip": {
"__uuid__": "70fd0e99-c640-4497-b2c2-936f5179f227",
"__expectedType__": "cc.AnimationClip"
},
"_id": ""
},
{
"__type__": "cc.CompPrefabInfo",
"fileId": "68wJojAspAaqazqpHr1Fes"
},
{
"__type__": "cc.PrefabInfo",
"root": {
@@ -263,7 +299,7 @@
},
"_enabled": true,
"__prefab": {
"__id__": 10
"__id__": 12
},
"_contentSize": {
"__type__": "cc.Size",
@@ -304,7 +340,7 @@
},
"_enabled": true,
"__prefab": {
"__id__": 13
"__id__": 15
},
"_contentSize": {
"__type__": "cc.Size",
@@ -332,7 +368,7 @@
},
"_enabled": true,
"__prefab": {
"__id__": 15
"__id__": 17
},
"_alignFlags": 45,
"_target": null,
@@ -368,12 +404,13 @@
},
"_enabled": true,
"__prefab": {
"__id__": 17
"__id__": 19
},
"hand": {
"__id__": 2
},
"guide_id": 0,
"animation_name": "dianji",
"_id": ""
},
{
@@ -389,6 +426,7 @@
"__id__": 0
},
"fileId": "6dh4o/8p1Cy5An1p6o4Bc3",
"instance": null,
"targetOverrides": null
}
]

File diff suppressed because it is too large Load Diff

View File

@@ -1,6 +1,6 @@
import { mLogger } from "../common/Logger";
import { _decorator, Animation, AnimationClip, EventTouch, Label, Node, NodeEventType, Sprite, SpriteAtlas, Tween, tween, UIOpacity, Vec3, resources, Light, UITransform, Widget, CCInteger } from "cc";
import { _decorator, Animation, AnimationClip, EventTouch, Label, Node, NodeEventType, Sprite, SpriteAtlas, Tween, tween, UIOpacity, Vec3, resources, Light, UITransform, Widget, CCInteger, CCString } from "cc";
import { ecs } from "../../../../extensions/oops-plugin-framework/assets/libs/ecs/ECS";
import { CCComp } from "../../../../extensions/oops-plugin-framework/assets/module/common/CCComp";
import { smc } from "../common/SingletonModuleComp";
@@ -22,7 +22,9 @@ export class GuideComp extends CCComp {
/** 引导编号 ID */
@property({ type: CCInteger })
guide_id: number = 0
/** 动画名称 ID */
@property({ type: CCString })
animation_name: string = 'dianji';
onLoad() {
// 如果该引导已经完成,则隐藏并销毁本节点
@@ -32,6 +34,35 @@ export class GuideComp extends CCComp {
return;
}
// 播放手势动画
if (this.hand && this.animation_name) {
// 延迟一帧播放,防止组件还未完全激活
this.scheduleOnce(() => {
if (!this.isValid) return; // 防止节点已被销毁
// 1. 先尝试在绑定的 this.hand 本身上查找 Animation 组件
let anim = this.hand.getComponent(Animation);
// 2. 如果没找到,再尝试去它的子节点上找
if (!anim) {
anim = this.hand.getComponentInChildren(Animation);
}
if (anim) {
// 确保目标动画状态存在
const animState = anim.getState(this.animation_name);
if (animState) {
anim.play(this.animation_name);
mLogger.log(this.debugMode, 'Guide', `成功播放引导动画: ${this.animation_name}`);
} else {
mLogger.warn(this.debugMode, 'Guide', `找到了 Animation 组件,但组件内未挂载名为 '${this.animation_name}' 的动画剪辑(Clip)。请检查编辑器 Animation 组件的 Clips 列表!`);
}
} else {
mLogger.warn(this.debugMode, 'Guide', `在 hand 节点及其子节点下均未找到 Animation 组件,无法播放动画: ${this.animation_name}`);
}
});
}
// 监听手势节点点击事件
if (this.hand) {
this.hand.on(NodeEventType.TOUCH_START, this.onTouchStart, this);