はじめに

Spineには様々なランタイムが存在します。（ランタイム一覧 http://ja.esotericsoftware.com/spine-runtimes ）一度作ったデータが別の場所で再利用しやすいという事で、Spineの優れた特徴の一つと言えます。ここでのサンプルは、世の流行りに乗っかりUnityで（自分はFlasherですのでas3+starlingで頑張りたいところですが）作っていこうと思います。

なお、記事を書いて時点で使用しているSpineのバージョンはSpine2.1.27 Essential、Unityのバージョンは5.2.1.f1 Personalです。

ランタイムを入手

上記ランタイム一覧ページで、Official runtimesのUnity( https://github.com/EsotericSoftware/spine-runtimes/tree/master/spine-unity )を選択します。githubのページが開くので、Quick installationというセクションからspine-unity.unitypackageファイルをダウンロードします。

Unityにランタイムを読み込む

適当にUnityの2Dプロジェクトを作成し、メニュー -> Assets -> Import Package -> Custom Packageとたどり、先ほどダウンロードしunity packageファイルをインポートします。ファイルの選択ダイアログで特に操作をしないと、下記のようにファイルが取り込まれます。

Exampleフォルダ以下のファイルは捨ててしまっても構いませんが、Example/Spine以下には楽しげなサンプルがたくさん入っているので、後述する手順でシーンに配置してみると楽しいです。

Spineからデータをエクスポートする

適当なデータを用意します。今回はロボットのパッ平君を用意しました。ええ、オリジナルキャラです。

アニメーションの設定まで終わったら、Spineの左上のロゴ -> Export でExportダイアログを開いて、JSONを選択します。このままExportボタンを押してエクスポートすれば良いのですが、Create atlasのダイアログを開いて、Optionsのアトラス拡張子設定を.atlasから.atlas.txtに変更しておくと何度かやり直す際などに便利です。これは拡張子がatlasのままだとUNITYにSpineのデータが自動的に取り込まれないからなのですが、出力後に.atlasを.atalas.txtに書き換えても大丈夫です。エクスポートすると指定フォルダ内に３つのデータ(png、json、atlas.txt)が確認できると思います。

赤い印の部分を編集する

UNITYにSpineからエクスポートしたデータを取り込む

AssetesフォルダーにSpineでデータを書き出したフォルダごとドラッグ＆ドロップします。

数秒時間がかかりますが、これだけで、上記のように6つのファイルが読み込まれた状態になります。(自動的に作成されたファイルも追加される。)

このうちアイコン付きのSkeketonDataを選択するとInspector表示が下記のようになりますが、とりあえず内容は編集しません。黒い三角の再生ボタンを押すと設定したアニメーションをここでプレビューする事もできます。

シーンにSkeletonを配置する

SkeketonDataを右クリックしたメニュー -> Spine -> Instantiate (Skeleton Animation)を選択します。これだけでシーンにSkeletonが配置されるので、大きさや位置を適当に編集します。なお、Instantiate (Mecanim) という項目についてはいずれ？ですが、解説します。

＜2017/3/28追記＞
2016の秋頃のアップデートで、スケルトンデータを直接ステージにドロップしてSkeletonを配置する形式に変わっていました。ドロップ時にどのような形式で配置するのかが選べます。
こちらに動画付きのわかりやすい解説があります。
http://ja.esotericsoftware.com/forum/New-Feature-Drag-and-Drop-to-instantiate-6789

さて、これでシーンにキャラクターを配置できたわけですが、ここで実行をしてもキャラクターは止まったままでまだ動いてくれません。

scriptを設定する

今回は（Mecanimを使っていないので）プログラムでアニメーションを制御してやらなくてはいけません。

using UnityEngine;
using System.Collections;
using System;

public class Pappey : MonoBehaviour {
        void Start () {
        GetComponent<SkeletonAnimation> ().state.SetAnimation (0, "animation", true);
    }
}

このようなC#スクリプトを記述し、シーン上のキャラクターに設定しました。詳しくは解説しませんが、SetAnimationメソッドの第二引数に設定したアニメーション名を指定しています。特に指定しない場合"animation"という名前にデフォルトでなっています。

ここまでやってやっと、再生ボタンを押す事でUnity上でキャラクターをアニメーションさせる事ができます。"やっと"と書きましたが、慣れればかなり早くここまでの作業を終える事はできそうです。

動画サンプル
https://twitter.com/harayoki/status/657272515312513024

終わりに

本当に基本的な事だけで有益な情報はあまりないですが、丁寧にまとめてみました。バージョンが変わるとまた詳細は変わってしまうと思いますが、誰かの役に立てば幸いです。しばらく作業が空いてしまった後の自分の役には立ちそうです。