ウェブテンプレートの構造体とインスタンス化

テンプレートの index.html ファイルでカスタムユーザー変数を使用し、createUnityInstance() を使用してコンテンツの新しいインスタンスを作成します。

テンプレート変数、JavaScript マクロ、および条件付きディレクティブについては、ウェブテンプレート変数を参照してください。

カスタムウェブテンプレートを追加するには、カスタムウェブテンプレートの追加を参照してください。

カスタムのユーザー変数

ウェブテンプレートを選択すると、Unity はテンプレートを解析し、JavaScript のマクロや条件付きディレクティブを探します。

Unity は、以下の場合に JavaScript 変数をカスタムユーザー変数として扱います。

• JavaScript のマクロや条件付きディレクティブの中で使用される場合。
• テンプレートコードで宣言されていない場合。
• 内部プリプロセッサー変数ではない場合。

Unity は、これらのカスタムユーザー変数を、Player Settings ウィンドウ内の Resolution and Presentation セクションに自動的に追加します。

例えば、生成された index.html ページのタイトルを Player 設定 ウィンドウから直接制御したい場合、まず、カスタムテンプレートの index.html の <title> 行を以下のように変更する必要があります。 <title>{{{ PAGE_TITLE }}}</title> 終わったら、カスタムテンプレートを再度選択してください。これでテンプレートが再び解析され、Page Title フィールドが、Player 設定ウィンドウの Resolution and Presentation > Web Template セクションに表示されます。

このフィールドにテキストを入力してプロジェクトをビルドすると、テンプレートマクロで使用されているカスタム変数 PAGE_TITLE が、自動的に Page Title フィールドのテキストになります。

カスタムの整数や float の変数をマクロで使用したい場合は、parseInt() または parseFloat() JavaScript 関数をマクロで使用して、Unity エディターから送信される文字列値を前処理します。これは、カスタムユーザー変数には常に文字列値が割り当てられるからです。

ノート: 変数名のアンダースコア文字は、可読性を高めるためにフィールド内のスペースとして表示されます。

index.html ファイルの構造

index.html には、ビルドをロードするために必要なコードが含まれており、以下を含む必要があります。

• <canvas> 要素。Unity ランタイムは、<canvas> 要素を使用してアプリケーションをレンダリングします。
• ビルドローダーをダウンロードするための JavaScript コード。 例:

var buildUrl = "Build";
var loaderUrl = buildUrl + "/{{{ LOADER_FILENAME }}}";
var script = document.createElement("script");
script.src = loaderUrl;
script.onload = () => {
  // code for instantiating the build
};
document.body.appendChild(script);`

この例では、{{{ LOADER_FILENAME }}} は、ビルドが生成される際にテンプレートのプリプロセッサーによって自動的に解決されます。

あるいは、スクリプトタグなどを使って、ビルドローダーをダウンロードすることもできます。例えば、以下の通り。 lang-js <script src="Build/{{{ LOADER_FILENAME }}}"></script>

• ビルドをインスタンス化するための JavaScript コード。Unity のビルドは、ビルドローダースクリプトで定義される createUnityInstance() 関数を使ってインスタンス化されます。

インスタンス化関数： createUnityInstance()

createUnityInstance() 関数は、コンテンツの新しいインスタンスを作成します。以下のように使うことができます。 createUnityInstance(canvas, config, onProgress).then(onSuccess).catch(onError);

この関数は、Promise オブジェクトを返します。

createUnityInstance() 関数は、ビルドローダースクリプトで定義され、インスタンス化されたビルドに特有です。したがって、同じ HTML ドキュメントに 2 つ以上のビルドを埋め込む場合は、対応するビルドローダースクリプトの onload コールバックから createUnityInstance() 関数が呼び出されることを確認してください。Unity ウェブローダーの詳細については、ウェブ Build フォルダーとウェブテンプレートの構造体とインスタンス化を参照してください。

追加リソース

• ウェブテンプレートの使用
• カスタムウェブテンプレートの追加
• ウェブテンプレート変数
• ウェブテンプレートのビルド設定とインタラクション