ネットコードで共有ARシーンを設定する方法

共有ARはARとネットワーク機能のセットで、マルチプレイヤーAR体験を作ることができる。このハウツーでは、GameObjects用のUnity Netcodeを使用して、ネットワークマルチプレイヤーのセットアップ、リアルワールドトラッキングの有効化、Lightshipネットワークサーバーへの接続を学びます。

SharedAR セットアップビデオ

前提条件

Lightship ARを有効にしたUnityプロジェクトが必要です。
Shared AR プラグインをインストールする必要があります。
ARSessionとXROriginを持つARシーンが必要です。
UnityドキュメントのGet started with NGOからGameobjectsのNetcodeの概念と使い方に慣れる。

シーンにコンポーネントを追加する

共有ARを使用するには、これらのコンポーネントをUnityシーンに追加する必要があります：

Network Manager オブジェクトをシーンのルートに追加します。
1. Hierarchyで、シーンタイトルを選択します。
2. メインメニューから、 GameObject を選択し、 Create Emptyを選択します。
3. オブジェクト名は NetworkManager。
NetworkManager コンポーネントをオブジェクトに追加する。
1. Hierarchyで、 NetworkManagerを選択する。
2. Inspector ウィンドウで、 Add Componentをクリックします。
3. 検索ボックスに「Network Manager」と入力し、選択して追加する。
4. Network Transportの下で、 Select transport... をクリックし、 LightshipNetcodeTransportを選択する。これにより、 Lightship Netcode Transport コンポーネントが自動的に追加されます。
SharedSpaceManager コンポーネントを XROriginに追加する。
1. ヒエラルキーのARシーンで、XR Originを選択します。
2. Inspector ウィンドウで、 Add Componentをクリックします。
3. 検索ボックスに「Shared Space Manager」と入力して選択し、XR Originに追加します。
4. Shared Space ManagerのColocalization Typeを Mock Colocalizationに設定する。 VPS ColocalizationまたはImage Tracking Colocalizationを使用する場合は、対応するColocalization Typeに変更してください。

SharedSpaceManagerでNetcodeセッションを開始する

SharedSpaceManagerを使って、次にシーンとコードをセットアップし、ユーザーが互いに接続してネットワーク・セッションを開始できるようにする。

SharedARのUIとマネージャーを設定する：

Hierarchyで、ARシーンの下で右クリックし、UIメニューを開き、Button - TextMeshProを選択してボタンを追加します。この作業を繰り返し、別のボタンとテキスト・フィールドを追加する。ボタンはホストとクライアントを参加させるためのもので、テキストフィールドは接続ステータスを出力するためのものです。ボタンにJoinAsHostと JoinAsClientと名前を付け、テキストフィールドにLocalizationStatusTextと名前を付けます。
ヒエラルキーでARシーンのルートを右クリックし、Create Emptyを選択します。新しいオブジェクトにNetworkDemo という名前を付けます。
ProjectウィンドウのAssetsフォルダで右クリックし、Createメニューを開いてC# Script を選択します。新しいスクリプトにNetworkDemoManager.cs という名前を付けます。
1. プロジェクトに新しいC#スクリプトを作成し、名前をNetworkDemoManager.csとする。
2. NetworkDemoManager.csを開き、次のコード・スニペットを追加して、UIエレメントとSharedSpaceManagerを初期化します：
```
[SerializeField]
private Text _statusText;

[SerializeField]
private Button _joinAsHostButton;

[SerializeField]
private Button _joinAsClientButton;

[SerializeField]
private SharedSpaceManager _sharedSpaceManager;
```
NetworkDemoManager.csのフィールドをNetworkDemo に接続します：
1. Hierarchy の AR Scene で、NetworkDemoコンポーネントを選択します。
2. Inspector ウィンドウで、 Add Componentをクリックします。
3. 検索ボックスに「Network Demo Manager」と入力し、選択して追加する。
4. テキストフィールド、ボタン、そしてSharedSpaceManagerを含むXR Originを 階層構造から ネットワークデモマネージャーコンポーネントの対応するフィールドにドラッグアンドドロップします。この時点で、NetworkDemoはこのように見えるはずです：

部屋の作成とイベントの処理

次に、スクリプトにコードを追加して、マルチプレイヤールームを作成し、ユーザー接続などの共有ARイベントを処理する。 Network Demo Managerをマルチプレイに対応させる：

NetworkDemoManager.csにコードスニペットを追加し、ルームへの接続準備を整える：
1. ISharedSpaceTrackingOptions.CreateMockTrackingOptions()を呼び出して、部屋のトラッキングオプションを作成します。
2. ISharedSpaceRoomOptions.CreateLightshipRoomOptions() を使用してルーム・オプションを作成し、マルチプレイヤー・ルームをインスタンス化します。
3. SharedSpaceManagerに sharedSpaceManagerStateChangedイベントのハンドラを追加します。次のコード・スニペットをコピーして、この機能をNetworkDemoManager.csに追加してください：
```
protected void Start()
{
     // 参加するルームを設定
     var mockTrackingArgs = ISharedSpaceTrackingOptions.CreateMockTrackingOptions();
     var roomArgs = ISharedSpaceRoomOptions.CreateLightshipRoomOptions(
         "ExampleRoom", // 固定ルーム名を使用
         32, // 最大キャパシティを設定
         "vps colocalization demo (mock mode)"// 説明
     );
     _sharedSpaceManager.StartSharedSpace(mockTrackingArgs, roomArgs);
}.
```

次に、いくつかの重要なイベントについて説明し、Network Demo Managerスクリプトにイベント処理コードを追加します：

トラッキング・ステータスが変更されると、SharedSpaceManager.sharedSpaceManagerStateChangedが呼び出される。このイベントを見て、良いトラッキング状態になるのを待ってから次に進むことで、ユーザーはエクスペリエンス開始前にトラッキングの動作に集中することができ、ビジュアルコンテンツが不適切に動く可能性を減らすことができます。模擬コロカライゼーション・モードでは、このイベントは即座に起動される。
接続が確立されると、NetworkManager.OnClientConnectedCallbackが呼び出されます。ここでは、シングルトン版のNetworkManager.Singleton.OnClientConnectedCallbackにコールバックを設定し、ホストがプレーヤーの着信接続をキャッチするようにしています。 (プレイヤーがクライアントの場合、このイベントはホストが参加したときに発生します)。この例では、新しい接続を通知するテキストも追加している。

ホストとして Netcode セッションを開始するには、NetworkManager.Singleton.StartHost を呼び出します。代わりにクライアントとして起動するには、NetworkManager.Singleton.StartClientを呼び出します。この例では、これらのイベントをそれぞれのボタンに追加し、ユーザーが必要に応じてホストまたはクライアントとして参加できるようにします。

protected void Start()
{
   // UI イベントリスナー
   _joinAsHostButton.onClick.AddListener(OnJoinAsHostClicked);
   _joinAsClientButton.onClick.AddListener(OnJoinAsClientClicked);

   // Netcode connection event callback
   NetworkManager.Singleton.OnClientConnectedCallback += OnClientConnectedCallback;

   // Set SharedSpaceManager and start it
   _sharedSpaceManager.sharedSpaceManagerStateChanged += OnColocalizationTrackingStateChanged;
   // 参加する部屋を設定する
   var mockTrackingArgs = ISharedSpaceTrackingOptions.CreateMockTrackingOptions();
   var roomArgs = ISharedSpaceRoomOptions.CreateLightshipRoomOptions(
         "ExampleRoom", // 固定ルーム名を使用
         32, // 定員を最大に設定
         "vps colocalization demo (mock mode)" // 説明 ); ISharedSpaceRoomOptions.// 説明
      );
   _sharedSpaceManager.StartSharedSpace(mockTrackingArgs, roomArgs);
}

private void OnColocalizationTrackingStateChanged(
   SharedSpaceManager.SharedSpaceManagerStateChangeEventArgs args)
{
   if (args.Tracking)
   {
      _joinAsHostButton.gameObject.SetActive(true);
      _joinAsClientButton.gameObject.SetActive(true);
   }.
}
private void OnJoinAsHostClicked()
{
   NetworkManager.Singleton.StartHost();
   HideButtons();
}

private void OnJoinAsClientClicked()
{
   NetworkManager.Singleton.StartClient();
   HideButtons();
}

private void HideButtons()
{
   _joinAsHostButton.gameObject.SetActive(false);
   _joinAsClientButton.gameObject.SetActive(false);
}

private void OnClientConnectedCallback(ulong clientId)
{
   Debug.Log($"Client connected: {clientId}");
}.

注意

1人のユーザーがホストで、残りがクライアントであることを確認してください。

ファイナル・ネットワーク・デモ・マネージャー・スクリプト

この時点で、NetworkDemoManager.csは次のようになっているはずだ：

クリックすると、完成したNetwork Demo Managerのコードが表示されます。

using Niantic.Lightship.SharedAR.Colocalization;
using Unity.Netcode;
using UnityEngine;
using UnityEngine.UI;

public class NetworkDemoManager : MonoBehaviour
{
    [SerializeField]
    private Text _statusText;

    [SerializeField]
    private Button _joinAsHostButton;

    [SerializeField]
    private Button _joinAsClientButton;

    [SerializeField]
    private SharedSpaceManager _sharedSpaceManager;

    protected void Start()
    {
        // UI event listeners
        _joinAsHostButton.onClick.AddListener(OnJoinAsHostClicked);
        _joinAsClientButton.onClick.AddListener(OnJoinAsClientClicked);

        // Netcode connection event callback
        NetworkManager.Singleton.OnClientConnectedCallback += OnClientConnectedCallback;

        // Set SharedSpaceManager and start it
        _sharedSpaceManager.sharedSpaceManagerStateChanged += OnColocalizationTrackingStateChanged;
        // Set room to join
        var mockTrackingArgs = ISharedSpaceTrackingOptions.CreateMockTrackingOptions();
        var roomArgs = ISharedSpaceRoomOptions.CreateLightshipRoomOptions(
            "ExampleRoom", // use fixed room name
            32, // set capacity to max
            "shared ar demo (mock mode)" // description
        );
        _sharedSpaceManager.StartSharedSpace(mockTrackingArgs, roomArgs);
    }

    private void OnColocalizationTrackingStateChanged(
        SharedSpaceManager.SharedSpaceManagerStateChangeEventArgs args)
    {
        // Show Join UI
        if (args.Tracking)
        {
            _joinAsHostButton.gameObject.SetActive(true);
            _joinAsClientButton.gameObject.SetActive(true);
        }
    }
    private void OnJoinAsHostClicked()
    {
        NetworkManager.Singleton.StartHost();
        HideButtons();
    }

    private void OnJoinAsClientClicked()
    {
        NetworkManager.Singleton.StartClient();
        HideButtons();
    }

    private void HideButtons()
    {
        _joinAsHostButton.gameObject.SetActive(false);
        _joinAsClientButton.gameObject.SetActive(false);
    }

    private void OnClientConnectedCallback(ulong clientId)
    {
        _statusText.text = $"Connected: {clientId}";
    }
}

SharedAR セットアップビデオ

次の手順

Netcodeを使用したVPS Colocalizationを使用してAR Multiplayerを開始する方法については、Netcodeを使用したVPS Colocalizationの使用方法を参照してください。

ネットコードで共有ARシーンを設定する方法

前提条件​

シーンにコンポーネントを追加する​

SharedSpaceManagerでNetcodeセッションを開始する​

部屋の作成とイベントの処理​

ファイナル・ネットワーク・デモ・マネージャー・スクリプト​

次の手順​