【Unity9】GUIを改善して、Network Managerを見やすくする！【UNET20】

Unity5.1.1p3 Personal(2015年7月)

前回の続きです〜

今のままだとGUIがデフォルトのものなのでちょっとかっこ悪いですし、必要ない機能もたくさん表示されていて分かりにくいです〜

ですので、必要な機能のみが表示されるように改善していきます〜

UNET Part 20 - UI & Custom Net Manager - YouTube

【目標】GUIを改善して、Network Managerを見やすくする！

①スクリプト作成

まずはNetworkManager_Customという名前のスクリプトを作成し、MenuシーンにあるNetworkManagerオブジェクトに取り付けます〜

using UnityEngine;
using UnityEngine.Networking;
using UnityEngine.UI;
using System.Collections;

//NetworkManagerクラスを継承する(NetworkBehaviourではないので注意)
public class NetworkManager_Custom : NetworkManager {

	
	//ButtonStartHostボタンを押した時に実行
	//IPポートを設定し、ホストとして接続
	public void StartupHost()
	{
		SetPort();
		NetworkManager.singleton.StartHost();
	}
	
	//ButtonJoinGameボタンを押した時に実行
	//IPアドレスとポートを設定し、クライアントとして接続
	public void JoinGame()
	{
		SetIPAddress();
		SetPort();
		NetworkManager.singleton.StartClient();
	}
	
	void SetIPAddress()
	{
		//Input Fieldに記入されたIPアドレスを取得し、接続する
		string ipAddress = GameObject.Find("InputFieldIPAddress").transform.FindChild("Text").GetComponent<Text>().text;
		NetworkManager.singleton.networkAddress = ipAddress;
	}
	
	//ポートの設定
	void SetPort ()
	{
		NetworkManager.singleton.networkPort = 7777;
	}
}

NetworkManager_Custom.cs

これから作っていくButtonStartHostボタンとButtonJoinGameボタンを押した時に実行されます〜
先に進みます〜

②NetworkManagerコンポーネントの設定

続いてNetworkManagerコンポーネントをRemove Componentにて取り除きます〜

取り除くと言っても、先ほど作成したスクリプトでNetwork Managerを継承しているので実際にはNetworkManagerは生きています〜

NetworkManagerはちゃんと継承されている

続いてNetworkManagerの設定を行います〜
Offline SceneにMenu、Online SceneにMain、Player PrefabにPlayer、Player Spawn MethodにRound Robin、Registered Spawnable PrefabsにZombie、Advanced Configurationにチェックを入れ、Channel #0にUnreliable、Channel #1にReliable Sequenced、Ping Timeoutを900に変更します〜

③MenuシーンのGUI作成

続いてGUIを作成していきます〜HierarchyビューからCreate > UI > Panelを選択します〜

続いてCanvasのCanvas Scalerの設定をします〜
UI Scale ModeをScale With Screen Sizeに、Xを1920、Yを1080に、Matchを0.5に変更します〜

Canvas Scaler設定

Canvas Scalerについては以下の記事でも解説しています〜

hiyotama.hatenablog.com

続いてPanelのRect Transformを変更していきます〜
Anchor Presetsをcenter middleに変更し、Widthを600、Heightを500に変更します〜

こんな感じ

続いてPanelに、子オブジェクトを自動的にレイアウトしてくれるGrid Layout Groupコンポーネントを付けます〜
Add ComponentからLayout > Grid Layout Groupを選択し、以下のように設定して下さい〜

続いてPanelの子オブジェクトとしてButtonを2つ、Input Fieldを1つ作成します〜
1つ目のButtonの名前は「ButtonStartHost」、2つ目のButtonの名前は「ButtonJoinGame」、Input Fieldは「InputFieldIPAddress」に変更します〜

次にButtonの子オブジェクトであるTextのInspectorビューのBest Fitと、Input Fieldの子オブジェクトであるPlaceholderとTextのInspectorビューのBest Fitをチェックして下さい〜

ButtonStartHostのTextに「Start Host」、ButtonJoinGameのTextに「Join Game」、InputFieldIPAddressのTextに「localhost」と入力します〜

④MainシーンのGUI作成

続いてMainシーンのGUIを作成していきます〜
まずはCanvas Scalerですが、Menuシーンと全く同じです〜

Latency TextはRect TransformのHeightを50に変更します〜
Health TextもHeightを50に変更します〜
Respawn ButtonはWidthを300、Heightを60に変更し、TextをBest Fitに変えます〜

続いてPanelを新規作成し、Anchor Presetsをtop right、Widthを500、Heightを150、PivotをX,Y共に1に変更します〜

続いてPanelの子オブジェクトにButtonを作成し、名前を「ButtonDisconnect」にします〜
Anchor Presetsはmiddle center、Widthは300、Heightは60、Textは「Disconnect」とし、Best Fitにチェックを入れます〜

こんな感じ

ちょっと長くなってきたので、今回はここまでです〜

ありがとうございました〜

【Unity9】UNETでマルチプレイヤーなオンラインゲーム開発【UNET1】
【Unity9】UNETでプレイヤーの動きを補間し、なめらかな動きを実現する【UNET1-2】
【Unity9】UNETでネットワーク越しに傾き(Rotation)を同期させる【UNET2】
【Unity9】UNETでオンライン開始時のプレイヤー生成位置を変更する【UNET2-2】
【Unity9】UNETのネットワークトラフィックを軽減し、効率化する【UNET3】
【Unity9】UNETのlatency(遅延時間)を改善する【UNET4】
【Unity9】UNETのlatency(遅延時間)を表示して、ちょっとだけ改善する【UNET4-2】
【Unity9】UNETのSyncVarのhookの使用例と、前時代の同期方法【UNET5】
【Unity9】UNETを使ってRotationを同期させる【UNET6】
【Unity9】UNETで各プレイヤーにPlayerIDを設定する【UNET7】
【Unity9】UNETで敵プレイヤーにダメージを与える！【UNET8】
【Unity9】UNETでHPを画面に表示し、Playerへダメージを与える【UNET9】
【Unity9】UNETでHPが0以下になった時、Playerを破壊する！【UNET10】
【Unity9】UNETで死んだPlayerを生き返らせる！【UNET11】
【Unity9】UNETでゾンビAIを出現させる！【UNET12】
【Unity9】UNETでゾンビ生成時にユニークなIDを付ける！【UNET13】
【Unity9】UNETでゾンビを撃つ！【UNET14】
【Unity9】UNETでゾンビに攻撃させる！【UNET15】
【Unity9】UNETでゾンビの動きをスムーズにシンクロさせる！【UNET16】
【Unity9】UNETでゾンビ発生地点を増やす【UNET17】
【Unity9】UNETで発生したバグを取り除く【UNET18】
【Unity9】Unity MultiPlayerを使ってネットワーク越しにマッチメイキング！【UNET19】
【Unity9】GUIを改善して、Network Managerを見やすくする！【UNET20】
【Unity9】表示したGUI(Network Manager)を機能させる！【UNET20-2】
【Unity9】UNETでAnimationを同期させる！【UNET21】