1.UIRoot:根据高度自适应屏幕分辨率。
NGUI根目录的UIRoot组件自带了根据高度自适应分辨率的功能。
Scaling Style属性可选择三种不同的缩放策略。
- PixelPerfect 完美像素:直接显示设定好的像素。当屏幕高度低于minimum Height时按比例缩小,当屏幕高度大于maximum Height时按比例扩大。
- FixedSize 按比例缩放:在设定好的基础上,直接按比例缩放。
- FixedSizeOnMobiles 合体版,android和ios为FixedSize方式,其它按照PixelPerfect方式。
// FixedSize时:填理想分辨率的高度
// FixedSizeofWidth时:填理想分辨率的宽度
Manual
Minimum Height:Game视图低于这个数值开始按比例缩放。
Maximum
这三种缩放方式全部都是按照高度计算缩放比例,完全忽略宽度。
在制作时UI比例按照最长的16:9(红色)来做,另外3:2(绿色)为内容区域。红色两边的位置在不同比例的手机上会有不同程度的别切割的情况,所以不要把游戏内容放在这一区域。
2.UIRoot:根据宽度自适应屏幕分辨率。
UIRoot已经实现了根据高度自适应的功能,但是我现的需求是要根据宽度来自适应,屏幕高度高于UI高度则留空白。
1.首先给UIRoot增加一种状态
- public
enum Scaling - {
-
PixelPerfect, -
FixedSize, -
FixedSizeOnMobiles, -
/// -
/// 根据宽度适配 -
/// -
FixedSizeofWidth, - }
2.实现还是需要FixedSize的算法,所以需要修改两个判断语句
修改1:
- public
float GetPixelSizeAdjustment (int height) - {
-
height = Mathf.Max(2, height); -
//修改1 -
if (scalingStyle == Scaling.FixedSize || scalingStyle == Scaling.FixedSizeofWidth) -
return (float)manualHeight / height; -
- #if
UNITY_IPHONE || UNITY_ANDROID -
if (scalingStyle == Scaling.FixedSizeOnMobiles) -
return (float)manualHeight / height; - #endif
-
if (height < minimumHeight) return (float)minimumHeight / height; -
if (height > maximumHeight) return (float)maximumHeight / height; -
return 1f; - }
修改2:
- public
int activeHeight - :{
-
get -
{ -
int height = Mathf.Max(2, Screen.height); -
//修改2 -
if (scalingStyle == Scaling.FixedSize || scalingStyle == Scaling.FixedSizeofWidth) -
return manualHeight; - #if
UNITY_IPHONE || UNITY_ANDROID -
if (scalingStyle == Scaling.FixedSizeOnMobiles) -
return manualHeight; - #endif
-
if (height < minimumHeight) return minimumHeight; -
if (height > maximumHeight) return maximumHeight; -
return height; -
} - }
3.增加按宽度自适应算法
- void
Update () - {
- #if
UNITY_EDITOR -
if (!Application.isPlaying && gameObject.layer != 0) -
UnityEditor.EditorPrefs.SetInt("NGUI Layer", gameObject.layer); - #endif
-
if (mTrans != null) -
{ -
float calcActiveHeight = activeHeight; -
-
if (calcActiveHeight > 0f ) -
{ -
float size = 2f / calcActiveHeight; -
-
//看这里,看这里,看这里 -
if (scalingStyle == Scaling.FixedSizeofWidth) -
{ -
float radio = (float)Screen.width / Screen.height; -
size = size * radio; -
} -
-
Vector3 ls = mTrans.localScale; -
-
if (!(Mathf.Abs(ls.x - size) <= float.Epsilon) || -
!(Mathf.Abs(ls.y - size) <= float.Epsilon) || -
!(Mathf.Abs(ls.z - size) <= float.Epsilon)) -
{ -
mTrans.localScale = new Vector3(size, size, size); -
} -
} -
} - }
3.UIStretch:根据宽度自适应屏幕分辨率。(NGUI3.0.7版本后不再支持)
这个是早期NGUI实现自适应分别率的一种方法,新版本中加入UIRoot自适应的方法后,这个脚本就不在被官方推荐使用了。
这个脚本自带的Style除了按高度自适应的功能之外,按宽度自适应是要拉伸图像的,并不能满足我们的要求。
最符合我们的要求的就是BasedOnHeight,那我们就按照这个功能修改一个BasedOnWidth出来,之前的博客中写过这个功能,现在这篇文章直接替换了之前的,所以我还是贴出修改的内容吧。
首先在Style枚举中增加一个BasedOnWidth,类型
- public
enum Style - {
-
None, -
Horizontal, -
Vertical, -
Both, -
BasedOnHeight, -
BasedOnWidth, -
FillKeepingRatio, -
FitInternalKeepingRatio - }
Update方法中增加一个if分支。
- if
(style == Style.BasedOnHeight) - {
-
localScale.x = relativeSize.x * rectHeight; -
localScale.y = relativeSize.y * rectHeight; - }else
if (style == Style.BasedOnWidth) - {
-
localScale.x = relativeSize.x * rectWidth; -
localScale.y = relativeSize.y * rectWidth; - }
- else
if (style == Style.FillKeepingRatio) - {……}
这个脚本是通过拉伸scale实现,所以这个脚本要放在你需要拉伸的UI上(如果你只需要一个背景图片自适应屏幕分辨率,那就把这个脚本添加到这个背景图片中,如果要一个panel内所有元素都自适应,那就放在这个panel上。如果想让所有的UI全部自适应分辨率,那就放在NGUI的cameta上。)
ui Camera属性需要选择渲染当前UI的摄像机。
使用步骤: