Pixi’VNSpine 2D
Pixi’VN에서 Spine 2D 통합을 사용하여 스켈레톤을 불러오고, 스킨을 전환하고, 애니메이션을 재생 및 결합하고, 애니메이션 트랙을 제어하는 방법.
Pixi’VN 프로젝트 내에서 Spine 2D 통합을 사용하여 캐릭터와 오브젝트를 위한 복잡하고 부드러운 애니메이션을 만들 수 있습니다. 이 통합은 본질적으로 공식 PixiJS용 Spine 2D 런타임의 래퍼로, Pixi’VN 프로젝트 내에서 직접 모든 Spine 2D 기능을 사용할 수 있게 해줍니다.
설치
기존 JavaScript 프로젝트에 Spine 2D 패키지를 설치하려면 다음 명령어 중 하나를 사용하세요.
npm install @drincs/pixi-vn-spine이 라이브러리는 Lazy 컴포넌트 내부에서 사용할 수 있도록 게임 초기화 시 임포트해야 합니다.
import "@drincs/pixi-vn-spine";
Game.init(body, {
// ...
});사용법
다른 Pixi’VN 컴포넌트와 마찬가지로 Spine 컴포넌트를 사용할 수 있습니다.
하지만 사용하기 전에 먼저 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);