今回の記事ではLobbyシーンを作成します。
記事が長くなってしまったので2ページ構成となっております。
ロビーとルームについては以下の記事を参照してください。
-
Unityオンラインゲーム作成 ロビーとルームについて
今回はPhotonのロビーとルームについて説明します。 なんとなく言葉から想像はつくかもしれませんが、例えばホテルで宿泊するときの手順を思い浮かべてください。 ホテルの入り口から入る ロビーの受付に行 ...
Lobbyシーン
まずはどのようなものを作成するかイメージを掴むために以下の動画をご覧ください。
今まではログイン画面からすぐにゲームルームに遷移していましたが、今回はログイン画面とゲーム画面の間に動画のようなLobbyシーンを作成します。
Lobbyシーンはプレイヤーが自分でルームを作成したり、ルームの一覧からルームを選んでゲームに参加したりできるようにするシーンです。
まずLobbyシーンのHierarchyビューを見てみましょう。
ロビーシーンを構成する主な要素は以下の5つです。
- 部屋作成用パネル(CreateRoomPanel)
- 部屋一覧表示用パネル(RoomInfoPanel)
- 部屋一覧の要素パネルプレハブ(RoomElement)
- 部屋作成用パネルを管理するLobbyUI
- 部屋一覧の情報を取得するLobbyManager
これらそれぞれを1つずつ作成していきましょう。
部屋作成用パネル
プレイヤーが部屋を作成する際に必要な情報を入力するウィンドウを作成します。
今回の部屋作成に必要な情報は部屋名と入室可能人数の2つとします。
以下の画像が部屋作成用パネルのHierarchyビュー上での構成とゲーム上での見え方となります。
とりあえずここで気を付けるべきことはCreateRoomPanelの下に全ての要素があることです。
部屋作成ウィンドウの表示非表示操作を、親オブジェクトであるCreateRoomPanelのActive、InActiveによって実現するためです。
部屋の作成などの処理に関しては、後々作成するLobbyUIというオブジェクトのスクリプト内で行うのでここでは不要です。
つまりUIの外観さえ整えばOKです。
OpenRoomPanelButton(部屋作成用パネル表示用ボタン)
OpenRoomPanelButtonは部屋作成用パネルの表示、非表示を切り替えるためのボタンです。
※ボタンを押した時の処理は、後々作成するLobbyUIのLobbyUIScriptの中で定義しています。
スポンサーリンク
部屋一覧表示用パネルとスクロールビュー
以下のような、ロビーにいる間存在する部屋の一覧を表示するパネルを作成します。
今回はとりあえず縦方向にしかスクロールできないビューにしているのでScroll Viewを作成した時に作られるScrollbar Horizontalは削除しています。
それ以外のオブジェクトの設定は以下の通りです。
Create/UI/Scroll Viewより新規作成した後、設定を変更した項目は赤枠で囲んでいます。
RoomScrollViewのInspector
今回、水平方向のスクロールは行わないのでHorizontal関連の設定は解除しています。
ContentのInspector(RoomScrollViewの孫オブジェクト)
Vertical Layout Groupは縦方向に上手く要素を並べるために適用しています。
Content Size Fitterは要素の大きさをうまく調節するために適用しています。