@eva/spine-base 2.0.1-beta.9 → 2.0.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/EVA.plugin.spineBase.js +103 -12
- package/dist/EVA.plugin.spineBase.min.js +1 -1
- package/dist/spine-base.cjs.js +322 -15
- package/dist/spine-base.cjs.prod.js +2 -2
- package/dist/spine-base.d.ts +221 -0
- package/dist/spine-base.esm.js +322 -15
- package/package.json +4 -4
package/dist/spine-base.d.ts
CHANGED
|
@@ -3,34 +3,224 @@ import { Component } from '@eva/eva.js';
|
|
|
3
3
|
import { ComponentChanged } from '@eva/eva.js';
|
|
4
4
|
import { Container } from 'pixi.js';
|
|
5
5
|
import { ContainerManager } from '@eva/plugin-renderer';
|
|
6
|
+
import { GameObject } from '@eva/eva.js';
|
|
6
7
|
import { Renderer } from '@eva/plugin-renderer';
|
|
7
8
|
import { RendererManager } from '@eva/plugin-renderer';
|
|
8
9
|
import { RendererSystem } from '@eva/plugin-renderer';
|
|
9
10
|
import { UpdateParams } from '@eva/eva.js';
|
|
10
11
|
|
|
12
|
+
/**
|
|
13
|
+
* Spine 骨骼动画组件
|
|
14
|
+
*
|
|
15
|
+
* Spine 组件用于播放 Esoteric Software 的 Spine 骨骼动画。
|
|
16
|
+
* 支持骨骼动画播放控制、动画混合、附件替换等高级功能,
|
|
17
|
+
* 适用于角色动画、复杂特效等需要骨骼动画的场景。
|
|
18
|
+
*
|
|
19
|
+
* 主要功能:
|
|
20
|
+
* - 骨骼动画播放和控制
|
|
21
|
+
* - 动画轨道管理(多动画并行)
|
|
22
|
+
* - 动画混合过渡
|
|
23
|
+
* - 骨骼和附件访问
|
|
24
|
+
* - 支持 Spine 3.6 和 3.8 版本
|
|
25
|
+
*
|
|
26
|
+
* @example
|
|
27
|
+
* ```typescript
|
|
28
|
+
* // 创建 Spine 动画
|
|
29
|
+
* const character = new GameObject('character');
|
|
30
|
+
* const spine = new Spine({
|
|
31
|
+
* resource: 'heroSpine', // Spine 资源
|
|
32
|
+
* animationName: 'idle', // 默认动画
|
|
33
|
+
* autoPlay: true, // 自动播放
|
|
34
|
+
* scale: 0.5 // 缩放比例
|
|
35
|
+
* });
|
|
36
|
+
* character.addComponent(spine);
|
|
37
|
+
*
|
|
38
|
+
* // 播放动画
|
|
39
|
+
* spine.play('walk', true); // 循环播放 walk 动画
|
|
40
|
+
*
|
|
41
|
+
* // 停止动画
|
|
42
|
+
* spine.stop();
|
|
43
|
+
*
|
|
44
|
+
* // 动画混合
|
|
45
|
+
* spine.setMix('idle', 'walk', 0.3); // 设置过渡时间
|
|
46
|
+
* spine.play('walk');
|
|
47
|
+
*
|
|
48
|
+
* // 添加动画队列
|
|
49
|
+
* spine.play('attack', false); // 播放攻击动画
|
|
50
|
+
* spine.addAnimation('idle', 0, true); // 攻击完成后回到 idle
|
|
51
|
+
*
|
|
52
|
+
* // 替换附件(换装)
|
|
53
|
+
* spine.setAttachment('weapon', 'sword'); // 将武器槽替换为剑
|
|
54
|
+
*
|
|
55
|
+
* // 访问骨骼
|
|
56
|
+
* const headBone = spine.getBone('head');
|
|
57
|
+
* if (headBone) {
|
|
58
|
+
* headBone.rotation = 15; // 旋转头部
|
|
59
|
+
* }
|
|
60
|
+
*
|
|
61
|
+
* // 多轨道动画
|
|
62
|
+
* spine.play('walk', true, 0); // 轨道0:身体动画
|
|
63
|
+
* spine.play('shoot', false, 1); // 轨道1:上半身动画
|
|
64
|
+
* ```
|
|
65
|
+
*/
|
|
11
66
|
export declare class Spine extends Component<SpineParams> {
|
|
67
|
+
/** 组件名称 */
|
|
12
68
|
static componentName: string;
|
|
69
|
+
/** Spine 资源名称 */
|
|
13
70
|
resource: string;
|
|
71
|
+
/** 动画缩放比例 */
|
|
14
72
|
scale: number;
|
|
73
|
+
/** 当前播放的动画名称 */
|
|
15
74
|
animationName: string;
|
|
75
|
+
/** 是否自动播放动画 */
|
|
16
76
|
autoPlay: boolean;
|
|
77
|
+
/** 是否保留资源(销毁时不释放) */
|
|
78
|
+
keepResource: boolean;
|
|
79
|
+
/** Spine 骨架实例(内部使用) */
|
|
17
80
|
private _armature;
|
|
81
|
+
/** 容器管理器引用(由 SpineSystem 设置) */
|
|
82
|
+
_containerManager: any;
|
|
83
|
+
/** 挂载到插槽的 GameObject 映射(GameObject -> { slot, wrapper }) */
|
|
84
|
+
private _slotGameObjects;
|
|
85
|
+
/** 等待容器就绪的 slot 挂载请求 */
|
|
86
|
+
_pendingSlotObjects: {
|
|
87
|
+
slot: number | string;
|
|
88
|
+
gameObject: GameObject;
|
|
89
|
+
options?: {
|
|
90
|
+
followAttachmentTimeline?: boolean;
|
|
91
|
+
};
|
|
92
|
+
}[];
|
|
93
|
+
/** 等待执行的动画操作队列 */
|
|
18
94
|
private waitExecuteInfos;
|
|
95
|
+
/**
|
|
96
|
+
* 设置骨架实例
|
|
97
|
+
* 当骨架加载完成后自动执行等待队列中的动画操作
|
|
98
|
+
*/
|
|
19
99
|
set armature(val: any);
|
|
100
|
+
/** 获取骨架实例 */
|
|
20
101
|
get armature(): any;
|
|
102
|
+
/** 组件是否已销毁 */
|
|
21
103
|
destroied: boolean;
|
|
104
|
+
/** 动画事件处理器 */
|
|
22
105
|
addHandler: any;
|
|
106
|
+
/** 上一次使用的资源名称 */
|
|
23
107
|
lastResource: string;
|
|
108
|
+
/**
|
|
109
|
+
* 初始化组件
|
|
110
|
+
* @param obj - 初始化参数
|
|
111
|
+
* @param obj.resource - Spine 资源名称
|
|
112
|
+
* @param obj.animationName - 默认动画名称
|
|
113
|
+
* @param obj.scale - 缩放比例
|
|
114
|
+
* @param obj.autoPlay - 是否自动播放
|
|
115
|
+
*/
|
|
24
116
|
init(obj?: SpineParams): void;
|
|
117
|
+
/** 组件销毁时调用 */
|
|
25
118
|
onDestroy(): void;
|
|
119
|
+
/**
|
|
120
|
+
* 播放指定动画
|
|
121
|
+
*
|
|
122
|
+
* 如果骨架尚未加载完成,动画操作将被加入等待队列。
|
|
123
|
+
*
|
|
124
|
+
* @param name - 动画名称,不指定则使用 animationName 属性
|
|
125
|
+
* @param loopAnimation - 是否循环播放,默认跟随 autoPlay 属性
|
|
126
|
+
* @param track - 动画轨道编号,默认为 0
|
|
127
|
+
*/
|
|
26
128
|
play(name?: string, loopAnimation?: boolean, track?: number): void;
|
|
129
|
+
/**
|
|
130
|
+
* 停止指定轨道的动画
|
|
131
|
+
*
|
|
132
|
+
* 如果骨架尚未加载完成,停止操作将被加入等待队列。
|
|
133
|
+
*
|
|
134
|
+
* @param track - 动画轨道编号,默认为 0
|
|
135
|
+
*/
|
|
27
136
|
stop(track?: number): void;
|
|
137
|
+
/**
|
|
138
|
+
* 在当前动画之后添加新动画到队列
|
|
139
|
+
*
|
|
140
|
+
* 用于创建动画序列,当前动画播放完毕后自动播放下一个动画。
|
|
141
|
+
*
|
|
142
|
+
* @param name - 动画名称
|
|
143
|
+
* @param delay - 延迟时间(秒)
|
|
144
|
+
* @param loop - 是否循环播放
|
|
145
|
+
* @param track - 动画轨道编号,默认为 0
|
|
146
|
+
*/
|
|
28
147
|
addAnimation(name?: string, delay?: number, loop?: boolean, track?: number): void;
|
|
148
|
+
/**
|
|
149
|
+
* 设置两个动画之间的混合过渡时间
|
|
150
|
+
*
|
|
151
|
+
* 当从一个动画切换到另一个动画时,会在指定时间内进行平滑过渡。
|
|
152
|
+
*
|
|
153
|
+
* @param from - 起始动画名称
|
|
154
|
+
* @param to - 目标动画名称
|
|
155
|
+
* @param duration - 过渡时长(秒)
|
|
156
|
+
*/
|
|
29
157
|
setMix(from: string, to: string, duration: number): void;
|
|
158
|
+
/**
|
|
159
|
+
* 获取指定轨道当前播放的动画名称
|
|
160
|
+
*
|
|
161
|
+
* @param track - 动画轨道编号,默认为 0
|
|
162
|
+
* @returns 动画名称,如果未找到则返回 undefined
|
|
163
|
+
*/
|
|
30
164
|
getAnim(track?: number): any;
|
|
165
|
+
/**
|
|
166
|
+
* 设置默认的动画混合时间
|
|
167
|
+
*
|
|
168
|
+
* 当没有为特定动画对指定混合时间时,将使用此默认值。
|
|
169
|
+
*
|
|
170
|
+
* @param duration - 默认混合时长(秒)
|
|
171
|
+
*/
|
|
31
172
|
setDefaultMix(duration: number): void;
|
|
173
|
+
/**
|
|
174
|
+
* 替换指定插槽的附件
|
|
175
|
+
*
|
|
176
|
+
* 用于换装、武器切换等场景。
|
|
177
|
+
*
|
|
178
|
+
* @param slotName - 插槽名称
|
|
179
|
+
* @param attachmentName - 附件名称
|
|
180
|
+
*/
|
|
32
181
|
setAttachment(slotName: string, attachmentName: string): void;
|
|
182
|
+
/**
|
|
183
|
+
* 获取指定名称的骨骼
|
|
184
|
+
*
|
|
185
|
+
* 可用于直接操作骨骼的位置、旋转、缩放等属性。
|
|
186
|
+
*
|
|
187
|
+
* @param boneName - 骨骼名称
|
|
188
|
+
* @returns 骨骼对象,如果未找到则返回 undefined
|
|
189
|
+
*/
|
|
33
190
|
getBone(boneName: string): any;
|
|
191
|
+
/**
|
|
192
|
+
* 将一个 GameObject 挂载到 Spine 的指定插槽上
|
|
193
|
+
*
|
|
194
|
+
* 挂载后 GameObject 会跟随骨骼运动。当 Spine 组件销毁时,
|
|
195
|
+
* 挂载的 GameObject 也会被自动销毁。
|
|
196
|
+
*
|
|
197
|
+
* @param slot - 插槽名称或索引
|
|
198
|
+
* @param gameObject - 要挂载的 GameObject
|
|
199
|
+
* @param options - 可选配置
|
|
200
|
+
* @param options.followAttachmentTimeline - 是否跟随插槽的附件时间线
|
|
201
|
+
*/
|
|
202
|
+
addSlotObject(slot: number | string, gameObject: GameObject, options?: {
|
|
203
|
+
followAttachmentTimeline?: boolean;
|
|
204
|
+
}): void;
|
|
205
|
+
private _doAddSlotObject;
|
|
206
|
+
/**
|
|
207
|
+
* 递归同步 gameObject 及其子树的 transform 到对应的渲染容器
|
|
208
|
+
*/
|
|
209
|
+
private _syncTransformTree;
|
|
210
|
+
/**
|
|
211
|
+
* 处理等待容器就绪的 slot 挂载请求(由 SpineSystem 每帧调用)
|
|
212
|
+
*/
|
|
213
|
+
_flushPendingSlotObjects(): void;
|
|
214
|
+
/**
|
|
215
|
+
* 从插槽上移除挂载的 GameObject
|
|
216
|
+
*
|
|
217
|
+
* @param gameObject - 要移除的 GameObject
|
|
218
|
+
*/
|
|
219
|
+
removeSlotObject(gameObject: GameObject): void;
|
|
220
|
+
/**
|
|
221
|
+
* 销毁所有挂载到插槽的 GameObject(内部使用)
|
|
222
|
+
*/
|
|
223
|
+
_destroySlotGameObjects(): void;
|
|
34
224
|
}
|
|
35
225
|
|
|
36
226
|
export declare interface SpineParams {
|
|
@@ -40,16 +230,47 @@ export declare interface SpineParams {
|
|
|
40
230
|
autoPlay?: boolean;
|
|
41
231
|
}
|
|
42
232
|
|
|
233
|
+
/**
|
|
234
|
+
* Spine 骨骼动画系统
|
|
235
|
+
*
|
|
236
|
+
* SpineSystem 负责管理所有 Spine 组件的骨架创建、动画更新和资源管理。
|
|
237
|
+
* 系统会监听 Spine 组件的变化,自动加载骨骼数据并创建动画实例,
|
|
238
|
+
* 并在每帧更新所有活跃的 Spine 动画。
|
|
239
|
+
*
|
|
240
|
+
* 主要功能:
|
|
241
|
+
* - 骨骼数据加载和缓存
|
|
242
|
+
* - 动画实例创建和销毁
|
|
243
|
+
* - 每帧动画状态更新
|
|
244
|
+
* - WebGL 上下文恢复处理
|
|
245
|
+
* - 资源重试机制
|
|
246
|
+
*/
|
|
43
247
|
export declare class SpineSystem extends Renderer {
|
|
248
|
+
/** 系统名称 */
|
|
44
249
|
static systemName: string;
|
|
250
|
+
/** 骨架实例映射表(游戏对象 ID -> 骨架容器) */
|
|
45
251
|
armatures: Record<number, Container>;
|
|
252
|
+
/** Spine 组件实例映射(游戏对象 ID -> Spine 组件) */
|
|
253
|
+
private _spineComponents;
|
|
254
|
+
/** 渲染系统引用 */
|
|
46
255
|
renderSystem: RendererSystem;
|
|
256
|
+
/** 渲染器管理器 */
|
|
47
257
|
rendererManager: RendererManager;
|
|
258
|
+
/** 容器管理器 */
|
|
48
259
|
containerManager: ContainerManager;
|
|
260
|
+
/** PixiJS Spine 插件实例 */
|
|
49
261
|
pixiSpine: any;
|
|
262
|
+
/**
|
|
263
|
+
* 初始化系统
|
|
264
|
+
* @param obj - 初始化参数
|
|
265
|
+
* @param obj.pixiSpine - PixiJS Spine 插件实例
|
|
266
|
+
*/
|
|
50
267
|
init({ pixiSpine }: {
|
|
51
268
|
pixiSpine: any;
|
|
52
269
|
}): void;
|
|
270
|
+
/**
|
|
271
|
+
* 每帧更新所有 Spine 动画
|
|
272
|
+
* @param e - 更新参数,包含帧间隔时间
|
|
273
|
+
*/
|
|
53
274
|
update(e: UpdateParams): void;
|
|
54
275
|
componentChanged(changed: ComponentChanged): Promise<void>;
|
|
55
276
|
add(changed: ComponentChanged, count?: number): Promise<void>;
|