Top/ドキュメント/spine-ue4

spine-ue4

tCard.png

spine-ue4 runtime
Table of Contents

ドキュメントの翻訳について †

  • このページは Spine公式ドキュメント「spine-ue4 Runtime Documentation」を www.DeepL.com/Translator（無料版）で翻訳しました。
  • 訳がおかしいと感じたところ、わかりにくいところなどありましたらコメントで教えてください。
  • 管理人はコーダーではありません。C++についてはまったくわかりません。
↑

はじめに †

↑

インストール †

アンリアル・エンジン・プロジェクトで spin-ue4 ランタイムを使用するには。

  1. Unreal Engine 4（バージョン 4.21以上）をダウンロードしてインストールします。
  2. Visual Studio 2015 Community、またはオペレーティング システムに応じて最新の Xcode をダウンロードしてインストールします。
  3. Unreal Engine Editor で新しい空のコード プロジェクトを作成します。あなたは、C++またはBlueprintsのいずれかを使用してスピン-ue4ランタイムで動作するようにすることができます、プラグインを置くには、コードプロジェクトが必要です。
  4. spin-runtimeのGitリポジトリをクローンします。Gitを使いたくない場合は、最新版をZIPでダウンロードして解凍してください。
  5. プロジェクトフォルダ内にPluginsというサブフォルダを作成します。
  6. spine-runtimes/spine-ue4/Plugins/ の内容をプロジェクトの Plugins/ フォルダにコピーします。 spine-runtimes/spine-cpp/spine-cpp フォルダをプロジェクトの
    Plugins/SpinePlugin/Source/SpinePlugin/Public/ フォルダにコピーします。
  7. C++ または Blueprints 経由の spine-ue4 ランタイムをプロジェクトで使用します。

C++ コード経由で Spine Plugin を使用したい場合は、UE4 プロジェクトの Build.cs ファイルも以下のように修正する必要があります。

  1. SpinePlugin を PublicDependencyModuleNames に追加する
  2. SpinePlugin/Public および SpinePlugin/Classes を PublicIncludePath に追加する

サンプルの Build.cs を参照して、完全な例を確認してください。

Unreal Engine Editor でプロジェクトを開き、 [ファイル] -> [Visual Studioを開く] または [ファイル] -> [Xcodeを開く] を選択することで、ゲームと Spine-ue4 ランタイムの両方の C++ コードを確認することができます。

↑

サンプル †

spin-ue4 のランタイム サンプルを探索するには。

  1. Unreal Engine 4（バージョン 4.21+）をダウンロードしてインストールします。
  2. Visual Studio 2015 Community、またはOSに応じて最新のXcodeをダウンロードしてインストールします。
  3. spin-runtimesのGitリポジトリをクローンします。Gitを使いたくない場合は、最新版をZIPとしてダウンロードして解凍します。
  4. spin-runtimes/spine-cpp/spine-cpp フォルダを spin-runtimes/spine/ue4Plugins/SpinePlugin/Source/SpinePluginPublic フォルダにコピーします。
  5. Unreal Engine Editor でプロジェクトを開き、 Maps/ content フォルダにあるさまざまなマップをチェックアウトします。各マップには、実行方法と表示される内容の説明がテキストで記載されています。

アンリアル エンジン エディタでプロジェクトを開き、 [ファイル] -> [Visual Studio を開く] または [ファイル] -> [Xcode を開く] を選択することで、サンプルと spin-ue4 ランタイムの両方の C++ コードを検査および修正することができます。

↑

spin-ue4 ランタイムの更新 †

プロジェクトの spin-ue4 ランタイムをアップデートする前に、Spineエディタとランタイムのバージョン管理についてのガイドを参照してください。

最新の spin-ue4 ランタイムにアップデートすることを確認したら、次のようにします。

  1. 最新の変更点をSpine-runtimesのGitリポジトリからGit経由で引っ張ってきて最新のSpine-ue4ランタイムを入手するか、最新バージョンをZIPとしてダウンロードして解凍します。
  2. Unreal Engine EditorとVisual StudioXcodeを閉じます。
  3. Unreal Engine プロジェクトから Plugins/SpinePlugin フォルダを削除します。
  4. spin-runtimes/spine-ue4/Plugins の内容をプロジェクトの Plugins/ フォルダにコピーします。
  5. spin-runtimes/spine-cpp/spine-cpp フォルダをプロジェクトの Plugins/SpinePlugin/Source/SpinePlugin/Public フォルダにコピーします。
  6. アンリアル エンジン エディタでプロジェクトを開き、Windows の場合は [ファイル] -> [Visual Studio プロジェクト ファイルの生成] 、macOS の場合は [ファイル] -> [Xcode プロジェクト ファイルの生成] を選択します。
  7. プロジェクトのソース コードとプラグインのソース コードをリコンパイルします。

spin-ue4 ランタイムは、一般的な spin-cpp ランタイムをベースにしています。Spin-ue4 と spin-cpp ランタイムの両方の変更点を GitHub で確認してください。
↑

spine-ue4を使う †

↑

概要 †

spin-ue4 ランタイムは、Spine で作成されたアニメーションの再生と操作をサポートする Unreal Engine プラグインです。spin-ue4 ランタイムは C++ で書かれており、一般的な spin-cpp ランタイムをベースにしています。spin-ue4 ランタイムは、Spine-cpp 構造体と関数をラップし、コードと Unreal Engine ブループリントの両方で公開します。さらに、Spine-ue4 ランタイムは、Spine エディターからエクスポートされたファイルをインポートし、カスタムの Unreal Engine アセット タイプに保存します。

Spine ランタイム アーキテクチャの詳細な概要については、「Spine Runtimes Guide」を参照してください。

↑

アセットマネジメント †

↑

アンリアル・エンジン用のエクスポート †

export.png

スケルトンとアニメーションデータをエクスポートする方法については、Spineユーザーガイドの指示に従ってください。

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

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

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

spin-ue4 ランタイムでは、これらのファイルを特別な Unreal Engine のアセット タイプにインポートすることができます。

spin-ue4 ランタイムは、現在のところ、事前に乗算されたアルファを使ってエクスポートされたアトラスをサポートしていません。
↑

アンリアル・エンジンへのインポート †

import-general.png
  1. アンリアル・エンジン・エディターでアンリアル・エンジン・プロジェクトを開きます。
  2. コンテンツ ブラウザで Import をクリックします。
  3. Spine Editorからエクスポートした .json または .skel ファイルを選択します。

アセット インポーターは、スケルトン データとテクスチャ アトラス用の Unreal Engine アセットを自動的に作成します。インポーターは、 .atlas と .png ファイルがスケルトンの .json または .skel ファイルの隣にあることを前提としています。

テクスチャアトラスファイルがスケルトンデータの .json または .skel ファイルの名前を共有していない場合は、コンテンツブラウザで Import をクリックして .atlas ファイルを選択し、手動でテクスチャアトラスファイルをインポートしてください。

インポートについて

  1. スケルトンデータファイル( .json , .skel )用のSpineスケルトンデータアセット
  2. テクスチャ アトラス ファイル ( .atlas ) 用の Spine テクスチャ アトラス アセット
  3. 各テクスチャアトラスページのテクスチャアセット( .png )は、テクスチャアトラスアセットの隣にある「Textures」という名前のコンテンツフォルダに置かれます。
imported-files.png

↑

Spineアセットの更新 †

開発中、Spine スケルトンデータとテクスチャアトラスファイルを頻繁に更新することがあります。Spine Editorから再エクスポートすることで、これらのソースファイル（ .json 、 .skel 、 .atlas 、 .png ）を上書きすることができます。

アンリアル・エンジン・エディターは、これらのソース・ファイルの変更を検出し、これらのソース・ファイルからアセットを再インポートするように促します。再インポート後は、以前にインポートされた Spine アセットへの参照はすべてそのままで、最新のソース データが使用されます。

アンリアル エンジン エディタでは、ソース ファイルの変更を認識できないことがあります。この場合は、コンテンツ ブラウザで Spine スケルトン データまたはテクスチャ アトラス アセットを探し、ダブルクリックしてから、新しく開いたウィンドウのメニューから [Asset] -> [Reimport] を選択します。
↑

スケルトンデータアセット †

スケルトン データ アセットには、スケルトンを構成するボーン階層、スロット、描画順序、アニメーション、その他のデータに関する情報が保存されます。その他のコンポーネントは、Spine-UE4 ランタイムのリファレンスで提供され、このスケルトン データ アセットを共有することで、アンリアル エンジンのアクター インスタンスの一部としてスケルトンをアニメーション化して表示することができます。

skeletondataasset.png

スケルトン データ アセットでは、アニメーションのミックス タイムを指定することができます。コンテンツ ブラウザでアセットをダブルクリックし、デフォルトのミックス タイムを入力するか、アセットの Mix Data プロパティの + 記号をクリックして 2 つの特定のanimation mix timeを定義します。

スケルトン アニメーション コンポーネントのようにスケルトン データ アセットを使用するコンポーネントは、アニメーションを再生する際にこれらのミックス タイムを使用します。

スケルトン データ アセットの詳細ビューには、アセットに含まれるすべてのボーン、スロット、アニメーション、スキン、およびイベントも表示されます。

details-view.png
↑

テクスチャ アトラス アセット †

テクスチャ アトラス アセットには、スケルトンで使用されるイメージに関する情報、すなわち、どのテクスチャ アトラス ページにイメージが保存されているか、およびテクスチャ アトラス ページの UV テクスチャ座標が含まれます。

textureatlasasset.png

コンテンツブラウザでアセットをダブルクリックすると、テクスチャアトラスページのテクスチャが表示されます。

テクスチャ アトラス アセットによって参照されるテクスチャを変更することができます。この場合、UVテクスチャの座標が有効なままであることを確認してください。
↑

コンポーネント †

spin-ue4 ランタイムは、Spine からエクスポートされたスケルトンの表示、アニメーション、修正を可能にする一連のコンポーネントを提供します。これらのコンポーネントは、上記のようにインポートしたスケルトンデータとテクスチャアトラスアセットを参照します。

↑

レベルにスケルトンを追加する †

Unreal Engine プロジェクトで Spine スケルトンを素早く表示するには

  1. 上記のようにスケルトンデータとテクスチャアトラスをインポートします。
  2. レベルに空のアクタを作成します。
  3. 詳細ビューのアクターに Spine Skeleton Animation コンポーネントを追加し、スケルトン データとテクスチャ アトラス プロパティをアセットに設定します。
    addanimationcomponent.png
  4. アクターにSpine Skeleton Rendererコンポーネントを追加する
    addrenderercomponent.png

ブループリントまたはコンポーネントの C++ API を使用してスケルトンをアニメーションさせたり、アニメーションによってトリガーされたイベントに反応させたりすることができるようになりました。詳細については、以下のコンポーネントのドキュメントを参照してください。

エディタでスケルトンをレンダリングするには、ビューポートでリアルタイムモードをオンにしてください。
realtimemode.png

↑

スケルトンコンポーネント †

スケルトン コンポーネントは、スケルトン データとテクスチャ アトラス アセットへの参照を保存し、Tick()ごとに各ボーンのワールド トランスフォームを更新します。これは、スケルトン アニメーション コンポーネントや独自のカスタム コンポーネントのベース コンポーネントとして機能します。

一般的には、以下に説明するスケルトン・アニメーション・コンポーネントを使用したいと思います。これにより、スケルトンにアニメーションを適用することができます。プレーンなスケルトン コンポーネントを、独自のカスタム スケルトン コンポーネントのベースとして使用します。
スケルトンデータとテクスチャアトラスの設定

スケルトン・コンポーネントは、スケルトン・データ・アセットへの参照を必要とし、スケルトンの骨の階層やスロットなどの情報を取得することができ、テクスチャ・アトラス・アセットへの参照を必要とします。

スケルトンデータとテクスチャアトラスを設定するには

  1. アクタの詳細ビューでコンポーネントを選択します。
  2. Atlas と Skeleton Data のプロパティを設定します。

コンポーネントが正しく機能するためには、スケルトン・データとアトラス・アセット参照の両方が設定されている必要があります。どちらか一方または両方が未定義の場合、コンポーネントはC++とブループリントを介したすべての相互作用を優雅に無視します。
ライフサイクル

スケルトンコンポーネントは、 UActorComponent::Tick() メソッドを実装しており、スケルトンのすべてのボーンのワールドトランスフォームを更新します。

このコンポーネントは、すべてのボーンのワールドトランスフォームが計算される前と後で、このライフサイク ルをインターセプトできるようにするプロパティとして、マルチキャストデリゲートの BeforeUpdateWorldTransform と AfterUpdateWorldTransform を公開しています。これらのデリゲートにバインドして、アクターやコンポーネントの更新順序を気にすることなく、ボーンの位置やスケルトンの他の側面を変更することができます。

C++

ライフサイクルをインターセプトすべきクラスでは、クラスのヘッダーファイルに UFUNCTION 宣言を追加します。

UFUNCTION()
void BeforeUpdateWorldTransform(USpineSkeletonComponent* skeleton).

メソッドを UFUNCTION としてマークすることが重要で、そうしないとデリゲートにバインドできません。

次に、この関数の定義をクラスの .cpp ファイルに追加します。

void MyClass::BeforeUpdateWorldTransform(USpineSkeletonComponent* skeleton) {
... modify the skeleton here ... }

最後に、メソッドをデリゲート（例えば、アクタやコンポーネントの BeginPlay() ）にバインドします。スケルトン・コンポーネントを含む AActor への参照があると仮定します。

AActor* actor = ...
USpineSkeletonComponent* skeletonComponent = static_cast<USpineSkeletonComponent*>(Actor->GetComponentByClass(USpineSkeletonComponent::StaticClass()));
skeletonComponent->BeforeUpdateWorldTransform.AddDynamic(this, &USpineBoneDriverComponent::BeforeUpdateWorldTransform);

AfterUpdateWorldTransform デリゲートへのバインディングも同様に動作します。

Blueprint

スケルトンコンポーネントを含むアクターの設計図があると仮定して
  1. blueprintエディタで blueprint を開く
  2. コンポーネント ビューで、スケルトン コンポーネントを選択します。
    selectskeletoncomponent.png
  3. スケルトン コンポーネントの詳細ビューで、 BeforeUpdateWorldTransform または AfterUpdateWorldTransform の+をクリックします。
    addbeforeupdateworldevent.png
  4. 他のブループリントノードをイベントのexecピンに接続して、カスタム更新ロジックを実装します。
    beforeupdatenode.png

AfterUpdateWorldTransform イベントへのバインディングも同じように動作します。

スキンの設定

Spine スケルトンは、どのアタッチメントがどのスロットに装着されるかを定義する複数の スキン を持つことができます。スケルトンコンポーネントは、スキンを切り替える簡単な方法を提供します。
C++
bool success = skeletonComponent->SetSkin(FString(TEXT("skinName"));
Blueprint

setskin.png

アタッチメントの設定

アタッチメントを設定するには、スロットとアタッチメント名を入力します。
C++

bool success = skeletonComponent->SetAttachment(FString(TEXT("slotName")), FString(TEXT("attachmentName"));
Blueprint

setattachment.png

セットアップポーズのリセット

アタッチメントを設定するには、スロットとアタッチメント名を入力します。
C++

skeletonComponent->SetToSetupPose();
skeletonComponent->SetBonesToSetupPose();
skeletonComponent->SetSlotsToSetupPose();
Blueprint

setsetuppose.png

スケルトンの反転

スケルトンを縦または横に反転させることで、アニメーションを再利用することができます。例えば、左を向いている歩行アニメーションを右を向いて再生することができます。
C++

bool isFlippedX = skeletonComponent->GetScaleX() < 1;
skeletonComponent->SetScaleX(-1);
bool isFlippedY = skeletonComponent->GetScaleY() < 1;
skeletonComponent->SetScaleY(-1);
Blueprint

flip.png

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

スケルトン コンポーネントでは、ボーンのトランスフォームを設定したり取得したりすることができ、IK 地形追従を実装したり、パーティクル システムなどの他のアクターやコンポーネントにスケルトンのボーンを追従させることができます。すべてのトランスフォームはワールド座標系で与えられ、インタラクションを容易にします。

ボーンのローカル変換を変更する必要がある場合は、C++ コードで spin-cpp ランタイム API を使用してください。

update world transform のライフサイクルの一部として新しいボーンの位置を適用するようにしてください。

SpineボーンのフォロワーとSpineボーンのドライバーコンポーネントは、ボーンとの相互作用を容易にします。
C++

FTransform boneWorldTransform = skeletonComponent->GetBoneWorldTransform(FString(TEXT("boneName"));
skeletonComponent->SetBoneWorldPosition(FString(TEXT("boneName"), FVector(x, y, z));
Blueprint

worldtransform.png

↑

スケルトンアニメーションコンポーネント †

スケルトンアニメーションコンポーネントは、Spine-ue4 ランタイムの中核をなすものです。これにより、アクターにSpineスケルトンを追加したり、アニメーションさせたり、アニメーションイベントに反応させたりすることができます。

スケルトンアニメーションコンポーネントは、スケルトンコンポーネントをベースにしているため、上記で説明したスケルトンコンポーネントの機能をすべて継承しています!
ライフサイクル

スケルトン・アニメーション・コンポーネントは、 UActorComponent::Tick() メソッドを実装し、デルタ時間に基づいて基礎となるAnimationStateを更新し、 AnimationState をスケルトンに適用し、スケルトンのすべてのボーンのワールド・トランスフォームを更新します。

スケルトンアニメーションコンポーネントをベースにしているので、上記のように BeforeUpdateWorldTransform と AfterUpdateWorldTransform にバインドすることができます。

スケルトンアニメーションコンポーネントは、ブループリントと C++ の両方に AnimationState API を公開します。このセクションでは、一般的な Spine ランタイムガイドの「アニメーションの適用」のセクションで説明されているように、トラック、トラックエントリ、ミックスタイム、またはアニメーションのキューイングなどの概念に精通していることを前提としています。

Time Scale

スケルトン・アニメーション・コンポーネントのタイム・スケールを設定して、アニメーションの再生速度を遅くしたり、速くしたりすることができます。例えば、0.5のタイムスケールではアニメーションは通常の半分の速度に遅くなり、2のタイムスケールでは通常の2倍の速度になります。
C++

float timeScale = animationComponent->GetTimeScale();
animationComponent->SetTimeScale(0.5);
Blueprint

timescale.png

アニメーション設定

アニメーションを設定するには、トラックインデックス、アニメーション名、アニメーションをループさせるかどうかを指定します。
C++

USpineSkeletonAnimationComponent* animationComponent = ... fetch from actor ..
UTrackEntry* entry = animationComponent->SetAnimation(trackIndex, FString(TEXT("walk")), true);
Blueprint

setanimationnode.png

キューイングアニメーション

アニメーションをキューに入れるには、トラックインデックス、アニメーション名、アニメーションをループさせるかどうか、アニメーションがトラック上で再生を開始するまでの時間を秒単位で指定します。
C++

UTrackEntry* entry = animationComponent->AddAnimation(trackIndex, FString(TEXT("run")), true, 2);
Blueprint

addanimationnode.png

空のアニメーションを設定してキューに入れる、トラックをクリアする

スケルトン・アニメーション・コンポーネントには、空のアニメーションを設定したり、空のアニメーションをキューに入れたり、1つまたはすべてのトラックをクリアしたりするためのメソッドとブループリント・ノードもあります。これらはすべて、上記のメソッドとノードに類似した動作をします。
C++

UTrackEntry* entry = animationComponent->SetEmptyAnimation(trackIndex, mixDuration);
entry = animationComponent->AddEmptyAnimation(trackIndex, mixDuration, delay);
animationComponent->ClearTrack(trackIndex);
animationComponent->ClearTracks();
Blueprint

cleartrack.png

トラックエントリー

この特定のアニメーションの再生をさらにカスタマイズしたり、トラックエントリ特定のイベントのデリゲートにバインドしたりすることができるように、すべてのmethodnodesからTrackEntryを受け取ることになります。以下の「AnimationStateイベントの処理」を参照してください。

返されたトラックエントリは、対応するアニメーションが基礎となるアニメーションの状態から削除されるまで有効です。Unreal Engine のガベージコレクタが自動的に解放します。トラック エントリのダイポーズ イベントを受信した後は、そのトラック エントリを保存したりアクセスしたりすることはできません。基底にある spTrackEntry の周りの C++ ラッパーが、無効なアクセスをガードします。
C++

UTrackEntry* entry = ...
entry->SetEventThreshold(2);
float trackEnd = entry->GetTrackEnd();
Blueprint

trackentry.png

AnimationStateイベントの処理

アニメーションが基礎となる AnimationState によって再生されている間、様々なイベントが発行され、リスナーに通知されます。
  1. アニメがスタートしました。
  2. トラックをクリアしたり、新しいアニメーションを設定したりして、アニメーションが中断されました。
  3. アニメーションが完成しましたが、ループさせると複数回発生する可能性があります。
  4. アニメが終了しました。
  5. アニメーションとそれに対応する TrackEntry が処分されました。
  6. ユーザー定義のイベントが発生した。

スケルトン・アニメーション・コンポーネントは、すべてのトラック上のすべてのキューに入ったアニメーションに対して、これらのイベントに反応するために、C++ コードやブループリントがバインドできるデリゲートを提供します。リスナーは、特定の TrackEntry の対応するデリゲートにのみバインドすることもできます。

C++

AnimationState イベントに反応するクラスでは、クラスのヘッダーファイルにリッスンしたいイベントの UFUNCTION 宣言を追加します。

UFUNCTION()
void AnimationComplete(UTrackEntry* entry);
UFUNCTION()
void UserDefinedEvent(UTrackEntry* entry, FSpineEvent evt);

対応する .cpp の実装ファイルに定義を追加します。

void MyClass::AnimationComplete(UTrackEntry* entry) {
... react to complete event here ... }
void MyClass::UserDefinedEvent(UTrackEntry* entry, FSpineEvent evt) {
... react to user defined event here ... }

最後に、 USkeletonAnimationComponent または UTrackEntry の対応するデリゲートにバインドします。

USpineAnimationComponent* animationComponent = ...
animationComponent->AnimationComplete.AddDynamic(this, &MyClass::AnimationComplete);

UTrackEntry* entry = ...
animationComponet->AnimationEvent.AddDynamic(this, &MyClass::UserDefinedEvent);

Blueprint

スケルトンアニメーションコンポーネントの AnimationState イベントにバインドする。
listenercomponent.png
  1. blueprint を開く
  2. アクターのスケルトンアニメーションコンポーネントを選択します。
  3. 詳細ビューで、反応させたいイベントの横にある+ボタンをクリックします。

特定の TrackEntry のデリゲートにバインドする。

listenertrackentry.png
  1. Set Animation , Add Animation, Set Empty Animation あるいは Add Empty Animation ノードの戻り値ピンをブループリント内の空のスペースにドラッグします。
  2. ポップアップの Components -> Spine -> TrackEntry カテゴリから Assign Animation XXX を選択します。
  3. ノードへのバインド イベントが実行されるように配線されていることを確認してください。
ビューポートプレビュー

スケルトンアニメーションコンポーネントの Preview Animation と Preview Skin プロパティを使用して、UE4エディタのビューポートでアニメーションとスキンをプレビューすることができます。アニメーションとスキンの名前を入力するだけです。
preview.gif

アニメーションやスキンをリセットし、それぞれのプロパティを空のテキストに設定します。

↑

スケルトンレンダラーコンポーネント †

スケルトン レンダラー コンポーネントは、同じアクタ上のスケルトンまたはスケルトン アニメーション コンポーネントの現在の状態を描画する役割を果たします。レンダリングはプロシージャル メッシュを介して実行されます。このコンポーネントは、スケルトン（アニメーション）コンポーネントによって参照されるテクスチャ アトラス アセットを使用して、スケルトンのアタッチメントを描画するために必要なテクスチャを見つけます。

マテリアル

materials.png

スケルトン レンダラー コンポーネントには 4 つのマテリアル プロパティがあり、Spine でサポートされているブレンド モードごとに 1 つずつ用意されています。デフォルトでは、これら4つのマテリアルは、Spine-ue4プラグインの一部である非点灯のマテリアルに設定されています（プラグインのコンテンツフォルダを参照してください）。

すべてのスケルトン レンダラー コンポーネントで使用されるマテリアルを変更するには、プラグインのデフォルトのマテリアルを変更します。

特定のスケルトン レンダラー コンポーネントが使用するマテリアルを変更するには、新しいマテリアルを作成し、スケルトン レンダラー コンポーネントのマテリアル プロパティに割り当てるだけです。

いずれの場合も、スケルトン レンダラー コンポーネントがテクスチャ ソースを設定できるように、パラメータ化されたマテリアルを提供する必要があります。デフォルトでは、レンダラーコンポーネントはテクスチャパラメータが &color(foreground[,background]){text}; と呼ばれていると想定しています。スケルトン レンダラー コンポーネントでパラメータ名をカスタマイズすることができます。

奥行きのオフセット
depthoffset.png

アタッチメントはスケルトン レンダラー コンポーネントによって xz 平面内で前後にレンダリングされます。各アタッチメントは、Z-fighting を避けるために、カスタマイズ可能な深度オフセット値で y 軸にオフセットされます。深さオフセットは、C++ とブループリントの両方で自由にカスタマイズできます。

↑

スケルトンフォロワーコンポーネント †

このコンポーネントはスケルトン（アニメーション）コンポーネントのボーンを参照し、 Tick ごとにボーンのトランスフォームを設定します。

これを使用して、パーティクルシステムのようなオブジェクトを骨格上の特定の骨に追従させることができます。

↑

スケルトンドライバーコンポーネント †

このコンポーネントは、スケルトン（アニメーション）コンポーネントのボーンを参照し、 Tick ごとにボーンの位置を自分の位置に設定します。このコンポーネントは、スケルトン（アニメーション）コンポーネントがワールドトランスフォームを更新する前にボーンの位置を設定します。

骨格の骨をドラッグして移動させるなどのユースケースに使用します。

↑

Spineウィジェット for UMG UI †

Spine 3.8 以降、Spine-ue4 ランタイムは、Spine スケルトンを UMG UI に統合するための Spine ウィジェットを提供しています。このウィジェットは、スケルトン・アニメーション・コンポーネントと同じインターフェースを持ち、ブループリントとC++コードの両方に対応しています。ウィジェットはまた、スケルトンレンダラーコンポーネントといくつかのインターフェイスを共有しています。詳細は、これら2つのコンポーネントのセクションを参照してください。

UMG UI に Spine スケルトンを追加するには、新しいウィジェットのブループリントを作成することから始めます。ブループリントを開き、パレットを使って Spine ウィジェットを追加します。

ui-palette.png

次に、Spine ウィジェットにアトラスとスケルトンデータアセットを設定し、デザイナービューポートで要件に合わせてサイズを変更します。

spine-widget.png

スケルトンはアスペクト比を維持したまま、自動的にサイズを変更し、ウィジェット内のスペースを可能な限り埋めます。Scaleプロパティを使って、さらに拡大縮小することができます。 ウィジェットエディタウィンドウでデザインからグラフ編集モードに切り替えた後、ウィジェットの設計図を変更することができます。ここに設計図の例を示します。

spine-widget-blueprint.png

Construct イベントが発生したときのラプターウィジェットの初期アニメーションを設定します。また、ウィジェットのTick関数を使って Tick イベントをアニメーションさせる必要があります。

widget-level-blueprint.png

blueprint では、まず、クラス名で指定されたウィジェットを作成し、ビューポートに追加します。

↑

コメント †

コメントはありません。 ドキュメント/spine-ue4/コメント

お名前: