Pixi’VNSpine 2D
Как использовать интеграцию Spine 2D в Pixi’VN для загрузки скелетов, переключения скинов, воспроизведения и комбинирования анимаций, а также управления анимационными дорожками.
В своём проекте Pixi’VN вы можете использовать интеграцию Spine 2D для создания сложных и плавных анимаций для ваших персонажей и объектов. Эта интеграция по сути является обёрткой вокруг официального рантайма Spine 2D для PixiJS, позволяя использовать все возможности Spine 2D прямо в вашем проекте Pixi’VN.
Установка
Чтобы установить пакет Spine 2D в существующий проект JavaScript, используйте одну из следующих команд:
npm install @drincs/pixi-vn-spineБиблиотека должна быть импортирована при инициализации игры, чтобы её можно было использовать внутри компонентов Lazy.
import "@drincs/pixi-vn-spine";
Game.init(body, {
// ...
});Использование
Вы можете использовать компонент Spine так же, как и любой другой компонент Pixi’VN.
Однако перед использованием необходимо сначала загрузить ресурсы Spine 2D (skeleton и atlas).
Например:
import { Assets, canvas } from "@drincs/pixi-vn";
import { Spine } from "@drincs/pixi-vn-spine";
await Assets.load(["spineboySkeleton", "spineboyAtlas"]);
const spine = new Spine({
atlas: "spineboyAtlas",
skeleton: "spineboySkeleton",
xAlign: 0.5,
yAlign: 1,
animation: "idle",
});
canvas.add("boy", spine);