画像シーケンスの再生

Image Media Source セットを使用して画像シーケンスを再生する方法の例。

コンテンツ

Image Media Source (イメージ メディア ソース) アセットでは、Unreal Engine 5 (UE5) の中で画像シーケンスを Media Framework ツールの一部としてプレイすることができます。 ビデオへリンクするのではなくパスを「Image Sequence」ファイルに指定して再生できるという点で、イメージ メディア ソース アセットは ファイル メディア ソース と似ています。 命名規則は重要ですので、連番を使用することをお勧めします。たとえば、「Image_01」、「Image_02」、「Image_03」とすれば、必ず正しく順番に再生されます。

この操作ガイドでは、イメージ メディア ソースを使ってレベル内のスタティック メッシュ上で画像シーケンスを再生します。

ImageMediaHero_1.png

現在 Electra Media Player は画像シーケンスの再生をサポートしていません。

手順

スターター コンテンツ この操作ガイドでは、スターターコンテンツを有効にした状態 の 「ブループリントのサードパーソン テンプレート」 プロジェクトを使用しています。 画像シーケンスも必要です。ない場合は、このガイドで使用するサンプル画像シーケンス を右クリックしてダウンロードできます。

  1. [コンテンツ ブラウザ] の [Sources (ソース)] パネル を展開し、[Content (コンテンツ)] に「「Movies」という名前のフォルダを作成します。

    New Folder Movies

  2. 「Movies」フォルダを右クリックして、[Show in Explorer (エクスプローラーで表示)] を選択します。

    Show in Explorer

    必須ではありませんが、プロジェクトで正しくメディアをパッケージ化およびデプロイするために、「Content/Movies」フォルダに保存することを推奨します。

  3. 画像シーケンスの画像を「Content/Movies」フォルダに配置します。

    Images inside Movies Folder

    上の画像のとおり、「UE5_Images」という名前の新しいフォルダを「Content/Movies」内に作成し、その中に JPG 画像を配置しました。 さらに、シーケンス画像の低解像度版が入っている「lowres」という名前のフォルダも作成しました。 Media Framework ツールを使えば、メディア ソース プロキシを使って開発中に (通常は) 低解像度の画像で作業することができます。 作業する画像のシーケンスやファイル サイズが大きな場合は、低解像度の画像で作業した方が効率的であり、かつパフォーマンス問題の発生も最小限に抑えることができます。

  4. エディタ に戻って、Unreal Engine 5 のプロジェクト内の [Auto-Import (自動インポート)] ダイアログ ウィンドウにある [Don't Import (インポートしない)] ボタンをクリックします。

    Click Don't Import Button

    プロジェクト ディレクトリのどこに置かれているのか参照可能なので、プロジェクトに画像をインポートする必要はありません。

  5. 「Content/Movies」フォルダを右クリックして [Media (メディア)] から [Img Media Source (画像メディア ソース)] を選択して「MyImageSequence」と名前を付けます。

    Img Media Source

  6. 新しい MyImageSequence アセット中の [Sequence Path (シーケンス パス)] ボタンの横にある [...] ボタンをクリックして、画像シーケンスの中の最初の画像に指定します。

    Sequence Path Button

  7. [Advanced Options (詳細オプション)] をクリックして [Sequence (シーケンス)] オプションを展開し、[Proxy Override (プロキシ オーバーライド)] に「lowres」と入力します。

    Proxy Override

    ここでは、開発で使用する低解像版の画像が入っている「lowres」フォルダを指定しています。 低解像度の画像ファイルを使うと必要なメモリ量が減るため、フル解像度のファイルを使う場合よりも最適化された体験を提供することができます。

    「Proxy Override」パスをオリジナルのフル解像度画像と同じディレクトリ構造で、同じ名前のフォルダに指定して、見つけられるようにしておきます。

  8. 「Content/Movies」フォルダを右クリックして [Media] から [Media Player (メディア プレーヤー)] を選択します。

    Media Player

    メディア プレーヤー アセットを使用して、さきほど作成した画像シーケンスを再生します。

  9. [Create Media Player (メディア プレーヤーを作成)] ウィンドウで [Video output Media Texture asset (ビデオ出力メディア テクスチャ アセット)] オプションを有効にして [OK] ボタンをクリックします。

    Video Output Media Texture Asset

    これにより、画像シーケンスに使用するメディア プレーヤーに関連する メディア テクスチャ アセットが自動的に作成され、割り当てられます。

  10. (自動的に「Media Texture」という名前になっている) メディア プレーヤー アセット名を「MyPlayer」に変更し、ダブルクリックして開きます。

    My Player Asset

  11. メディア エディタ の [Details] パネルで、[Loop (ループ)] オプションを有効にします。

    Enable Loop Option

    このオプションを有効にすると、メディア プレーヤーが画像シーケンスの再生をループし続けます。

  12. MyImageSequence アセットをダブルクリックして、画像シーケンスの再生を開始します。

    Start Playing the Image Sequence

    画像シーケンスはメディア エディタで再生を開始します。[Info] タブをクリックすると、再生中の画像シーケンスの情報が表示されます。 この例では、低解像度 の画像を使っているので、画像シーケンスの Dimension (寸法) は 640 x 360 と表示されています。

  13. コンテンツ ブラウザ で MyImageSequence アセットを開き、[Proxy Override] セクションをクリアします。

    Clear Out the Proxy Override Section

    これでフル解像度の画像への切り替えが可能になります。メディア プレーヤー アセットを開いて画像シーケンスを再度再生すると [Dimension] 値が異なります。

    Full Resolution Images

    [プレーヤー] ウィンドウの下部にある [Image Cache (画像キャッシュ)] 進捗バーはメモリへキャッシュされたコンテンツ量を表します (緑はすべてロード済み、黄色はロード中、グレーはロードをスケジュール中)。 使用しているシステム ハードウェアによって、キャッシュの量と表示カラーは異なることがあります。詳細は「Media Framework の概要」の「画像メディア」セクションを参照してください。

  14. メイン エディタの [Place Actors (アクタを配置)] パネルの [Shapes (形状)] タブから、[Plane (平面)] をレベルにドラッグし、自由にサイズ変更および配置します。

    Plane Actor

    トランスフォーム ツール を使用して、平面を自由に移動、回転、スケーリングすることができます。

  15. コンテンツ ブラウザ から、MyPlayer_Video メディア テクスチャ アセットをレベルの中の 平面 の上にドラッグします。

    Add My Player Video Media Texture Asset

    これにより、メディア テクスチャを使用して マテリアル がレベルの平面に自動的に作成および適用され、画像シーケンスが再度再生されます。

  16. メイン ツールバーで [Blueprints (ブループリント)] ボタンをクリックし [Open Level Blueprint (レベル ブループリントを開く)] を選択します。

    Open Level Blueprint

    テストを開始する前に、ブループリント を使って、メディア プレーヤーにゲームプレイの開始時にイメージ メディア ソース アセットを開いて再生が開始されるように指示します。

  17. [MyBlueprint] パネルで Media Player Reference というタイプの MediaPlayer という変数を作成し、メディア プレーヤー として MyPlayer に割り当てます。

    Variable Media Player

    [Default Value (デフォルト値)] を メディア プレーヤー に割り当てるためには、変数を作成した後に [Compile (コンパイル)] をクリックする必要があります。

  18. Ctrl キーを押しながら MediaPlayer 変数をグラフへドラッグし、右クリックして Event Begin Play ノードを追加します。

    Drag the Media Player

  19. MediaPlayer 変数を引き出して Open Source ノードを使って Media Source (メディア ソース) を MyImageSequence に設定し、以下のように接続します。

    Set Media Source

  20. コンパイル して 保存 し、メイン エディタから [Play (再生)] ボタンをクリックしてエディタ内で再生します。

最終結果

エディタで再生後、画像シーケンスはレベル内のスタティック メッシュ上で再生を開始し、その後ループします。

この例では JPG ファイルを使用しましたが、イメージ メディア ソースで サポートされている種類のファイル であればどれでも使用することができます。

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