spine-godotランタイム ドキュメント

ライセンスについて

Spineランタイムをアプリケーションに組み込む前に、Spine Runtimes Licenseをご覧ください。

はじめに

インストール方法

spine-godotランタイムはC++のカスタムモジュールとして実装されています。このため、GodotエディタのカスタムビルドとGodotエクスポートテンプレートが必要です。当社では最新のGodot 3.5ブランチおよびGodot 4.0ブランチに対して、ビルド済みのエディタおよびエクスポートテンプレート・バイナリを提供します。

注意: エディタビルドはすべて64-bitサポートが必要です。Windows、Linux、macOS用のエクスポートテンプレートも64-bitのサポートが必要です。iOSデバイス用のエクスポートテンプレートは64-bit ARMデバイスのみをサポートしています。

注意: masterブランチビルドは不安定な可能性があります。本番環境では、最新の安定版ビルドを使用することをお勧めします。

上記のリンクから、お使いのOSに対応したGodotエディタと、Godotエクスポートテンプレートをダウンロードしてください。

Windows または Linux の場合は、.zip ファイルを解凍後、解凍された実行ファイルをお好きな場所に置くことができます。macOSの場合は、.zip ファイルを解凍後、 Godot.app/Applications/ フォルダに配置してください。既存のGodotインストールがある場合は、Godot.app パッケージの名前を変更することができます。

エクスポートテンプレートの .tpz ファイルをインストールするには、Godotエディタを開き、Editor > Manage export templates ... を選択してください。 Install from file をクリックして、上記のリンクからダウンロードした .tzp ファイルを選択します。これで通常通り、Windows、Linux、macOS、iOS、Android、およびWeb用にプロジェクトをエクスポートできるようになります。また、Godotのワンクリック・デプロイ機能を使えば、Godotエディタ内からAndroidやWeb向けに直接デプロイすることも可能です。

サンプル

spine-godotランタイムには、各機能を紹介しているさまざまなサンプルが付属しています。サンプルを確認したり再生するには:

  1. 上の「インストール」セクションのリンクから、お使いのOS用のビルド済みGodotエディタをダウンロードします。
  2. spine-runtimesのGitリポジトリをクローンします。Gitを使いたくない場合は、最新のバージョンをZIPでダウンロードして解凍してください。
  3. Godotエディタを開き、Importをクリックし、spine-runtimes/spine-godot/example/project.godotファイルを選択します。

以下のような例があります:

  • 01-helloworld: SpineSpriteノードを使用して、Spineスケルトンを表示し、アニメーションさせる方法を紹介しています。
  • 02-animation-state-listener: SpineSpriteのアニメーションのステートの変化をシグナルで受信する方法を紹介しています。
  • 03-mix-and-match: 他のスキンを組み合わせてカスタムスキンを作成し、mix-and-matchアバターを作成する方法を紹介しています。
  • 04-simple-input: 入力イベントに反応してアニメーションを再生する方法を紹介しています。
  • 05-mouse-following: SpineSprite スケルトンのボーンを手動でマウスやタッチイベントに追従させる方法を紹介しています。
  • 06-bone-following: SpineSprite 上の SpineBoneNode を使用して、子ノードがスケルトンのボーンに追従するようにする方法を紹介しています。
  • 07-slot-node: SpineSlotNode を使用して子ノードをスケルトンのスロットに従わせ、SpineSprite の描画順序に子ノードを正しく挿入する方法を紹介しています。
  • 08-animation-player: GodotのAnimationPlayerユーザーインターフェースを使って、SpineAnimationTrack ノードを使用してカットシーンを作成する方法を紹介しています。
  • 09-custom-material: SpineSlotNodeを介して、SpineSprite全体および個々のスロットにカスタムマテリアルを適用する方法を紹介しています。
  • 10-2d-lighting: Godotの2Dライティングシステムに対応するために、SpineSpriteと組み合わせて法線マップ(ノーマルマップ)を使用する方法を紹介しています。
  • 11-bone-node: SpineBoneNodeインスタンスを使用して、Godotの物理演算によってSpineSpriteボーンを動作させる方法を紹介しています。

注意: Godot 3.x と 4.0 の GDScript の間には非互換性があるため、Godot 4.0 用には別のexample-v4 プロジェクトフォルダを提供しています。

Godotエディタとエクスポートテンプレートをソースからコンパイルする

異なるバージョンのGodotを使いたい、他のカスタムC++モジュールがある、あるいはspine-godotランタイムで作業したいなどの理由で、Godotエディタとエクスポートテンプレートを自分でコンパイルする必要がある場合のために、そのプロセスを容易にするシェルスクリプトを提供しています。

注意: この作業を行う前に、Godotによる公式の指示に従い、すべてのビルド依存ファイルがインストールされていることを確認してください。

Godotエディタバイナリをビルドするには、まずspine-runtimesリポジトリをクローンします。Spine Runtimesをクローンしたディレクトリの中から、Bashシェル(WindowsではGit Bashを使用)で以下を実行します。:

cd spine-godot
./build/setup.sh 3.5-stable false
./build/build.sh release_debug

setup.shの最初の引数は、GodotエディタをビルドしたいGodotリポジトリのブランチまたはコミットハッシュになります。第2引数には、開発用にエディタをコンパイルするかどうかを指定します。有効な値はtrueおよびfalseです。trueに設定すると、LIVEPP環境変数をLive++のインストールディレクトリに設定した場合、Windows上のLive++のサポートが追加され、コンパイルを高速化するために多くのモジュールが無効になります。

build.shの最初の引数は、生成されるバイナリの最適化レベルを指定します。サポートされている値は、完全なデバッグが可能になる代わりに最適化されていないため遅くなることがあるdebugと、一般的にGodotエディタのリリースビルドに使用されるrelease_debugです。

出来上がったGodotエディタバイナリは、spine-godot/godot/binにあります。

特定のプラットフォーム用のエクスポートテンプレートを構築するには、Bashシェル(WindowsではGit Bashを使用)で以下を実行します。:

cd spine-godot
./build/setup.sh 3.5-stable false
./build/build-templates.sh windows

setup.shの最初の引数は、GodotエディタをビルドしたいGodotリポジトリのブランチまたはコミットハッシュです。第2引数は必ずfalseでなければなりません。

built-templates.shの最初の引数は、テンプレートをコンパイルするためのプラットフォームです。有効な値は、windowslinuxmacoswebandroidiosです。macOSとiOSのエクスポートテンプレートは、macOSが動作しているマシンでのみビルドできることに注意してください。詳しくはGodotによる公式の説明を参照してください。

出来上がったGodotエクスポートテンプレートバイナリは、spine-godot/godot/binにあります。

注意: spine-godotランタイムは現在、Godot 3.4.4-stable および 3.5.1-stable をサポートしています。また、近々リリースされる Godot 4.0 に対してもコンパイルおよび動作します。しかし Godot 4.0 はまだ安定していないので、spine-godotランタイムがmasterからの最新のコミットで動作することは保証していません。Godot masterブランチに対してビルドするには、build-v4.sh および build-templates-v4.sh スクリプトを使用してください。

GodotエディタとGitHub Actions経由のエクスポートテンプレートのビルド方法

Spine Runtimesリポジトリには、.github/workflows/spine-godot.yml.github/workflows/spine-godot-v4.yml に、Godot 3.5.x と Godot 4.0 のためのGitHubアクションで、すべてのGodotエディターとエクスポートテンプレートバイナリーを構築できるようなワークフローが用意されています。これを使った方が、これらのアーティファクトをローカルでコンパイルするよりも簡単なはずです。GitHubのワークフローを使うには以下を行なってください:

  1. 上のリポジトリをクローンしてください。
  2. クローンしたリポジトリでGitHubのワークフローを有効にしてください。
  3. 手動で spine-godot または spine-godot-v4 ワークフローをトリガーします。

ワークフローが正常に実行された場合、出来上がったバイナリはアーティファクトとしてアタッチされます。

spine-godotランタイムのアップデート

プロジェクトのspine-godotランタイムを更新する前に、Spineエディターとランタイムのバージョンの管理に関するガイドをご覧ください。

最新のspine-godotランタイムにアップデートする準備が整ったら以下を行なってください:

  1. 使用したいSpineランタイムとエディターのバージョンに対応した最新のビルド済みGodotエディタバイナリを、上のインストール方法セクションからダウンロードします。
  2. 使用したいSpineランタイムとエディターのバージョンに対応した最新のGodotエクスポートテンプレートバイナリを、上のインストール方法セクションからダウンロードします。
  3. Godot エディタを開き、Editor > Manage export templates ... と進んでエクスポートテンプレートをインストールします。Install from file をクリックし、ダウンロードした .tzp を選択します。
  4. Spineのメジャーバージョンを切り替える場合は、SpineエディターのバージョンをSpineランタイムのバージョンに合わせ、Spineプロジェクトを再エクスポートし、エクスポートした古いファイルをGodotプロジェクトで置き換えてください。更新されたファイルの再インポートを開始するには、Godot内でご自身のGodotプロジェクトを開いてください。

または、先述のようにGodotエディタとSpineサポート付きエクスポートテンプレートをコンパイルし、必要に応じて手順4を実行することも可能です。

spine-godotを使用する

spine-godotランタイムはGodotのためのカスタムC++モジュールで、Spineで作成されたアニメーションのロード、再生、操作をサポートします。spine-godotランタイムはC++で書かれており、汎用spine-cppランタイムをベースにしています。spine-godotランタイムは spine-cppのクラスと関数をラップして、GDScriptに公開しています。また、spine-cppのAPIのほとんどを公開することに加え、spine-godotランタイムはSpineスケルトンを簡単に表示し、インタラクトするためのGodotノードも提供します。

Spineランタイムのアーキテクチャの詳細については、Spineランタイムガイドをご覧ください。

アセットのマネージメント

Godot用にエクスポートする

以下の実行方法については、Spineユーザーガイド内で紹介されています :

  1. スケルトン&アニメーションデータのエクスポート
  2. スケルトンの画像を含むテクスチャアトラスのエクスポート

スケルトンのデータとテクスチャアトラスをエクスポートすると、以下のファイルが得られます:

  1. skeleton-name.spine-json または skeleton-name.skel: スケルトンとアニメーションのデータを含みます。
  2. skeleton-name.atlas: テクスチャアトラスの情報を含みます。
  3. 1つまたは複数の.pngファイル: スケルトンが使用するパックイメージを含むテクスチャアトラスの各ページを表しています。

注意: JSONエクスポートよりもバイナリ形式でのスケルトンエクスポートの方がサイズが小さく、読み込みが速いので、基本的にはそちらを選択したほうが良いでしょう。どうしてもJSONを使いたい場合は、ファイルの拡張子が .json ではなく .spine-json になっていることを確認してください。既存のプロジェクトでまだ .json エクスポート ファイルを使用している場合は、こちらの Pythonスクリプトを使用して、新しい拡張子 .spine-json に変換することができます。

spine-godotランタイムは、これらのファイルを特別なGodotリソースタイプにインポートすることができます。

注意: spine-godotランタイムは現在、Godot側の技術的な制限により、乗算済みアルファ(pre-multiplied alpha)を使用してエクスポートされたアトラスをサポートしていません。Godotはデフォルトで、事前乗算されていないテクスチャ画像に対してブリード処理を行います。これは通常、乗算済みアルファを使用することで修正されるアーティファクトを回避するのに十分なものです。

Godotへのインポート

  1. GodotプロジェクトをGodotエディタで開きます。
  2. .skel/.spine-json.atlas.pngの各ファイルを任意のフォルダにドラッグしてください。

アセットインポーターは、.skel または .spine-json スケルトンファイル用の SpineSkeletonFileResource.atlas用の SpineAtlasAssetResource および .png ファイル用のGodotテクスチャリソースを作成します。

注意: SpineAtlasResource のインポート設定では、各アトラスページに使用する法線マップ(ノーマルマップ)画像の接頭辞を指定することもできます。デフォルトの接頭辞はnです。法線マップはオプションですが、2Dライティングのサポートに必要です。

ソースファイルのインポートが完了したら、SpineSkeletonFileResourceSpineAtlasResource を組み合わせて、SpineSprite で使用するSpineSkeletonDataResource を作成することができます。

Godotエディタのファイルシステムパネルで、Spineアセットを配置したフォルダを右クリックし、New Resource... を選択します。ポップアップダイアログで、SpineSkeletonDataResource を選択し、Create をクリックして、リソースに名前を付け、Save をクリックします。

新しく作成したリソースをダブルクリックして、インスペクタパネルに表示されるようにします。先にインポートしたアトラスリソースとスケルトンファイルリソースをスケルトンに割り当てます。スケルトンデータリソースにはアニメーションのミックスタイムも保存されており、インスペクタで変更できます。

注意: 特定のスケルトンファイルとアトラスの組み合わせのためのスケルトンデータリソースは、その組み合わせを表示するすべての SpineSprite のインスタンスで共有される必要があります。ゲームに読み込まれるデータ量が重複してしまうので、スケルトンデータをSpineSpriteのインラインリソースとして定義しないでください。

Spineアセットの更新

開発中にSpineのスケルトンデータやテクスチャアトラスファイルを更新したい時は、単純にSpineエディターから再エクスポートを行なって、Godotプロジェクト内の既存のファイルを置き換えるだけで簡単にこれらのソースファイル(.spine-json.skel.atlas.png)ファイルを上書きすることができます。

Godotエディタはこれらのソースファイルへの変更を検出し、それに応じてアセットを再インポートし、その過程でこれらのアセットを参照している他のリソースを更新します。もしGodotエディタがソースファイルの変更を認識できない場合、Godotエディタ内のファイルのインポート設定パネルで強制的に再インポートすることができます。

ノード

spine-godotランタイムは、Spineからエクスポートされたスケルトンを表示したり、アニメーションさせたり、変更を加えるためのノード群を提供します。

SpineSpriteノード

SpineSpriteノードはSkeletonDataResourceに格納されたスケルトンデータとアトラスを表示するノードです。このノードでは、スケルトンをアニメーションさせることができるAnimation stateを公開します。SpineAnimationState は、SpineSprite.get_animation_state() で取得することができます。また、このノードは SpineSprite.get_skeleton()スケルトンインスタンス (SpineSkeleton) を取得し、ボーンやスロット、アタッチメント、スキン、コンストレイントなどのプロパティを取得することができます。

SpineSpriteの作成

SpineSprite ノードを作成するには、シーンパネルの + ボタンをクリックし、 SpineSprite を選択します。次に、SpineSpriteノードが表示する SkeletonDataResourceを、上の画像のようにインスペクタの対応するプロパティに割り当てます。

Godotエディタのビューポートで各種ツールやキーボードショートカットを使って SpineSprite ノードを自由に変形させることができます。 SpineSprite のエディタ内のバウンディングボックス(境界)は、Spineエディターの設定モードでのスケルトンのバウンディングボックスに一致します。

ボーン、スロット、アタッチメントを確認する

SpineSpriteSkeletonDataResource を割り当てると、スケルトンのボーン、スロット、アタッチメントを確認することができます。

エディタビューポートで SpineSprite を選択し、Debug プロパティセクションで確認したいスケルトンコンポーネントにチェックを入れてください。

また、エディタビューポートで各パーツにマウスを乗せると、そのパーツ名が表示されます。

アニメーションのプレビュー

Preview プロパティセクションでは、エディタビューポートですぐに再生されるアニメーションを設定することができます。

Preview Frame をチェックすると、現在の Preview Time におけるアニメーションフレームが表示されます。また、Preview Time スライダでアニメーションをスクラブすることができます。

カスタムマテリアル設定

Materials プロパティセクションでは、サポートされているSpineのブレンドモードごとにカスタムマテリアルを設定することができます。設定したマテリアルは、SpineSprite のすべてのスロットとそのアタッチメントに適用されます。

単一のスロットにマテリアルを設定したい場合は SpineSlotNode を使用することができます。これは SpineSpriteに設定されているカスタムマテリアルを上書きします。

詳しくはサンプルプロジェクト内の example/09-custom-material シーンをご覧ください。

Update Mode設定

デフォルトでは SpineSprite は毎フレーム、可能な限り高速にその基礎データを更新します。この挙動を変更するには、Update Mode プロパティを変更します。

デフォルトは Process モードで、これはフレームレートに依存します。Physics モードは一定の間隔(デフォルトでは1秒間に60回)で SpineSprite を更新し、Godotの物理エンジン関連のコードに有用です。Manual モードは自動更新を全て無効にします。このモードでは、 _process(delta)_physics_process(delta) をオーバーライドするときに SpineSprite.update_skeleton() を呼び出して手動で SpineSprite を更新する必要があります。このモードでは SpineSprite がいつ更新されるかを完全にコントロールすることができます。

詳しくはGodotの公式ドキュメントの「Idle and Physics Processing」を参照してください。

SpineSpriteをアニメーションさせるには

SpineSprite のアニメーションは、GDScriptやGodotがサポートする他のスクリプト言語を使ってコードで実行します。SpineSpriteget_animation_state() を使って SpineAnimationState を公開します。より詳細な情報、特にアニメーショントラックとアニメーションのキューイングについてはSpineランタイムガイドの「アニメーションの適用」を参照してください。

SpineSprite のトラック0に特定のアニメーションを設定するには、以下のように SpineAnimationState.set_animation() を呼び出します。:

extends SpineSprite

func _ready():
var animation_state = get_animation_state()
animation_state.set_animation("walk", true, 0)

最初のパラメータはアニメーションの名前で、2つ目のパラメータはアニメーションをループするか否かを指定し、最後のパラメータはそのアニメーションが再生されるアニメーショントラックを指定します。

アニメーションのキューイングも、以下のようにAnimationStateメソッドで行います:

extends SpineSprite

func _ready():
var animation_state = get_animation_state()
animation_state.set_animation("idle", true, 0)
animation_state.add_animation("walk", 0.5, true, 0)

add_animation()の最初のパラメータはアニメーションの名前です。2つ目のパラメータはディレイを秒で指定します。このディレイの後にこのアニメーションがそのトラックの前のアニメーションを置き換えます。3つ目のパラメータはアニメーションをループするか否かを指定し、最後のパラメータはそのアニメーションが再生されるアニメーショントラックを指定します。

アニメーションステートのトラックにアニメーションを設定(set)または追加(add)すると、SpineTrackEntry が返されます。これを利用して特定のアニメーションの再生のプロパティをさらに変更することができます。例えば、そのTrackEntryを以下のように設定することでそのアニメーションを逆再生することができます。:

var track_entry = animation_state.add_animation("walk", 0.5, true, 0)
track_entry.set_reverse(true)

注意: SpineTrackEntry インスタンスは、使用中の関数以外では保持しないでください。TrackEntryは内部で再利用されるため、それが表すアニメーションが完了すると無効になります。

以下のように set_empty_animation() または add_empty_animation() を使用してアニメーショントラックに空のアニメーションを設定したりキューに入れることで、スケルトンをスムーズにセットアップポーズに戻すことができます:

animation_state.set_empty_animation(0, 0.5)
animation_state.add_empty_animation(0, 0.5, 0.5)

set_empty_animation() の最初のパラメータはトラックを指定します。2つ目のパラメータは前のアニメーションをミックスアウトして「空(empty)」アニメーションをミックスインするのに使われるミックスデュレーションを秒単位で指定します。

add_empty_animation() の最初のパラメータはトラックを指定します。2つ目のパラメータは前のアニメーションをミックスアウトして「空(empty)」アニメーションをミックスインするのに使われるミックスデュレーションを秒単位で指定します。3つ目のパラメータはディレイを秒単位で指定します。このディレイの後にミキシングによって前のアニメーションを「空(empty)」アニメーションに置き換えます。

単一のトラック上のすべてのアニメーションを直ちに消去するには、 clear_track(track_id) を使用します。全てのトラックを一度に消去するには、clear_tracks() を使用します。この場合、スケルトンが最後にとったポーズがそのまま残されます。

スケルトンのポーズをセットアップポーズにリセットするには、SpineSprite.get_skeleton().set_to_setup_pose() を使います。これはボーンとスロットの両方をセットアップポーズの設定にリセットします。スロットだけをセットアップポーズの設定に戻したい時は、 SpineSprite.get_skeleton().set_slots_to_setup_pose() を使用してください。

シグナル

SpineSprite は、ライフサイクルを通してイベントに反応するために、複数のシグナルを公開しています。

アニメーションステートの変化に反応するために、以下のシグナルに接続することができます:

  • animation_started: アニメーションが開始された時に発信されます。
  • animation_interrupted: アニメーションのトラックがクリアされたか、または新しいアニメーションが設定されたなどにより中断された時に発信されます。
  • animation_completed: トラック上のアニメーションが1ループを完了するごとに発信されます。
  • animation_ended: アニメーションが二度と適用されない時に発信されます。
  • animation_disposed: アニメーションのTrackEntryが破棄された時に発信されます。
  • animation_event: ユーザーが定義したイベントが発生した時に発信されます。

アニメーションステートのイベントに加えて、SpineSprite はより高度なライフサイクルのためのシグナルも公開しています:

  • before_animation_state_update: アニメーションステートが現在のデルタタイムで更新される前に発信されます。
  • before_animation_state_apply: アニメーションステートがスケルトンのポーズに適用される前に発信されます。
  • before_world_transforms_change: スケルトンのボーンのワールドトランスフォームが更新される前に発信されます。
  • world_transforms_changed: スケルトンのボーンのワールドトランスフォームが更新された後に発信されます。

これらのシグナルは、ボーンや他のスケルトンコンポーネントを手動で更新したいときに便利です。しかし一般的には、代わりに SpineBoneNodeSpineSlotNode を使用することをお勧めします。それらは、マウスカーソルの位置に基づいてボーンを配置するような使用例の99%をカバーしながらも、そのような手動更新の複雑さを軽減してくれるからです。

詳しくはサンプルプロジェクト内の example/02-animation-state-listeners シーンをご覧ください。

スキンの組み合わせ

髪や目、パンツ、イヤリングやバッグなどのアクセサリーを組み合わせて、自分だけのアバターを作ることができるアプリケーションやゲームはよくあります。Spineでは、スキンを組み合わせることでこれを実現することができます。

他のスキンからカスタムスキンを作成するには、以下のようにします:

   var custom_skin = new_skin("custom-skin")
   var data = get_skeleton().get_data()
   custom_skin.add_skin(data.find_skin("skin-base"))
   custom_skin.add_skin(data.find_skin("nose/short"))
   custom_skin.add_skin(data.find_skin("eyelids/girly"))
   custom_skin.add_skin(data.find_skin("eyes/violet"))
   custom_skin.add_skin(data.find_skin("hair/brown"))
   custom_skin.add_skin(data.find_skin("clothes/hoodie-orange"))
   custom_skin.add_skin(data.find_skin("legs/pants-jeans"))
   custom_skin.add_skin(data.find_skin("accessories/bag"))
   custom_skin.add_skin(data.find_skin("accessories/hat-red-yellow"))
   get_skeleton().set_skin(custom_skin)
get_skeleton().set_slots_to_setup_pose()

まずSpineSprite.new_skin(name)でカスタムスキンを作成します。次に、SpineSpriteが管理しているSpineSkeletonからSpineSkeletonDataを取得します。これはSpineSkeletonData.find_skin()で名前を指定してスキンを探すために使用されます。そして SpineSkin.add_skin() で結合したいスキンを全て追加します。最後に、 SpineSkeleton.set_skin() でスケルトンに新しいスキンを設定します。

詳しくはサンプルプロジェクト内の example/03-mix-and-match シーンをご覧ください。

ボーントランスフォームの取得と設定

SpineSprite は、Spineのランタイムスケルトンをラップしたもので、ボーン、スロット、アタッチメント、コンストレイントから構成されています。スケルトンは、Spineエディタ上でスケルトンの原点を基準とした座標系で、ボーンのトランスフォームを管理します。

SpineSprite クラスは、ヘルパーメソッド get_global_bone_transform(name) および set_global_bone_transform(name, transform) を公開しており、これらはGodotのキャンバス空間でボーンのトランスフォームを取得、設定できるようにします。取得または設定されたトランスフォームは、スキュー(skew)をエンコードしないことに注意してください。

ボーンのトランスフォームを手動で設定したい場合は、SpineSprite がスケルトンのボーンのワールドトランスフォームを更新する前に行う必要があります。これは、 before_world_transforms_change シグナルへ反応させることで行うことができます。

また、ボーンのトランスフォームを直接設定する代わりに、SpineBoneNode を使用することができます。

SpineBoneNode

SpineBoneNode は、スケルトンのボーンに追従(follow)させたり、そのトランスフォームを操作(drive)することができます。マウスの位置など、何らかの入力に基づいてボーンのトランスフォームを制御したい場合では、driveモードで SpineBoneNode を使用します。CollisionShapeSpineSprite のボーンにアタッチしたい場合など、他のノードをスケルトンのボーンに追従させたい場合は、followモードで SpineBoneNode を使用します。

SpineBoneNode を作成するには、まずノードをアタッチしたい SpineSprite を右クリックし、 Add child node... を選択します。利用可能なノードタイプの一覧から SpineBoneNode を選択し、名前を付けます。その後、インスペクタでノードの設定を変更することができます。

注意: SpineBoneNode は常に SpineSprite の直接の子である必要があります。さもないと、追従または操作すべきボーンを見つけることができなくなってしまいます。

Bone Name プロパティのドロップダウンには、選択可能なすべてのボーンが表示されます。Bone Mode は、ノードが SpineSprite のボーンに追従するか、それを操作するかを指定します。ノードは有効にも無効にもでき、必要に応じて追従と操作をオン・オフすることができます。

SpineBoneNodeは、エディタビューポートにも表示されます。Debug セクションのプロパティで見た目を定義できます。

SpineBoneNode を使って SpineSprite 内のボーンをマウスの動きで操作する例については example/05-mouse-following シーンをご覧ください。

SpineBoneNode を使って SpineSprite のボーンを追従する例は example/06-bone-following シーンをご覧ください。この例では、 SpineBoneNode 自体が子ノードを持ち、それが SpineSprite のボーンを追っているように見えるでしょう。

注意: 子ノードは SpineSprite の描画順序には正しく挿入されません。SpineSprite を構成するパーツの描画順序に任意のノードを挿入したい場合には SpineSlotNode が適しています。

SpineSlotNode

SpineSlotNode を使うと、 SpineSprite の描画順序に独自のノードを挿入することができます。これにより、パーティクルシステムやカスタムスプライト、他の SpineSprite のノードをスケルトンの特定のスロットのアタッチメントとして使うことができます。SpineSlotNode の子ノードは、そのスロットのアタッチメントがアクティブであれば、その上にレンダリングされます。また、SpineSlotNode を使って特定のスロットのマテリアルをオーバーライドすることもできます。

SpineSlotNode を作成するには、まずノードをアタッチしたい SpineSprite を右クリックし、Add child node... を選択します。利用可能なノードタイプの一覧から SpineSlotNode を選択し、名前を付けます。その後、インスペクタでノードの設定を変更することができます。

注意: SpineSlotNode は常に SpineSprite の直接の子である必要があります。さもないと、割り当てられたスロットを見つけることができなくなってしまいます。

Slot Name プロパティのドロップダウンには、選択可能なすべてのスロットが表示されます。Materials セクションでは、このスロットのデフォルトマテリアルを上書きするために使用するマテリアルを設定することができます。

SpineSlotNode を使用して SpineSprite の描画順序にノードを挿入する方法について詳しくは example/07-slot-node シーンを参照してください。

SpineSlotNode を使用して SpineSprite の特定のスロットのマテリアルをオーバーライドする方法について詳しくは example/09-custom-material シーンを参照してください。

SpineAnimationTrack

注意: SpineAnimationTrack は非常に実験的なものであることに注意してください。なぜなら、Godotのアニメーションエンジンはサードパーティのプラグインが、例えばインポートされた3Dキャラクターのアニメーションに見られるような完全な忠実度をサポートするほどオープンではないからです。

SpineAnimationTrack ノードを使うと、GodotのAnimationPlayerや強力なアニメーションエディタを使って SpineSprite をアニメーションさせることができます。コードで手作りするのではなく、Godotのアニメーションエディタを使ってカットシーンを作るのに適しています。

SpineAnimationTrack を作成するには、まずノードをアタッチしたい SpineSpriteを右クリックし、 Add child node... を選択します。利用可能なノードタイプの一覧から SpineAnimationTrack を選択し、名前をつけます。その後、インスペクタでノードの設定を変更することができます。

注意: : SpineAnimationTrack は常に SpineSprite の直接の子である必要があります。さもないと、割り当てられたスロットを見つけることができなくなってしまいます。

SpineAnimationTrack を作成すると、AnimationPlayer ノードが作成され、子ノードとしてアタッチされます。

SpineAnimationTrack とその子である AnimationPlayer をキーとして記録することで SpineSprite のアニメーションが行われます。再生するアニメーションを設定するには、子AnimationPlayer にキーを入力します。ループの可否や逆再生などのアニメーションのプロパティを変更するには、 SpineAnimationTrack プロパティをキーにします。

この2段構えにより、アニメーションエディタが子AnimationPlayer のキーとなるアニメーションのデュレーションを表示できるようになり、複雑なアニメーションシーケンスを簡単に作成できるようになっています。また、アニメーションエディタでタイムラインをスクラブしてプレビューすることも可能です。

注意: SpineSkeletonDataResource で定義された SpineSprite が使用するミックスタイムは、Godotアニメーションエディタの技術的制限により、エディタでプレビューすることができないことに注意してください。

単一の SpineSprite に対して複数の SpineAnimationTrack ノードをアタッチすることができます。これは複数のアニメーションを重ねるために使用できます。 SpineAnimationTrack にはそれぞれトラックインデックスが設定されています。同じスケルトンプロパティをキーとする場合、上位トラックのアニメーションは下位トラックのアニメーションの効果を上書きします。

詳しくは example/08-animation-player シーンをご覧ください。シーンのルートにアタッチされた AnimationPlayer には SpineAnimationTrack ノードとその子AnimationPlayer ノードをキーにした2つのアニメーションがあります。slow-moonwalk アニメーションは、SpineAnimationTrack の基本的な原理を簡単に説明したものです。 cutscene アニメーションはより凝ったアニメーションで、複数トラックのキーイングと複雑なアニメーションシーケンスを実演しています。

2Dライティング

spine-godotはGodotの2Dライティングシステムと統合されています。

Godotの2Dライティングシステムをサポートするためには、テクスチャアトラスの法線マップ(ノーマルマップ)を提供する必要があります。テクスチャアトラスページを構成する各 .png は、ファイル階層でその隣に対応する .png 法線マップ画像を持たなければなりません。また、法線マップ画像ファイルは、共通の接頭辞を持つ必要があります。デフォルトの接頭辞は n_ です。例:raptor.png というテクスチャアトラスページ画像は、その隣に n_raptor.png という法線マップ画像を持つ必要があります。

テクスチャアトラスのインポート時に、spine-godotは各テクスチャアトラスページ画像に対して、法線マップ画像の検索とロードを試みます。テクスチャアトラスインポートビューで、独自の法線マップ画像の接頭辞を定義することができます。

テクスチャアトラスページと法線マップ画像が正常にインポートされたら、Godotの2Dライティングシステムを SpineSprite ノードに適用することができます。

詳しくはサンプルの中の 10-2d-lighting シーンをご覧ください。

SpineランタイムAPIアクセス

spine-godotは、SpineランタイムAPIのほとんどをGDSCriptにマッピングしています。SpineSprite.get_skeleton() 経由で SpineSprite から返される SpineSkeleton のようなオブジェクトは、spine-cpp APIをGDScriptに1対1で変換したものです。このため、Spineランタイムガイドに記載されている資料のほとんどをGDScriptに適用することができます。

しかし、GDScriptの性質上、以下のようにいくつかの制約があります:

  • 返される配列やマップはすべて内部配列のコピーです。修正しても影響はありません。
  • 個々の SpineTrackEntry オブジェクトにリスナーを設定することはできません。代わりに SpineSprite にシグナルを設定します。
  • ボーンやスロット、その他のSpineオブジェクトを直接作成、追加、削除することはできません。
  • アタッチメントとタイムラインのC++クラス階層は、GDScriptでは公開されません。