yosita/たんすかい 2024/09/23 18:03

【Unity宴】脱出ゲームのズームカメラの設定

脱出ゲームのズームカメラの設定

今回は脱出ゲームでよくあるズームの実装です。


UIにズームカメラの表示をさせたかったのでRenderTextureで対応しています。
動画のズームした後の差分表示(引き出しが開く)はさらに差分イラストを乗せてます。
少々苦戦したので備忘録として残します。手順としては下記です。
環境:Unity2022.3.19f1と宴4


  1. RenderTextureを作成
  2. RenderTexture用のカメラを作成(ズームカメラ)
  3. RenderTextureを表示する為のUIを作成し、RenderTextureをRawImageとして表示
  4. 宴からズームカメラの位置(XY)を指定(SendMessageByName)

①RenderTextureを作成
プロジェクトウィンドウのCreateから作成できます。

②RenderTexture用のカメラZoomCameraを作成(ズームカメラ)


TargetTextureを①で作成したRenderTextureにしました
カメラのオブジェクトは宴で使用しているUICameraをコピーして
作成しています。ズームカメラのSizeで拡大率(どれだけズームするか)などを調整
また、culling maskの設定が重要となり、
今回のZoomCamera用にLayerにレイヤー名Render追加しています。
UICamera→UI,EsapceSYs,Render
ZoomCamera→UI,EsapceSYs
ZoomCameraではRender指定しない culling maskに含めてしまうと
ZoomCameraにZoomCameraが写り意図しない表示となりましたので
注意。

③RenderTextureを表示する為のUIを作成
RenderTextureを表示する為のRawImageの
CaputureUIImage設定


CaputureUIImageの親オブジェクトにCanvasを追加しており
SortingLayerに今回追加したレイヤー名Renderを指定しています。
Canvasを追加しないとInspector→右上のLayer指定だけでは意図した動きをしませんでした。
こちらが嵌まりポイントでした。


④宴からズームカメラの位置(XY)を指定(SendMessageByName)

x位置とY位置を指定しています。

public void SetZoomCameraForUtage(AdvCommandSendMessageByName command)
{
    //Arg3と4の引数を取得
    float posx = command.ParseCellOptional<float>(AdvColumnName.Arg3, 0);
    float posy = command.ParseCellOptional<float>(AdvColumnName.Arg4, 0);
   EscapeZoomCameraObject.transform.position =(posx, posy, -10);
}



アセット

今回はUnity本体と宴とアニメーションはDOTweenを利用しています。

この記事が良かったらチップを贈って支援しましょう!

チップを贈るにはユーザー登録が必要です。チップについてはこちら

月別アーカイブ

記事を検索