妹でもわかるUnrealEngine4

毎日更新? 妹に説明するために書いてるけど、たまにわかってない場合もあるUnrealEngine4を中心としたゲーム制作の話。略すとイモリアル

毎日更新? 妹に説明するために書いてるけど、たまにわかってない場合もあるUnrealEngine4を中心としたゲーム制作の話。略すとイモリアル

ウィジェットの大きさを画面に合わせる

妹「点数表示するウィジェットとか作ったんだけど、これ画面サイズを変えても大きさがちゃんと変わらないから、変なとこにかぶって邪魔になる……」

「それは基本的にはアンカーとScaleBoxを使って対応すればいいと思う」

「まずアンカーだけど、"アンカー"って書いてあるところを押して設定出来るのは簡易設定で、ウィンドウの端にくっ付けることしか出来ない。でも実際はもっと細かく設定出来る。アンカーが左上を設定してれば左上の方に、アンカー用の花びらみたいなマークがある。これの花びらを1つずつドラッグすると自由な位置にアンカーが設定出来る」

妹「そういえばアンカーって左上なら左上に、右下なら右下に寄せるけど、左上と右上と両方にアンカー設定したらどうなるの?」

「両方のアンカーが引っ張られる形になるから、伸びる。その伸びた状態にするのが今回の趣旨。まずアンカーで大きさを設定して、その後オフセットを上下左右とも0にすると、ぴったりアンカーで指定したサイズになる」

f:id:una_unagi:20150929222747p:plain

妹「こうすると拡大出来るの?」

「出来るのもある。ただテキストの場合テキスト領域が大きくなるだけで、字のサイズが大きくならない。だからそういう場合はまずScaleBoxを配置して、そのScaleBoxにアンカーの設定をする。その中にテキストを入れると、ScaleBoxいっぱいに広がる。その状態でウィンドウを拡大したり縮小したりすると、まずScaleBoxが伸び縮みして、中にあるテキストもそれに合わせて大きさが変わる」

f:id:una_unagi:20150929223534p:plain

「これで字の大きさは変わるけど、縦横の画面比率が変わった場合、文字自体を縦長にしたり横長にしたりはしないから、余計な空白が出来ることがある。そのへんはテキストのレイアウトのところで、どっちに寄せるか設定できる」

f:id:una_unagi:20150929223750p:plain

「ScaleBoxの注意点として、1個しか子ウィジェットを持てないというのがある。子に子を持たせることは出来るから、孫が複数というのは可能だけど、子は1つだけ。あと色々試していると、拡大の仕方が変な時はScalaBox、表示が変な時は子ウィジェットの設定でなんとかなることが多かった」

妹「とりあえずScaleBoxに入れてみればいいのかな?」

「でもまあ、画面の大きさが簡単に変えられるのってプレビューモードだから、普通に配布するゲームでは変更出来ないようになってるんだけどね」

妹「ええっ!? なんでプレビューで出来て本番で出来ないの?」

「変更自体は出来るんだけど、ウィンドウをドラッグして変更というのが出来ない。出来るようにすると、今回のウィジェットの配置問題とか、あとカメラから見える範囲が変わるとか、色々問題が起きるからだと思うけど。このサイズに変更する……というブループリントを作れば変更は出来る。あとスマートフォンとかだとどうなるかわからない」

妹「じゃあ大きさが変わることとか、実は気にしなくていいの?」

「プレビューの確認中に気になるとかでなければ、気にしなくていいような……」