【UE4】レプリケーションを使用して動的コンテンツを共有するメタバース写真館にしよう

Pocket
LinkedIn にシェア
LINEで送る

先日、過去に作ったメタバース写真展ギャラリーをUE4からUE5にアップグレードしたときのこと。このプロジェクトはパッケージ後でも外部定義のCSVファイルを参照するのでCSVファイルに記述するURLを書き換えれば展示内容を変更可能なんです。
ところが複数人で入ってみると各々のVR空間に表示される写真がバラバラだったわけです。原因はお察しの通りで、各自のCSVファイルに書かれたURLがバラバラだったからで、でもメタバースをやってるんだったらもちろん全員が同じ写真を見たいわけで。
ということで、今回は「最初に参加した人を親とみなして、参加者は全員親と同じ写真が展示される」対応をしてみましょう。

動画版

●タイムライン Timeline
0:00 開始
0:01 はじめに
1:25 基本的なダイナミックマテリアルインスタンスの作成
4:28 レプリケートの設定方法
7:04 ダイナミックマテリアルインスタンスの作成をクライアントに通知するレプリケートの設定
9:29 ダイナミックテクスチャを通知対象にする場合
11:52 動作確認
12:41 本番環境に適用して3人で参加してみる
13:43 おわりに

使い方

重要となるのがReplicate(レプリケート)です。

手順は後で細かく紹介しますが、ざっくりいうとブループリントクラスにReplicateのチェックを入れて、親と子でやりたい処理をそれぞれ書く。
特に今回は親子で同じ表現をしたいわけなので、同じノードを接続すれば良い。ってことになります
今の映像だと失敗してますけど、今回の写真展でやっている処理は、CSVファイルには1行に1つのURLが記述されている約束なので、URL指定で画像をDownloadして、ダイナミックマテリアルインスタンスを作り、ダウンロードした画像のダイナミックテクスチャをマテリルにセットするという流れです。
じゃあやってみます。レプリケートテスト用のMapを作りまして
基本的なアセットを置きます
ボールのテクスチャを変更する、って実装から入りましょう
ブループリントクラスを作ります
BPアクターをワールドに置いて
ブループリントを編集します
ComponentにStaticMeshを追加して
スタティックメッシュにメッシュを設定します
写真展では、フォトフレームのメッシュをセットすることになります
ダイナミックマテリアルインスタンスの元ネタとなるマテリアルを用意します
用意したマテリアルをセットしときましょうか
マテリアルを編集します
パラメータ化したVector4を用意して、「Color」としておきましょう
Parameter Nameは重要なので覚えておきます
ちょっと動画で録り忘れたんですが、複数人数参加をデバッグするときは
「プレイヤー数」を2以上にしてください
Play Windowは「新規エディタウインドウ」あたりがやりやすい気がします
さてここからReplicateの設定をしてみます
[Replicates]をチェックONにします
そのまえに普通の写真差し替え処理を作りますか
そのまえに普通の写真差し替え処理を作りますか
SetTextureParameterValueの[Parameter Name]で
さっき指定したマテリアルのパラメータ名である「Color」が登場します
まずは緑に変わるようにしてみますか
Playすると、3人全員が緑色に変わります。そりゃそうですね
それでは本番です。テクスチャのReplicateを実装しましょう
ColorのReplicateのブループリントを複製して、Texture版としました
マテリアルの方も複製しまして、
Parameter NameはTexture1としました
基本的なダイナミックマテリアルインスタンスの設定をしてPlayしてみます
うまくいってますね
ごめんなさい映像が数分壊れてしまったので少し飛びました
ブループリントクラスの[Replication]グループに[Replicates]があるのでONにします
いきなり登場した[Switch Has Authority]というブループリントですが、この子が重要
いきなり登場した[Switch Has Authority]というブループリントですが、この子が重要
ちょっと整理しましょうか
BPのOutがAuthorityは、親(最初に参加した人)だけが処理対象になります
やろうとしていることは、
親がダウンロードした画像のテクスチャをTex2dDyn変数にセットしたら

Tex2dDyn変数を子(他の参加者)にも共有してあげよう
っていう考慮です
まずは親の処理だけ作ってあげます
ここからが重要です
Tex2DDyn変数の[Replication]設定をNoneから「RepNotify」にします
すると自動でOnRepTex2DDynという関数が生成されます
この関数にテクスチャを差し替える処理を書きましょう
よく見るとTex2DDyn変数の右上にポコポコマークがついてますが、
Replication変数である印です
Playしてみます。Switch Has AuthorityのoutはAuthorityだけなので、
テクスチャ変更が親だけであることが確認できます
次に、outが[Remote]の方も[Download Image]に接続してあげます
すると、子の参加者の画面でもテクスチャの変更が発生しました
メタバース写真展ギャラリープロジェクトにも実装してみました
親が画像をダウンロードして、レプリケートするってことをしているので、
かなりタイムラグが出ています
もっと効率改善できるはずです
全員の写真が差し替わりました。うまくいっていますね
いかがでしたか
おそらくこれからものすごいお世話になりそうなので
今後も継続して実験を続けたいと思います
今日はここまで!

Software : Unreal Engine 5.0.1 (使用ソフト:アンリアルエンジン5)

参考サイト

記事の情報はお役に立ちましたか?

ご支援も承っています。
ご注意:返金のご対応はいたしかねます。あくまでも投げ銭としての位置付けであり、優待・特典等はございません。ご了承下さい。

21685:【UE4】レプリケーションを使用して動的コンテンツを共有するメタバース写真館にしよう

v3

管理人が読んだおすすめの建築本

    

コメントを残す