ブループリントにおける Flipbook コンポーネント

ブループリントの Flipbook コンポーネントの操作ガイド。

Choose your operating system:

Windows

macOS

Linux

ブループリント での Flipbook コンポーネント を使った作業は、ブループリントの他の コンポーネント を使った場合と非常に似ています。ブループリントに Flipbook コンポーネントを追加すると、使用する Source Flipbook アセットの指定、フリップブックの Play Rate の定義、 Transforming などのすべてのコンポーネントで利用できる標準オプションに加えて、使用する スプライト カラー の調整ができるようになります。

Graph タブにおいて、Flipbook コンポーネントのプロパティをスクリプトによって直接使って編集することができます。編集には、再生レート、再生、停止、逆再生の調整、およびソース フリップブックを異なるフリップブック アセットへの変更 (キャラクターのフリップブック アニメーションの切り替えなどに便利です) までもが含まれます。

本ページでは、ブループリントにおける Flipbook コンポーネントの追加、利用、変更の方法について説明します。フリップブック自体に関する詳細は、 Paper 2D フリップブック ドキュメントを参照してください。

Flipbook コンポーネントの追加

ブループリントの [Components] ウィンドウから Flipbook コンポーネントを追加することができます。

  1. ブループリントで、 [Components] ウィンドウから [Add Component] ボタンを クリック して、 Paper Flipbook を検索して追加します。

    Components1.png

  2. Flipbook コンポーネントを追加すると、そのコンポーネントの名前の入力を求められます。

    Components2.png

    [Details] パネルの Flipbook コンポーネントの Properties の調整ができるようになります。

Blueprint/Add Script オプションを使っても、 Flipbook コンポーネントをブループリントに追加することができます。

  1. Flipbook をレベル内に配置して選択し、 [Details] パネルへ行きます。

  2. [Blueprint/Add Script] ボタンをクリックしじます。

    Components3.png

    これにより、ブループリントが新規作成され (名前入力を求められます)、そのコンポーネントとして選択されたフリップブックが自動的に割り当てられます。

Flipbook Component プロパティ

Flipbook コンポーネントの [Details] パネル内で調整できるプロパティもありますが、最も重要なものは Sprite セクションにあります。ここでは使用する Source Flipbook の定義、使用するフリップブックの初期の Play Rate Sprite Color を定義します。

Details1.png

[None] ドロップダウン ボックスをクリックして、Flipbook を割り当てます。

Details2.png

Flipbook アセットがポップアップ ウィンドウで選択したり、一番上のにあるオプションから Flipbook アセットを新規作成することもできます。

Details3.png

Play Rate ボックスの最初の再生レートに数値を入力します。

Details4.png

最後に、 Sprite Color オプションと一緒に使うスプライトのカラーを設定します。

Details5.png

Collision プロパティ

コリジョンはフリップブックに直接適用できますが (詳細は フリップブック エディタのリファレンス を参照)、パフォーマンスを下げないためにもコリジョン形状の使用を推奨します。例えば、Flipbook と一緒に Box Capsule Sphere コンポーネントを使えば、必要とする関連コリジョンを表すことができます。

また、ブループリントで、 [Add Component] ボタンをクリックして、 Collision を検索します。

Collision1.png

フリップブック上で指定するのではなく、フリップブック用のコリジョンとして使用するために、異なる形状を適用することができます。

以下はそのようなケースの例です。

Collision2.png

上の例では、点滅するシンプルなボックスのブループリントを作成し、 Box Extent 変数を変更してボックスをカプセル化し、実際のコリジョンを与えるために Collision Presets Block All に変更して、ボックスにコリジョンを与えるために Box Collision を追加しました。

Flipbook コンポーネントの使用方法

Flipbook コンポーネントを使い始める準備ができたら、 [Graph] タブを開き、ブループリントに追加された他のコンポーネントと一緒に、 [MyBlueprint] ウィンドウの [Components] セクションにあるリストにあることを確認します。

MyBlueprint1.png

Flipbook コンポーネントを利用もしくは影響させるには、 Ctrl を押して Flipbook コンポーネントをグラフに ドラッグ&ドロップ する必要があります。

Graph1.png

それを引き出した地点で Flipbook コンポーネントを Get し、イベントまたは関数を呼び出します。

Graph2.png

Flipbook のコンテキスト メニューを検索すると、Flipbooks のみが受け取ることのできるアクションがあることが分かります。

Graph3.png

ここで、Flipbook が現在 Playing なのか、現在の Play Rate を取得中か、Play Rate、 Starting、 Stopping、 Reversing を新規に設定しているかなどを決定するアクションを実行することができます。現在の Source Flipbook アセットを取得するだけでなく、使用する新規の Source Flipbook アセットを設定し、アニメーションの切り替えを行うようにすることもできます。

スプライト カラーを変更するオプションの入っている Sprite を検索しても、これを利用することができます。

Graph4.png

フリップブックの切り替え

以下は SetFlipbook ノードの使用して、再生中のフリップブックの動きを更新する例です。

Flipbook コンポーネントの Mobility プロパティが Moveable に設定されて、アクタの構築中に呼び出された場合のみ機能します。

この例では、プレイヤー キャラクターが移動を行うと、 Update Animation というカスタム イベントが呼び出されます。

Animation1.png

Update Animation Sprite (この場合プレイヤー キャラクター) を呼び出した SetFlipbook を Flipbook コンポーネントに使用して、キャラクターの Velocity が 0 より大きいか、つまり動いているかどうかに基づいて、 Idle Animation か Running Animation のいずれかを Select します。動いていれば Running Flipbook 、そうでなければ Idle Flipbook を Source Flipbook として設定します。

Animation2.png

その結果、以下のように Flipbooks アニメーション間で切り替わります。

New Project プロジェクト ブラウザ にある 2D Side Scroller プロジェクト テンプレートでもこの例を見ることができます。

Play Rate の設定

Set Play Rate ノードを使った、Flipbook コンポーネントの再生速度を調節する例を説明します。

Sprint.png

この例では、Character ブループリントの Left Shift Key Event を利用して、シフトの押下状況に応じて Max Walk Speed 値 ( Character Movement の速度) が更新されるようにしています。さらに Sprite Flipbook コンポーネント (プレイ可能なキャラクターのこと) の Play Rate を、シフトが押されると倍速、シフトを放すとノーマル速度に戻るように設定しています。

結果、シフトを押せばキャラクターの移動は (Flipbook の速度に合わせて) 速くなります。

Unreal Engine のドキュメントを改善するために協力をお願いします!どのような改善を望んでいるかご意見をお聞かせください。
調査に参加する
閉じる