对NGUI屏幕自适应的理解备注

最新推荐文章于 2015-01-30 11:03:00 发布

原创

最新推荐文章于 2015-01-30 11:03:00 发布 · 2.9k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#unity NGUI 自适应

NGUI的自适应主要由UIRoot.cs和UIStretch.cs完成。通过设置UIRoot的ScalingStyle为FixedSizeOnMobiles并调整ManualHeight，实现首次缩放。接着在Panel上添加Stretch.cs脚本，自定义对齐方式，解决不同分辨率下界面显示问题。在 Stretch.cs 脚本中根据屏幕宽高比动态调整缩放基准，确保界面适配。实际应用中，需根据美术资源尺寸设置相机大小和UIStretch的属性，以避免图素失真。

NGUI自适应是使用NGUI做界面的一大优势之一。我个人理解NGUI的自适应是由他里面的UIRoot.cs和UIStretch.cs两个脚本共同完成的。具体怎么做如下：

1.使用NGUI创建一个UI界面时（我用的是NGUI版本是2.5a），会自动生成如下继承结构的框架：

默认是在一个Anchor下放一个Panel，但我个人更喜欢把panel入在Camera下面，然后把Anchor放到panel下面，也就是说所有的界面集中在一个Panel下：

把根结点UIRoot中的ScalingStyle选择为FixedSizeOnMobiles，并将ManualHeight设置为640.（因为制作界面时以960*640为标准，与美术使用也是约定以引分辨率作图）

这就是第一次缩放。无论在屏幕的什么分辨率下，界面都会以0.003125 （即2/640）缩放。原因可以看《NGUI之UIRoot屏幕分辨率自适应》(http://blog.youkuaiyun.com/onerain88/article/details/11713299)中做了比较详细的解释，个人认为这是比较好的一篇文章，对UIRoot.cs脚本做了比较详细的解释。也正如上文说的，UIRoot.cs虽然做到了自适应，但以特定分辨率做出的界面（比如我用的就是960*640）在其他分辨率时会出现问题，如在iphone5(16:9)就会在两边出现空白，而在ipad的分辨率就会出现裁减。为解决这个问题，就需要第二步，使用Stretch.cs脚本。