[Unity]NGUIで画面サイズに合わせる(その2)

2013/5/4 追記 : スクリプトは [Unity]NGUIで画面サイズに合わせる(NGUI2.3.0対応版) が最新です。


NGUI での複数解像度対応のための画面全体の拡大縮小は以前 [Unity]NGUIで画面サイズに合わせる ã«æ›¸ã„た方法もありますが、今回は別の、より NGUI の枠組みを活用したやり方でやってみます。

実は NGUI 自体にも画面サイズに合わせて拡大縮小する機能は一応あって、UIRoot の manualHeight がそれに当たります。manualHeight は、この高さが画面の高さにちょうど収まるようにするという意味があります。(少なくともそういう挙動をします。公式ドキュメントには特に説明はないのですが)


デフォルトでは Automatic=true になっているため、画面サイズの変更に合わせてこの manualHeight も自動で値が変わるようになっていますが、Automatic=false にすることで値を固定できます。ここで 240 にすると、下図のように 320x240 のスプライトがちょうど収まるようになります。


しかし、左右が余る場合はよいのですが、上下が余ってほしい場合でも下図のような表示になってしまいます。


というわけで、次のスクリプトを UIRoot に追加して、上下が余ってほしい場合に manualHeight を制御するようにしてみます。

using UnityEngine;
using System.Collections;

[ExecuteInEditMode]
public class NGUIUtilScalableUIRoot : MonoBehaviour
{
 public int manualWidth = 320;
 public int manualHeight = 240;
 
 UIRoot uiRoot_;
 
 void Awake()
 {
  uiRoot_ = GetComponent<UIRoot>();
 }
 
 void Update ()
 {
  if(!uiRoot_ || manualWidth <= 0 || manualHeight <= 0){ return; }
  
  int h = manualHeight;
  float r = (float)(Screen.height * manualWidth) / (Screen.width * manualHeight); // (Screen.height / manualHeight) / (Screen.width / manualWidth)
  if(r  > 1){ h = (int)(h * r); } // to pretend target height is more high, because screen width is too smaller to show all UI
  
  if(uiRoot_.automatic){ uiRoot_.automatic = false; }
  if(uiRoot_.manualHeight != h){ uiRoot_.manualHeight = h; }
 }
}

これで、上下左右どちらが余る場合でも期待の表示を得ることができます。



この方法は、以前紹介した Anchor 等の Scale を操作する方法と比較して、Anchor が複数になった場合でも対応がいらないといった利点もあります。

ちなみに、余った部分はカメラの Clear Flags を Solid Color にして黒にしています。このあたりは他にもカメラがあるなら適宜調整ということで。


2012/10/10 追記 : UIRoot が小文字になっていたのを修正。
2012/10/24 追記 : [Unity]NGUIで画面サイズに合わせる(NGUI2.2.2対応版) を書きました。
2013/5/4 追記 : [Unity]NGUIで画面サイズに合わせる(NGUI2.3.0対応版) を書きました。

コメント