@galacean/effects-plugin-spine v2.0.7
Galacean Effects Spine Plugin
Usage
Simple Import
import { Player } from '@galacean/effects';
import '@galacean/effects-plugin-spine';
Get Spine Resource List
import type { SpineDataCache } from '@galacean/effects-plugin-spine';
const comp = await player.play(scene);
const item = comp.getItemByName('itemName');
const spineData: SpineDataCache = item.spineDataCache;
Get Animation List / Skin List
- Get using functions
const comp = await new Player().loadScene(scene);
const item = comp.getItemByName('itemName');
const { skeletonData } = item.spineDataCache;
const animationList = getAnimationList(skeletonData);
const skinList = getSkinList(skeletonData);
- After starting, you can access it in the
spineDataCache
.
const comp = await new Player().loadScene(scene);
const item = comp.getItemByName('itemName')
const { skinList, animationList } = item.spineDataCache;
Get Duration of a Specific Animation
const animationDuration = getAnimationDuration(skeletonData, animationName);
Get Texture Creation Options
import { getTextureOptions } from '@galacean/effects-plugin-spine';
const { magFilter, minFilter, wrapS, wrapT, pma } = getTextureOptions(atlasBuffer);
Set Animation Mix Duration
- Set default mix duration for an animation (should be called before
player.play
)
const comp = await new Player().loadScene(scene);
const item = comp.getItemByName(name);
item.setDefaultMixDuration(mix);
- Set mix duration for a specific transition (should be called before
player.play
)
const comp = await new Player().loadScene(scene);
const item = comp.getItemByName(name);
item.setMixDuration(animationOut, animationIn, mix);
Set Playback Speed
const comp = await new Player().loadScene(scene);
const item = comp.getItemByName(name);
item.setSpeed(speed);
Set Animation
- Set a single animation
const comp = await new Player().loadScene(scene);
const item = comp.getItemByName(name);
item.setAnimation(animationName, speed);
- Set a group of animations
const comp = await new Player().loadScene(scene);
const item = comp.getItemByName(name);
const animationList = [animationName1, animationName2, animationName3];
item.setAnimation(animationList, speed);
Development
Getting Started
# demo
pnpm --filter @galacean/effects-plugin-spine dev
Open in browser: http://localhost:8081/demo/
Frame Comparison Testing
Open in browser: http://localhost:8081/test/
9 months ago
9 months ago
9 months ago
9 months ago
9 months ago
9 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
10 months ago
11 months ago
11 months ago
11 months ago
11 months ago
11 months ago
11 months ago
12 months ago
1 year ago
1 year ago
1 year ago
1 year ago
11 months ago
11 months ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
11 months ago
1 year ago
11 months ago
1 year ago
1 year ago
1 year ago
11 months ago
11 months ago
11 months ago
1 year ago
1 year ago
11 months ago
12 months ago
12 months ago
1 year ago
12 months ago
11 months ago
11 months ago
11 months ago
12 months ago
11 months ago
11 months ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
12 months ago
12 months ago
12 months ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
1 year ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago
2 years ago