0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

Spine 4.2 のキャラクターを Unity で動かす手順:spine-unity の導入、.atlas.txt、ストレートアルファ、C# での再生

0
Last updated at Posted at 2026-10-05

本記事は英語の原文 From a layered PSD to an animated Spine character in Unity の日本語版です。翻訳には AI を使い、手順・コード・エラーメッセージは原文およびソースコードと照合済みです。Cat.cs は spine-csharp 4.2 と Unity API のスタブを使ってコンパイルを確認しています。

レイヤー分けしたイラストから作った Spine 4.2 のキャラクターを、公式ランタイム spine-unity 4.2 で Unity のシーンに置いて動かすまでの手順です。

idle・hack・glitch・bigwin の 4 つのアニメーションを順に再生する猫のリグ(Spine 4.2)

  1. spine-unity 4.2 を導入する
  2. アトラスのファイル名を .atlas.txt に変える
  3. アルファモードをストレートアルファに合わせる
  4. SkeletonData をシーンにドラッグする
  5. C# スクリプトからアニメーションを再生する

サンプルには、筆者が開発している Riggy で書き出した猫のリグを使用します。プロジェクトにそのまま入れられるファイル一式はこちら:riggy-cat-unity.zip。

何を確認したか

Phaser・PixiJS 向けの記事とは異なり、本記事ではライブデモを用意していません。そのかわり、アーカイブ内のファイルは spine-unity がスケルトンの読み込みに使っている公式ランタイム spine-csharp 4.2 で読み込み、各アニメーションについて、描画を伴わないランタイム上での動作を確認しました。Cat.cs は同ランタイムと Unity API のスタブを使ってコンパイルを確認しています。Unity エディター上でのインポート・描画・入力の動作確認は行っていません。インポートの手順は spine-unity の公式ドキュメントと 4.2 のソースに従っています。

1. spine-unity 4.2 を導入する

spine-unity のダウンロードページから .unitypackage をインポートするか、Package Manager の Add package from git URL… で次の URL を 1 つずつ追加します。

https://github.com/EsotericSoftware/spine-runtimes.git?path=spine-csharp/src#4.2
https://github.com/EsotericSoftware/spine-runtimes.git?path=spine-unity/Assets/Spine#4.2

末尾の #4.2 が重要です。ランタイムのメジャー・マイナーバージョンは書き出したデータと一致している必要があり、spine-unity 4.3 は 4.2 のファイルを読めません。詳しくは公式の spine-unity installation を参照してください。

2. アトラスを .atlas.txt にリネームする

spine-unity がアトラスとしてインポートするのは拡張子 .atlas.txt のファイルだけです。ただの .atlas は無視され、コンソールに次の警告が出て、スケルトンはテクスチャなしのままになります。

If this file is a Spine atlas, please change its extension to `.atlas.txt`.

コピーする前にリネームし、3 つのファイルを同じフォルダに入れて Assets 以下の好きな場所に置きます。

Assets/
  Characters/
    riggy-cat/
      skeleton.json
      skeleton.atlas.txt     ← skeleton.atlas からリネーム
      page.png

すると spine-unity が同じフォルダーに 3 つのアセットを自動生成します。skeleton_Atlas、アトラスページごとの _Material、そして実際に使う skeleton_SkeletonData です。上のアーカイブはリネーム済みです。

3. ストレートアルファに合わせる

アトラスのページ画像には、乗算済みアルファ(Premultiplied Alpha, PMA)とストレートアルファの 2 種類があります。spine-unity 4.2 のデフォルトは PMA 前提で、Riggy の書き出しはストレートアルファです。設定が合っていないと、パーツの輪郭に暗い縁や明るい縁が出ます。ストレートアルファのアトラス画像には、次の設定を適用します。

  • 生成された _Material で Straight Alpha Texture をオンにする
  • page.png で sRGB (Color Texture) と Alpha Is Transparency をオンにする

PMA で書き出したデータの場合は逆の設定になります。公式の spine-unity assets を参照してください。

4. スケルトンをシーンに置く

skeleton_SkeletonData を Scene ビューか Hierarchy にドラッグすると、作成するコンポーネントを選ぶメニューが表示されます。

  • SkeletonAnimation:通常のゲームオブジェクト
  • SkeletonGraphic (UI):Canvas 用
  • SkeletonMecanim:Animator で制御する場合

ここでは SkeletonAnimation を選びます。インスペクターの Animation Name で開始時に再生するアニメーションを選び、Loop をオンにするとループ再生されます。コードを 1 行も書かずに猫がうなずくのを確認できます。このリグはボーン 18 本・パーツ 15 個で、4 つのアニメーションがすべてドロップダウンに並びます。

5. スクリプトからアニメーションを再生する

SkeletonAnimation と同じゲームオブジェクトに、同梱の Cat.cs をアタッチします。AnimationState は Spine のどのランタイムでも共通の API です。開始時は idle をループし、クリックするたびにワンショット(1 回だけ再生する)アニメーションを再生してから idle に戻ります。

// Plays the Riggy cat with spine-unity 4.2: idle on start, a one-shot on every click.
// Add it to the GameObject that has the SkeletonAnimation component.
using Spine.Unity;
using UnityEngine;

public class Cat : MonoBehaviour {
	static readonly string[] OneShots = { "hack", "glitch", "bigwin" };

	SkeletonAnimation cat;
	int next;

	void Start () {
		cat = GetComponent<SkeletonAnimation>();
		// blend 0.2 s between any two animations instead of snapping
		cat.AnimationState.Data.DefaultMix = 0.2f;
		cat.AnimationState.SetAnimation(0, "idle", true);
	}

	void Update () {
		if (!Input.GetMouseButtonDown(0)) return;
		string name = OneShots[next];
		next = (next + 1) % OneShots.Length;
		// play the one-shot once, then go back to the idle loop
		cat.AnimationState.SetAnimation(0, name, false);
		cat.AnimationState.AddAnimation(0, "idle", true, 0);
	}
}

ポイントは 2 つです。DefaultMix = 0.2f で、アニメーションを瞬時に切り替えずに 0.2 秒かけてブレンドします。また、同じトラック 0 で SetAnimation(ワンショット・ループなし)の直後に AddAnimation で idle のループ再生をキューに追加すると、ワンショットが終わったら自然に idle へ戻ります。

読み込めないとき

  • The given key 'hash' was not present in the dictionary:JSON に skeleton.hash がありません。Web 系のランタイムでは不要ですが、spine-csharp(Unity)は必須として読みます。解説(英語)
  • Color hexadecimal length must be 8:スロットの色が 6 桁です。Web のランタイムは許容しますが、Unity ではスケルトン全体の読み込みが止まります。解説(英語)
  • Parent bone not found:参照先の親ボーンが存在しないか、親ボーンより先に子ボーンが定義されています。解説(英語)
  • そのほかのエラー一覧(英語)と、ブラウザで使える Spine JSON バリデーター(英語)もあります。

ライセンスについて

spine-unity は Spine Runtimes の一部です。Spine Runtimes をゲームに組み込む際は、スケルトンの作成者にかかわらず、その時点で有効な Spine Editor ライセンスが必要です(Spine Editor License)。Riggy は独立したツールで、Esoteric Software および Unity とは関係ありません。


サンプルのリグとアニメーションは、レイヤー分けした PSD から Riggy で作成しました(有料サービス、英語 UI)。

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?