最終更新日 2019/05/19

UI作成の下準備

初歩過ぎてどこにも載っていない舞台裏から。

コンテンツブラウザを調整する

新規プロジェクト画面が開く。が、UIを作る場合はサブぐらいの価値で主に実行確認用画面。
完全個人趣味と前置きし、�，痢屮灰鵐謄鵐張屮薀Ε供廚良�は狭いほうが良い派なのでタブを�△両貊蠅泙妊疋薀奪阿靴萄限Δ離Ε�ンドウの幅を揃える。

こちらは大抵の人がやっているのに初歩的過ぎて中々説明のないコンテンツブラウザの分割の仕方。
��のボタンを押すと�い里茲Δ暴弔吠�割される。
とても便利なので推奨。

レベルファイルを作成

レベルファイルは大抵の3Dグラフィックソフトでよくあるsceneファイルのようなもの。
今回はこのレベルファイルに対してUIを表示してみようと思うので早速新規作成。
コンテンツブラウザの右領域で右クリックをして「レベル」を選択する。
出来たレベルファイルに適当な名前をつける。
赤枠の米印は変更があるけれどセーブされていないよマーク。

コンテンツにフォルダ追加

コンテンツ以下には好きにフォルダを作ることができる。
Unityのような変更不可の必須フォルダも無さげなので安心してカスタマイズできる。
とりあえずUIで今後必要な「ウィジェット」という部品を作るので、そいつを入れるフォルダを右クリックから作成していく。

ウィジェットを作成

UMGでUIを作成する場合の本舞台となるウィジェットブループリントを作成。
レベルファイル同様コンテンツブラウザの右領域で右クリックし、一番下にある「ユーザーインターフェイス」から「ウィジェットブループリント」を選択。
このファイルにUIのパーツを作って配置・制御していくことになる。
米印は変更あるけどセーブされてないよマーク。

とりあえずセーブ

保存はファイルを開いて左上にある「保存ボタン」で保存する他、ファイルを右クリックして「保存」を選ぶことでも可能。
大胆に「すべてを保存」でも良いがガチですべて保存されるので後悔のないように。

保存すると米印は消える。

WidgetのDPIスケールを設定する

作成するゲームの解像度での状態を視覚的に確認するため、ビジュアルデザイナ側のDPIスケールを調整する。

上で作成した「TestWidget」をダブルクリックしてWidget画面を開く。
ビジュアルデザイナの右下歯車のアイコンがあるので、クリックして設定ウィンドウを開く。

1080pの解像度のゲームを作りたいと仮定し、グラフのResolutionが1080.0になっているキーをアクティブにし、Scaleを1.0にする。
設定したい解像度がない場合は、右クリックで追加することが出来る。
設定ウィンドウを閉じ、ビジュアルデザイナの右上にあるスクリーンサイズをクリックし、1080pに変更。
歯車左上にある斜め矢印をドラッグして1920*1080にあわせるとDPIスケールが1.0と表示されるようになる。

お世話になることの多い代表的な解像度は以下の通り。