Galacean Effects Spine Plugin

Usage

$3

`` ts
import { Player } from '@galacean/effects';
import '@galacean/effects-plugin-spine';
`

$3

` ts
import type { SpineDataCache } from '@galacean/effects-plugin-spine';

const comp = await player.play(scene);
const item = comp.getItemByName('itemName');
const spineData: SpineDataCache = item.spineDataCache;
`

$3

1. Get using functions

` ts
const comp = await new Player().loadScene(scene);
const item = comp.getItemByName('itemName');
const { skeletonData } = item.spineDataCache;
const animationList = getAnimationList(skeletonData);
const skinList = getSkinList(skeletonData);
`

2. After starting, you can access it in the spineDataCache.

` ts
const comp = await new Player().loadScene(scene);
const item = comp.getItemByName('itemName')
const { skinList, animationList } = item.spineDataCache;
`

$3

` ts
const animationDuration = getAnimationDuration(skeletonData, animationName);
`

$3


` ts
import { getTextureOptions } from '@galacean/effects-plugin-spine';

const { magFilter, minFilter, wrapS, wrapT, pma } = getTextureOptions(atlasBuffer);
`

$3

1. Set default mix duration for an animation (should be called before player.play)

` ts
const comp = await new Player().loadScene(scene);
const item = comp.getItemByName(name);

item.setDefaultMixDuration(mix);
`

2. Set mix duration for a specific transition (should be called before player.play)

` ts
const comp = await new Player().loadScene(scene);
const item = comp.getItemByName(name);

item.setMixDuration(animationOut, animationIn, mix);
`

$3

` ts
const comp = await new Player().loadScene(scene);
const item = comp.getItemByName(name);

item.setSpeed(speed);
`

$3

1. Set a single animation

` ts
const comp = await new Player().loadScene(scene);
const item = comp.getItemByName(name);

item.setAnimation(animationName, speed);
`

2. Set a group of animations

` ts
const comp = await new Player().loadScene(scene);
const item = comp.getItemByName(name);
const animationList = [animationName1, animationName2, animationName3];

item.setAnimation(animationList, speed);
`

Development

$3

` bash


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/