Spineアニメーションの表示を行うプラグイン – MpiShowSpine.js

[概要]
Esoteric Software社のSpineアニメーションファイルを読み込み、表示する機能を提
供します。

[使い方]
※[事前準備]、[制限事項]、[プラグインパラメータ]、[プラグインコマンド]をよく
お読みになった上でご使用ください。

※すべてのプラグインコマンドの引数に変数を指定することができます。
例：SetSpineAnimation 1 \v[10] true
上記例の場合、\v[10]の部分は変数＃0010の値に置き換えられます。

[Spineアニメーションを表示する]
プラグインコマンド'ShowSpine'を使用します。
当コマンド実行後にイベントコマンド「ピクチャの表示」を実行すると、ピクチャ
の表示で設定した座標、拡大率、不透明度でSpineアニメーションを表示します。
なお、「原点」「合成方法」の設定は無効となります。また、不透明度については
パーツごとに半透明となるため、期待した表示結果にならない可能性があります。

[アニメーション内容を変更する]
プラグインコマンド'SetSpineAnimation'、'AddSpineAnimation'を使用します。
コマンドを実行した時点で即座に変更したい場合はSetSpineAnimationを、表示中の
アニメーションが1ループ分終わったあとに変更したい場合はAddSpineAnimationを
使用してください。

[複数のアニメーションを連続して再生する]
プラグインコマンド'AddSpineAnimation'を使用します。
当コマンドを一度に複数設定すると、設定したアニメーションを順次再生します。

[指定したアニメーションの中からランダムで再生する]
プラグインコマンド'SetSpineRandomAnimation'、'AddSpineRandomAnimation'、
'SetSpineRandomAnimationEx'、'AddSpineRandomAnimationEx'を使用します。

[アニメーションの切り替わりを滑らかにする]
プラグインコマンド'SetSpineMix'を使用します。

[スキンを切り替える]
プラグインコマンド'SetSpineSkin'を使用します。

[アニメーションの再生速度（タイムスケール）を変更する]
プラグインコマンド'SetSpineTimeScale'を使用します。

[色合いや透明度を変更する]
プラグインコマンド'SetSpineColor'を使用します。

[一部のパーツにモザイクをかける]]
プラグインコマンド'SetSpineMosaic'を使用します。

[Spineに設定したイベントの音声を再生する]
[イベントに設定した音声の再生について]をご参照ください。

[事前準備]
'https://github.com/pixijs'から'pixi-spine.js'を取得してください。
※ご利用のSpineのバージョンによって取得する場所が異なります。
・Spine 3.7x以前
　　https://github.com/pixijs/pixi-spine/tree/v4.x/bin
　・Spine 3.8x以降
　　https://github.com/pixijs/pixi-spine/tree/pixi4-spine3.8/bin
取得した'pixi-spine.js'を、'js/libs'フォルダ内に置いてください。
'img'フォルダ内に、'spines'フォルダを作成してください。
作成した'spines'フォルダの中に、json形式でエクスポートしたSpineアニメーショ
ンファイル一式（jsonファイル以外のファイルを含む）を入れてください。
なお、エクスポートの際は「アトラス作成（Create atlas）」をONにしてください。
atlasファイルはjsonファイルと同名でなければなりません。
エクスポートした結果、ファイル名が異なっていた場合は同名に変更してください。

[制限事項]
デプロイメントの際に「未使用ファイルを含まない」をONにしていると'spines'フォ
ルダおよびその中のファイルは未使用ファイルと判断され、デプロイメントの対象か
ら外されてしまいます。お手数ですがデプロイメント後に'spines'フォルダ以下のフ
ァイルをデプロイメント先にコピーするなど、個別に対応をお願いします。

画像の暗号化には対応していません。デプロイメントの際に画像の暗号化を行われる
場合はデプロイメント後に'spines'フォルダ以下のファイルを暗号化前のものと置き
換えて頂くようお願いします。

[プラグインパラメータ]
Spine File
Spineアニメーションファイル（.json）を指定してください。ファイルは複数指定
できます。jsonファイル以外のファイルは指定する必要はありません。
また、拡張子（.json）は書く必要はありません。（書いても問題ありません）。

[例] 'img/spines'フォルダにある'spineboy.json'ファイルを指定する場合

spineboy

[例] 'img/spines'フォルダに'spineboy'フォルダがあり、
その中に'spineboy.json'ファイルがある場合

spineboy/spineboy

[プラグインコマンド]
ShowSpine <ファイル名> <アニメーション名> <ループの有無>
<ファイル名> Spineアニメーションファイルのファイル名（拡張子不要）
<アニメーション名> Spineアニメーションに設定されているアニメーション名
<ループの有無> アニメーションを繰り返すかどうか。（true/false）

表示したいSpineアニメーションを設定します。コマンド実行後、イベントコマンド
「ピクチャの表示」実行時に、設定したSpineアニメーションが表示されます。
ループの有無は省略可能です。省略した場合、'true'を指定した扱いとなります。

[例] ShowSpine spineboy walk true
[例] ShowSpine spineboy jump false
........
SetSpineAnimation <ピクチャ番号> <アニメーション名> <ループの有無>
<ピクチャ番号> アニメーションを設定する対象となるピクチャ番号
<アニメーション名> Spineアニメーションに設定されているアニメーション名
<ループの有無> アニメーションを繰り返すかどうか。（true/false）

表示中のSpineアニメーションのアニメーション内容を変更します。コマンド実行直
後に現在のアニメーションは中断され、新しいアニメーションが開始されます。
ループの有無は省略可能です。省略した場合、'true'を指定した扱いとなります。

[例] SetSpineAnimation 1 walk true
[例] SetSpineAnimation 2 jump false
........
AddSpineAnimation <ピクチャ番号> <アニメーション名> <ループの有無>
<ピクチャ番号> アニメーションを追加する対象となるピクチャ番号
<アニメーション名> Spineアニメーションに設定されているアニメーション名
<ループの有無> アニメーションを繰り返すかどうか。（true/false）

表示中のSpineアニメーションにアニメーション内容を追加します。コマンドを実行
しても即座にアニメーションは開始せず、現在再生中のアニメーションが1ループ分
完了したのちに再生を開始します。また、複数のAddSpineAnimationを重ねて実行し
た場合、実行した順にアニメーションを順次再生していきます。
ループの有無は省略可能です。省略した場合、'true'を指定した扱いとなります。
なお、複数のAddSpineAnimationを重ねて実行した場合、ループの有無の指定は最後
のコマンドのみ有効となります。

[例] AddSpineAnimation 1 walk true
[例] AddSpineAnimation 2 jump false
........
SetSpineRandomAnimation <ピクチャ番号> <アニメーション名リスト> <ループの有無>
<ピクチャ番号> アニメーションを設定する対象となるピクチャ番号
<アニメーション名リスト> Spineアニメーションに設定されているアニメーション名のリスト
<ループの有無> アニメーションを繰り返すかどうか。（true/false）

表示中のSpineアニメーションのアニメーション内容を変更します。コマンド実行直
後に現在のアニメーションは中断され、新しいアニメーションが開始されます。
開始するアニメーションはアニメーション名リストの中からランダムで抽選されま
す。また、アニメーションごとに抽選確率を設定できます（下記実行例を参照）。
ループの有無は省略可能です。省略した場合、'true'を指定した扱いとなります。

[例] SetSpineRandomAnimation 1 idle,walk true

idleとwalkを1:1の確率で抽選し、選ばれた方のアニメーションを開始

[例] SetSpineRandomAnimation 2 idle(5),walk false

idleとwalkを5:1の確率で抽選し、選ばれた方のアニメーションを開始
........
AddRandomSpineAnimation <ピクチャ番号> <アニメーション名リスト> <ループの有無>
<ピクチャ番号> アニメーションを追加する対象となるピクチャ番号
<アニメーション名リスト> Spineアニメーションに設定されているアニメーション名のリスト
<ループの有無> アニメーションを繰り返すかどうか。（true/false）

表示中のSpineアニメーションにアニメーション内容を追加します。コマンドを実行
しても即座にアニメーションは開始せず、現在再生中のアニメーションが1ループ分
完了したのちに再生を開始します。開始するアニメーションはアニメーション名リ
ストの中からランダムで抽選されます。また、アニメーションごとに抽選確率を設
定できます（下記実行例を参照）。
ループの有無は省略可能です。省略した場合、'true'を指定した扱いとなります。
なお、複数のAddSpineAnimationを重ねて実行した場合、ループの有無の指定は最後
のコマンドのみ有効となります。

[例] AddSpineRandomAnimation 1 idle,walk true

idleとwalkを1:1の確率で抽選し、選ばれた方のアニメーションを追加

[例] AddSpineRandomAnimation 2 idle(5),walk false

idleとwalkを5:1の確率で抽選し、選ばれた方のアニメーションを追加
........
SetSpineRandomAnimationEx <ピクチャ番号> <アニメーション名リスト>
<ピクチャ番号> アニメーションを設定する対象となるピクチャ番号
<アニメーション名リスト> Spineアニメーションに設定されているアニメーション名のリスト

基本的にSetSpineRandomAnimationと同じですが、設定されたアニメーションが1ル
ープ分再生されると再びランダム抽選し、アニメーションを開始します。

[例] SetSpineRandomAnimationEx 1 idle,walk true

idleとwalkを1:1の確率で抽選し、選ばれた方のアニメーションを開始
アニメーションの再生が終わると再びランダムで抽選し、再生

[例] SetSpineRandomAnimationEx 2 idle(5),walk false

idleとwalkを5:1の確率で抽選し、選ばれた方のアニメーションを開始
アニメーションの再生が終わると再びランダムで抽選し、再生
........
AddSpineRandomAnimationEx <ピクチャ番号> <アニメーション名リスト>
<ピクチャ番号> アニメーションを追加する対象となるピクチャ番号
<アニメーション名リスト> Spineアニメーションに設定されているアニメーション名のリスト

基本的にAddSpineRandomAnimationと同じですが、設定されたアニメーションが1ル
ープ分再生されると再びランダム抽選し、アニメーションを開始します。

[例] AddSpineRandomAnimationEx 1 idle,walk true

idleとwalkを1:1の確率で抽選し、選ばれた方のアニメーションを追加
追加されたアニメーションの再生が終わると再びランダムで抽選し、再生

[例] AddSpineRandomAnimationEx 2 idle(5),walk false

idleとwalkを5:1の確率で抽選し、選ばれた方のアニメーションを追加
追加されたアニメーションの再生が終わると再びランダムで抽選し、再生
........
SetSpineMix <ピクチャ番号> <アニメーション名> <次アニメーション名> <合成時間>
<ピクチャ番号> アニメーション合成を設定する対象となるピクチャ番号
<アニメーション名> Spineアニメーションに設定されているアニメーション名
<次アニメーション名> Spineアニメーションに設定されているアニメーション名
<合成時間> アニメーション間の合成部分の時間

アニメーションを切り替える際の、アニメーション間の合成部分の時間を設定しま
す。本設定を行うと、アニメーションが切り替わるとき、切り替え前のアニメーシ
ョンから切り替え後のアニメーションへ、指定した合成時間をかけて滑らかに移行
します。

[例] SetSpineMix 1 walk run 0.2

walk から run へ切り替わるとき、0.2秒かけて滑らかに切り替わる

[例] SetSpineMix 2 run jump 0.4

run から jump へ切り替わるとき、0.4秒かけて滑らかに切り替わる
........
SetSpineSkin <ピクチャ番号> <スキン名>
<ピクチャ番号> スキンを設定する対象となるピクチャ番号
<スキン名> Spineアニメーションに設定されているスキン名

表示中のSpineアニメーションのスキンを変更します。

[例] SetSpineSkin 1 goblin
[例] SetSpineSkin 2 goblingirl

........
SetSpineTimeScale <ピクチャ番号> <タイムスケール値>
<ピクチャ番号> タイムスケールを設定する対象となるピクチャ番号
<タイムスケール値> 設定するタイムスケールの値

表示中のSpineアニメーションのタイムスケールを変更します。デフォルトのタイム
スケールは1です。例えばタイムスケール値に2を指定した場合、アニメーション速
度が2倍になります。タイムスケール値に0は指定できません。アニメーションが停
止したような演出をしたい場合は、0に近い0以外の値を指定してください。

[例] SetSpineTimeScale 1 2
[例] SetSpineTimeScale 2 4
[例] SetSpineTimeScale 3 0.0000001

........
SetSpineColor <ピクチャ番号> <赤> <緑> <青> <不透明度>
<ピクチャ番号> 色を設定する対象となるピクチャ番号
<赤> 係数（赤）
<緑> 係数（緑）
<青> 係数（青）
<不透明度> 係数（不透明度）

表示中のSpineアニメーションの色を変更します。色そのものを指定するのではなく
元の色に各係数を掛けたものが表示される色となります。
例えば元の色がRGBA=(100,100,100,255)だった場合、係数（赤）に1.5を指定し、他
はすべて1.0とすると、表示される色はRGBA=(150,100,100,255)となります。
要するに1.0は元の色のまま、1.0より小さいとその色味は弱くなり、1.0より大きい
と強くなります。

[例] SetSpineColor 1 1.5 1.0 1.0 1.0
[例] SetSpineColor 2 1.0 1.0 1.0 0.5

........
SetSpineMosaic <ピクチャ番号> <イメージ名> <サイズ>
<ピクチャ番号> モザイクを適用する対象となるピクチャ番号
<イメージ名> 適用するパーツのイメージ名
<サイズ> モザイクのサイズ（ピクセル数）

Spineアニメーションの一部パーツにモザイクを適用します。指定するイメージ名は
Spineアニメーション作成時に設定した画像ファイルの名前です。例えばSpineアニ
ーションに「head」という画像を設定していて、その部分をモザイクにしたい場合
はイメージ名に head と指定します。モザイクを解除する場合はサイズの指定をせ
ずにプラグインコマンドを実行してください。

[例] SetSpineMosaic 1 head 6
[例] SetSpineMosaic 2 foot 12
[例] SetSpineMosaic 1 head

[イベントに設定した音声の再生について]
Spineにイベントを設定していて、そのイベントにオーディオを設定している場合、
イベントのトリガーに合わせて音声を再生します。再生される音声について、以下の
点にご注意ください。

・再生される音声はaudio/seフォルダ内のoggまたはm4aファイル
例えばSpineのイベントに「ABC.mp3」という音声ファイルを登録していた場合、
ツクールMVで再生する場合はaudio/seフォルダ内の「ABC.ogg」または「ABC.m4a」
が再生されます。ogg/m4aのどちらが再生されるかについてはツクールMVの仕様、
または外部プラグイン等の制御に従います。

・ボリュームとバランスはタイムライン上のキーに設定したものを使用
音声のボリュームとバランスは、タイムライン上に配置したイベントのキーに設定
されているものを使用します。ツリー上のイベントの音声設定を変更しても、タイ
ムライン上の設定が変更されていなければゲームには反映されません。

ボリュームとバランスについては変数の値を反映することもできます。タイムライン
上のイベントのキーの「文字列」に以下のような記述をすることで変数の値を使用す
るようになります。

・変数10番の値をボリュームの値として使用する場合
volume:10

・変数20番の値をバランスの値として使用する場合
balance:20

・ボリュームとバランスの両方に変数の値を使用する場合
volume:10,balance:20

[利用規約] ..................................................................
- 本プラグインの利用は、RPGツクールMV/RPGMakerMVの正規ユーザーに限られます。
- 商用、非商用、有償、無償、一般向け、成人向けを問わず、利用可能です。
- 利用の際、連絡や報告は必要ありません。また、製作者名の記載等も不要です。
- プラグインを導入した作品に同梱する形以外での再配布、転載はご遠慮ください。
- 本プラグインにより生じたいかなる問題についても、一切の責任を負いかねます。
[改訂履歴] ..................................................................
Version 1.12 2020/05/28 pixi-spine.jsとjsonの読み込み処理改善
Version 1.11 2020/02/09 クリッピングのあるアニメーション実行中にモザイク
化を実行するとエラーになることがある不具合を修正
Version 1.10 2019/10/21 パーツのモザイク化機能を追加
Version 1.09 2019/10/18 アニメーションのランダム再生機能を追加
Version 1.08 2019/10/11 Spineのイベントによる音声再生に対応
Version 1.07 2019/10/06 MadeWithMv.jsとの競合対策
Version 1.06 2019/03/29 セーブ時に表示していたSpineアニメーションが
ロード後に表示されなくなっていた不具合を修正
スキン変更が正しく行われていなかった不具合を修正
Version 1.05 2019/03/17 競合対策
Version 1.04 2018/12/13 カラー変更機能追加
Version 1.03 2018/10/31 Spineファイル読み込み処理改善
Version 1.02 2018/10/24 タイムスケール変更機能追加
Version 1.01 2018/06/11 スキンに対応
Version 1.00 2018/06/11 初版
-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-+-
Web Site: http://makonet.sakura.ne.jp/rpg_tkool/
Twitter : https://twitter.com/koma_neko
Copylight (c) 2018 Nekoma Otobuki