UI

UI パネルには、プロジェクト内のすべてのインターフェースが収められています。Interface Type（インターフェースの種類）で、リストを 2 つの種類の間で切り替えます。

Game UI はスロットの中に作成され、各スロットには 1 つのインターフェースが収まります。すべてのスロットが埋まっている場合は、新たに作成せずリストから既存の Game UI を開いてください。

ゲームは Entry page（入口ページ）から始まり、ほかのページはブループリントで開きます。Game UI はゲームの開始後、舞台の上に自動で表示されます。実行時に両者がどう重なるかは、実行時のインターフェース を参照してください。

どのページも入口ページにできます。ページのカードを右クリックして Set as Entry Page（入口ページに設定）を選ぶか、ページを選択して Properties の Set as Entry Page をクリックします。カードには Entry page（入口ページ）と表示され、それまでの入口ページは通常のページになります。どちらのページを指すブループリントや Go Page ノードも、そのまま動作します。

ページと Game UI は、名前の変更、複製、削除ができます。削除すると、その中の要素もすべて取り除かれます。入口ページは削除できません。先にほかのページを入口ページに設定してください。

キャンバス

インターフェースはタブとして開きます。左側に UI Outline、中央にキャンバス、右側に Properties、下側に挿入バーが並びます。

• 挿入バーからウィジェットを選び、キャンバス上でクリックまたはドラッグして配置します。
• ウィジェットはドラッグで移動し、ハンドルでサイズを変更します。Smart Snap は、ウィジェットをキャンバスの端、中心線、近くのウィジェットに合わせて整列させます。
• 整列ツールは、選択範囲のバウンディングボックスを基準に動作します。
• フレームコントロールは、対象デバイスのセーフエリアをキャンバス上に描画し、再生ボタンはそのインターフェースを Dev Mode で開きます。
• ページの端より外側にあるものも、キャンバスの色のベールをかけて描画されます。そのため、ページの外へドラッグした要素も選択してドラッグで戻せます。コンテナに切り取られて見えない選択中の要素は、選択枠をドラッグして動かせます。ゲームではページの範囲内だけが表示されます。

キャンバスは決してクロップしません。ランタイムは常にステージ全体をウィンドウ内に収めるため、セーフエリアの外側にある内容も、一部のデバイスでは表示され続けます。

文字

Text（テキスト）の内容、Button（ボタン）のラベル、Text Input（テキスト入力）のプレースホルダは、それぞれ 1 つの出どころから文字を受け取ります。出どころは Properties で選びます。Direct（直接入力）、Translation key（翻訳キー）、そして Text と Button では Blueprint Value（ブループリント値）も選べます。

• ページ上では、Text と Button はページのテキストのパラメータを表示することもできます。Page param（ページのパラメータ）で選びます。ページのパラメータを参照してください。
• ブループリント値、リストの行の Field（項目）、コンポーネントの Parameter（パラメータ）、Page param を使うと、ウィジェット自身の文字は Sample text（サンプルテキスト）になります。エディタでのみ表示され、ビルドしたゲームには含まれません。
• ゲーム中にブループリントが文字を書き込むウィジェットでは、Properties がウィジェット自身の文字を Default value（既定値）と表示し、Written in the game by（ゲーム中に書き込むブループリント）の下にそのブループリントを一覧します。1 つを選ぶと、そのブループリントが開き、書き込むノードが選択されて画面内に表示されます。

それぞれの出どころがどう翻訳されるかは、インターフェースのテキスト を参照してください。

Auto fit（自動縮小）

Text（テキスト）ウィジェットは、描画されるボックスに収まるまでコンテンツを縮小できます。Typography（タイポグラフィ）でAuto fit（自動縮小）をオンにすると、ウィジェットに設定したサイズが上限になり、テキストがSmallest size（最小サイズ）まで、全体が収まるサイズに縮小されます。Smallest sizeでも収まらないテキストは切り詰められます。

Smallest sizeは、Auto fitがオンの間だけ表示されます。この 2 つのプロパティはキャンバス上と実行中のゲームの両方で有効で、Sentence（センテンス）とNVL Texts（NVL テキスト）ウィジェットにも備わっています。

Sentence（センテンス）ウィジェットは、初期状態でAuto fitがオンになっています。台詞は 1 度だけ書かれ、そのゲームが出荷するすべての言語で表示されるためです。テキストはウィジェットに設定したサイズのまま表示され、ボックスの端に達すると、以降タイプされる残りの文字に応じてサイズが縮小していきます。

Sound（効果音）

インターフェースのルートを除くすべての要素は、Properties の Animation（アニメーション）の上に Sound（効果音）セクションを持ちます。要素に効果音が設定されるまで、このセクションは折りたたまれています。

どちらにも音声アセットまたはアセットセットを選べます。No sound（効果音なし）は何も設定されていないことを示します。選んだ効果音の下にある Volume 1 · SFX（音量 1 · SFX）のような行を開くと、再生オプションの Volume（音量、0 から 1）と Track（トラック）が表示されます。効果音は Track で別のトラックを指定しない限り SFX トラックで鳴り、プレイヤーがそのトラックに設定した音量が適用されます。どのトラックで鳴らしても、ホバーやクリック 1 回につき 1 度だけ鳴り、ループしません。

1 回のホバーやクリックで鳴る効果音は 1 つです。効果音を持つ要素が入れ子になっている場合は、最も内側の要素の効果音だけが鳴ります。カードの中のボタンが自分のクリック音を持っていれば、ボタンをクリックしたときはボタンの効果音が、カードのそれ以外の場所をクリックしたときはカードの効果音が鳴ります。無効になっている要素は、どちらの効果音も鳴らしません。

効果音は Dev Mode とゲームの中で鳴ります。エディタのキャンバスでは鳴りません。

リンクされたコンポーネントのインスタンスには Sound セクションがなく、コンポーネント側に設定された効果音を鳴らします。条件によって変わる音は、ブループリントで Sound ノードを使って鳴らします。

ページの音楽

ページは Properties に Music（音楽）セクションを持ち、ページが表示されている間に流す音楽を決めます。Game UI には Music セクションがなく、その下ではシーンの音楽が流れます。

• 音楽を選んでいないとき、この行は Keep current music（今の音楽のまま）と表示され、ページは音楽を変えません。ページを開いたときに流れていた音楽がそのまま流れます。新しく作ったページはこの状態です。
• Choose page music（ページの音楽を選ぶ）で音声アセットまたはアセットセットを選ぶと、ページはそれを流します。同じ音楽が同じトラックですでに流れていれば、途切れずに続きます。そうでなければ、流れている音楽がそれ自身のフェードで消え、ページの音楽がページの Fade（フェード）で入ります。
• Choose page music の横の No music（音楽なし）を選ぶと、ページが表示されている間は音楽を流しません。
• Clear（消去）で Keep current music に戻ります。

選んだ音楽の下にある Volume 1 · Music · Loops（音量 1 · 音楽 · ループ）のような行を開くと、再生オプションの Volume（音量、0 から 1）、Track（トラック）、Loop（ループ）、Fade が表示されます。音楽は Track で別のトラックを指定しない限り音楽トラックで流れ、プレイヤーがそのトラックに設定した音量が適用されます。Loop は変更するまでトラック自身の設定に従い、音楽トラックはループします。Fade の単位は秒です。音楽はこの時間でフェードインし、ほかの音楽に引き継ぐときもこの時間でフェードアウトします。

どの音楽を流すかは、画面上のページが上から順に決めます。まずページの上に開いたレイヤー、次にページの順で、それぞれ後から開いたものから見ていきます。音楽を流すページか No music のページのうち、最初のものが音楽を決めます。今の音楽のままのページは下のページに決定を任せ、すべてのページが今の音楽のままなら、ページの音楽は流れません。

• 今の音楽のままのページ（タイトルページの上に開いた設定ページなど）は、タイトルページの音楽をそのまま流します。
• 下のページに戻ると、そのページの音楽に戻ります。
• Replace Page（ページを置き換える）で開いた、今の音楽のままのページは、置き換えられたページの音楽を流し続けます。
• Play Page Music（ページの音楽を流す）と Stop Page Music（ページの音楽を止める）は、自身のブループリントがあるページの音楽を、そのページが開いている間だけ変えます。たとえば音楽鑑賞で押された曲にします。Sound ノードを参照してください。

ゲーム中は音楽をストーリーが決めます。ゲームを始めるときやセーブをロードするときにページの音楽はフェードアウトし、ゲーム中に開いたページ（セーブページや設定ページなど）はページの音楽を流しません。ゲームを終了したときやストーリーが終わったときなど、ゲームが終わってページに戻ると、ふたたびページが音楽を決めます。

ページの音楽は Dev Mode とゲームの中で流れます。エディタのキャンバスでは流れません。Dev Mode では、ページの音楽を変えない編集で音楽が最初から流れ直すことはありません。

リスト

List（リスト）は、行ごとに Item template（項目のテンプレート）を 1 回描画します。行が持つ内容は、Properties の Content（内容）セクションにある Edit content（内容を編集）で設定します。ボタンの下の行にはフィールドの名前が並びます。

Edit content を押すと List content（リストの内容）が開きます。

• Fields（項目）は各行が持つ値で、それぞれ名前と型を持ちます。型は String（文字列）、Number（数値）、Boolean（真偽値）、Image（画像）、Color（色）、JSON のいずれかです。項目のテンプレート内のウィジェットは、Field（項目）でそのうちの 1 つを選んで表示します。
• Struct（構造体）は Fields の横にあり、フィールドの出どころを決めます。Custom（カスタム）は、この List のために書いたフィールドです。そのほかの選択肢は、エンジンが返す構造体（Ending（エンディング）、Save entry（セーブの項目）、History entry（履歴の項目）など）と、読み込まれているプラグインの構造体（Gallery プラグインが有効なときの Gallery entry（ギャラリーの項目）など）です。
• Rows（データ）はキャンバスに描画される行で、ほかに List の内容を与えるものがないときはゲームでも描画されます。

エンジンやプラグインの構造体を選ぶと、フィールドはそのノードが返す行のフィールドになります。Get Endings のエンディングを表示する List は、書かなくても endingId、name、sceneId、sceneName、isReached のフィールドを持ちます。これらのフィールドは編集できません。Row key（行キー）と、項目のテンプレート内のウィジェットが表示するフィールドは、同じ名前のフィールドに移ります。現在の行を読み取る Get Field は元のフィールドを保持し、構造体にそのフィールドがなければ報告されます。フィールドを選び直してください。Custom に戻すと、フィールドはそのまま残り、編集できるようになります。構造体とそのフィールドの一覧は構造体にあります。

Edit content で行った変更は、フィールド名の変更も含め、ほかの編集と同じように Undo（元に戻す）で取り消せます。

List が宣言するフィールドを持たない行をブループリントが List に渡した場合（Struct が Ending の List にセーブの項目を接続した場合など）、ブループリントのキャンバスと Problems（問題）パネルに List fields do not match（リストのフィールドが一致しない）が報告されます。List ではそのフィールドが空で表示されます。宣言されたすべてのフィールドを同じ名前と型で持つ行は、ほかにどんなフィールドがあっても受け付けられます。List のノードを参照してください。

ページのパラメータ

ページは、開かれるときに受け取る値を宣言できます。ページを選択し、Properties の Params（パラメータ）で追加します。各パラメータは名前、Type（型）、Default（初期値）を持ちます。

名前はページ内で重複できません。パラメータの名前を変えても、それを渡したり読んだりするブループリントの接続は保たれ、同じページでそれを表示する List も新しい名前に従います。Game UI には Params がありません。ゲームは Game UI を何も渡さずに開くためです。

パラメータには次の方法で値が渡されます。

• Go Page、Replace Page、Show Layer、Set Frame Page には、Page フィールドで選んだページのパラメータごとの入力が増えます。App のノードを参照してください。
• Page（ページ）ウィジェットの Properties には、その Params にページのパラメータごとのフィールドが表示されます。そこでテキストのパラメータに書いた文字は翻訳の対象になります。
• Show Confirm は message と buttons を渡します。Show Confirm を参照してください。

渡されなかったパラメータは初期値を読みます。ページはパラメータを3つの方法で使います。

• Text や Button は、ソースの選択の上にある Page param で選んだテキストのパラメータを、ブループリントなしで表示します。ゲームでは、ページを開くときに渡された文字を表示します。ノードが渡した文字は渡されたとおりに表示されます。翻訳するには、ノードに Translation Key Text や Get Text から文字を渡します。Page ウィジェットが渡した文字は翻訳されます。何も渡されなかったときは初期値を翻訳して表示します。ページ自身のキャンバスでは初期値を表示し、初期値が空の間はウィジェット自身の文字をサンプルテキストとして表示します。キャンバスでそのようなウィジェットをダブルクリックすると、編集する代わりに文字の出どころが表示されます。
• List はリストのパラメータを表示します。Content（内容）で Runtime items（実行時の項目）を Page props array（ページのプロパティの配列）にし、Param（パラメータ）でそのパラメータを選びます。項目のテンプレートが表示するフィールドは、パラメータの Row struct に含まれている必要があります。
• Get Page Param は、ブループリントで任意のパラメータを、その型のまま読み取ります。Get Page Param を参照してください。

スケルトンテンプレートの「確認」ページは両方を使っています。message はメッセージのテキストが表示するテキストのパラメータで、buttons は Row struct が Confirm button（確認ボタン）のリストのパラメータであり、ボタンのリストが描画します。

プロジェクトチェックは次のものを警告として報告します。

コンポーネント

選択した内容はComponent Library（コンポーネントライブラリ）に保存し、別の場所に再配置できます。一群のウィジェットをコピーではなく再利用したい場合は、コンポーネントを使います。

Params（パラメータ）はコンポーネントで宣言し、置いたものごとに設定します。String（文字列）パラメータは、コンポーネントのブループリントが Get Component Param で読み取ります。Text（テキスト）パラメータはプレイヤーが読む文字です。コンポーネント内のテキストやボタンで Parameter（パラメータ）から選ぶと、置いたものはそれぞれの文字をキャンバスとゲームで表示します。文字は直接入力でも翻訳キーでもかまいません。

ビヘイビア

ウィジェットの動作は、キャンバス上ではなくブループリントに記述します。各インターフェースは独自のブループリントを持ち、プロジェクト全体には共通のブループリントが 1 つあります。Page（ページ）の一覧の最初のカード App logic（アプリロジック）です。詳細は ブループリント を参照してください。