Web Analytics

こつこつエンジニア

現役アプリ開発者によるIT系特化ブログ

Unityでユニティちゃんをテレビのワイプみたいにサブカメラを使って別窓でメインカメラと同時に映し出してみよう!

f:id:madai21:20210720210353j:plain

はじめに

今回はUnityでメインカメラとは別にサブカメラを用意して同時に画面表示してみたいと思います。

環境

この記事で作成したUnity Editor 2020.3.12f1 (64-bit)のプロジェクトがあることを前提に進めます。

madai21.hatenablog.com

手順

  1. SampleSceneに床とユニティちゃんを配置する
  2. サブカメラを作成し画面に別窓で表示させる

1. SampleSceneに床とユニティちゃんを配置する

Unity Editorでプロジェクトを起動します。

まずは床を配置しましょう。

右上のHierarchy画面で右クリックして3D Object→Planeを選択します。

f:id:madai21:20210720224128p:plain

Hierarchy画面にPlaneが追加されていると思います。

Planeを選択して右のInspector画面TransformのScaleのXとZを共に10に設定しておきます。

f:id:madai21:20210720224333p:plain

次にユニティちゃんを配置しましょう。

下のProject画面でAssets > unity-chan! > Unity-chan! Model > Prefabsからunitychanを選択してHierarchy画面にドラッグ&ドロップします。

f:id:madai21:20210720224540p:plain

これで床とユニティちゃんを配置しました。

f:id:madai21:20210720224803p:plain

このままだとユニティちゃんの後ろ姿しか見えないので、メインカメラを移動させてユニティちゃんを正面から移すようにしましょう。

Hierarchy画面でMain Cameraを選択して右のInspector画面でTransformのPositionのZ5RotationのY180に設定しておきます。

f:id:madai21:20210720224918p:plain

ここで一度実行してみましょう。

うーん・・・、笑顔にさせてみましたが、遠くてよく見えないですね^^;

メインカメラを移動させてもいいんですが、ここはテレビのワイプのようにユニティちゃんの顔をアップするサブカメラを作って右下に表示させてみましょう。

こんなイメージです。

f:id:madai21:20210720230057p:plain

2. サブカメラを作成し画面に別窓で表示させる

サブカメラを作成しましょう。

右上のHierarchy画面で右クリックしてCameraを選択します。

f:id:madai21:20210720230229p:plain

作成したCameraの名前をCam1に変更します。

名前はHierarchy画面上のCameraを一回クリックしたら編集できます。

右のInspector画面でTransformのPositionのY1.3Z0.4RotationのY180に設定しておきます。

次にCameraのViewportRectのX0.75Y0.05W0.2H0.35に設定します。

f:id:madai21:20210720230313p:plain

実行してみましょう。

ばっちりですね^^

これでユニティちゃんの表情がよくわかりますね。

おわりに

CameraのViewportRectを変えることで2つだけでなく4でも16でも同時に画面に表示させることができます。

こんな分割画面も可能です。

f:id:madai21:20210720234552p:plain

 

ユニティちゃんライセンス

この作品はユニティちゃんライセンス条項の元に提供されています