【Unity】UIを端末に合わせたサイズに調節する

公開日: 21:13 ugui Unity


端末のサイズに合わせて
ゲームのUIのサイズを自動で変更させましょう。







1:UIを設置する


Canvasに2つのボタンを設置しました。
以下の2枚の画像はそれぞれ端末の解像度が

 ・240×400
 ・480×800 

の2つの画面サイズの端末で 表示したときの画面です。



 
自分が想定した画面以外だと
UIの大きさが変化してレイアウトが崩れているのがわかります。






 
240×400



480×800






480×800だとボタンが小さく表示され、
レイアウトが崩れてしまっています。








2:Canvas Scalar


端末のサイズに合わせてUIの表示する
大きさを自動で調節させるために
 CanVas Scalarの設定を変更します。


まずはCanvasを選択します。





Canvasを選択





InspectorのCanvas Scalarに注目







3:UI Scale Mode

UI Scale Modeを変更して
解像度に合わせてUIの大きさを
自動で変更するようにします。

UIの表示サイズを設定できます。
初期状態では Constant Pixel Size になっています。

これを Scale With Screen Size に変更しましょう。





Constant Pixel Size

これは設定したサイズそのままでUIを表示します。
pixelを基準とするため画面サイズが変わっても
表示されるUIのサイズは一定です。

画面サイズが固定ならば問題ありませんが
スマホアプリを制作している場合、
どのような解像度でも同じ大きさで表示するので
表示が崩れる原因になります。







Scale With Screen Size

UI Scale ModeをScale With Screen Size
変更すると新たな項目が出現します。











Reference ResolutionのX,Yで
画面の固定サイズを設定できます。

Screen Match Modeを選択します。
これを選択することで画面の比率を
縦と横、どちらに優先して合わせるかを
選択することができます。

Matchの割合はアプリに合わせて調節しましょう。

・縦持ちならMatch = 1
・横持ちならMatch = 0

という感じでしょうか。




解像度問題もUnityなら簡単に解決






スポンサードリンク
スポンサードリンク
  • ?±??G???g???[?d????u?b?N?}?[?N???A

0 件のコメント :

コメントを投稿