雨松MOMO 2014年05月04日 于 雨松MOMO程序研究院 发表

 现在用unity做项目 90%都是用NGUI,并且我个人觉得NGUI应该算是比较成熟的UI插件,虽然他也存在很多问题,但是至少这么多游戏都在用,它目前是能hold住的,嘿嘿。 这篇文章说说我现在是怎么自适应UI 和 3D 游戏的。。

1.获取屏幕的宽高

Screen.width  Screen.height 可以回去设备屏幕的宽高,但是它并不是NGUI的宽高。比如你想做一个全屏的UISprite 。

这样的代码是错误的。

sprite.width = Screen.width ;

sprite.height =  Screen.height 

正确的方法应该是:

 
1
2
3
4
5
6
7
8
UIRoot root = GameObject.FindObjectOfType<UIRoot>();
if (root != null) {
float s = (float)root.activeHeight / Screen.height;
int height =  Mathf.CeilToInt(Screen.height * s);
int width = Mathf.CeilToInt(Screen.width * s);
Debug.Log("height = " + height);
Debug.Log("width = " + width);
}

 我建议在项目中你可以封装两个只读的方法来获取NGUI 的宽和高。

2.自适应NGUI屏幕

在Hierarchy视图中选择UI Root (2D)然后在Inspector视图中、

Scaling Style :如果是手机游戏的就选择FixedSizeOnMobiles,它的意思就是开启UI整体缩放的支持。

Manual Height:这个属性就比较重要的,因为我们的自适应屏幕,原理就是根据Screen.width 和Screen.height来动态的计算它的实际高度,动态的修改这个值。

Min/Max inum Height:这就是支持的最大高度,和最小高度一般都是 640 到 1536。

开始做UI的时候就需要定制游戏主版本的屏幕分辨率,我定的分辨率是960X640,所以我屏幕的实际高度是640 。那么在Manual Height的参数我就需要写640.  

如下图所示,我在960X640的屏幕上布置了我的简单界面。

我举个典型的例子,这时候我把屏幕分辨率改成1024X768. 因为960X640 是3:2的屏幕,而1024X768是4:3的屏幕。所以屏幕就会变成那面这个样子。

然后,我们就需要来修改Manual Height这个参数,如果是1024X760的分辨率,那么此时它的Maunal Height应该是720。

在看看,如下图所示,界面整体布局居中显示了。但是布局的位置是没有发生任何改变的。

我个人觉得根本就是没有完美自适应的方法。除非你可以接收屏幕上的某些元素被拉伸变形。。 如上图所示,在这里我们只需要把背景的白框拉伸成屏幕的宽高即可。

说了半天就是一个简单的数学算法,根据布置UI时的分辨率,加上现在屏幕的分辨率根据这两个参数,动态的计算出现在manualHeight的高度。

我在Unity圣典上已经看到有人写了这个算法。

http://game.ceeger.com/forum/read.php?tid=9230&ds=1

找一个合适的地方调用一下如下方法。 960 /640换成你布置屏幕时的宽高即可。

 
1
2
3
4
5
6
7
8
9
10
11
12
13
static private void AdaptiveUI()
{
int ManualWidth = 960;
int ManualHeight = 640;
UIRoot uiRoot = GameObject.FindObjectOfType<UIRoot>();
if (uiRoot != null)
{
if (System.Convert.ToSingle(Screen.height) / Screen.width > System.Convert.ToSingle(ManualHeight) / ManualWidth)
uiRoot.manualHeight = Mathf.RoundToInt(System.Convert.ToSingle(ManualWidth) / Screen.width * Screen.height);
else
uiRoot.manualHeight = ManualHeight;
}
}

 UI整体布局 “居中” 并不是一个好的处理办法,这时候就需要策划人员的头脑风暴了,不过可以参考一下别的游戏自适应的方法。如果你的UI布局比较简单的话,比如战斗UI。一般都是4个角有东西,可以用Anchor把它固定在屏幕上。或者用新版本的NGUI提供的UIWidget也可以设置固定的位置。

3.3D方面的自适应

我们在说说3D方面的自适应,比如游戏里面的人物。。我举个例子,比如我们游戏是960X640屏幕,在屏幕的边缘放一个3D的角色,那么此时屏幕变成1024×768那么这个小人可能就跑到屏幕外面了。。解决这个问题就需要3D 摄像机的自适应。

如下图所示,我在960X640屏幕的边缘放了一个3D的立方体对象。

然后我把屏幕设置成1024X768。如下图所示,可以看到这个立方体对象以后超出了屏幕。。。

有一个非常俏巧妙的方法可以解决它。就是修改Camera的Field of View的参数,找一个合适的地方调用一下这个方法。这里我借助了刚刚自适应NGUI屏幕的参数。这里我用到了UIRoot的manualHeight ,所以UI需要你是用上面介绍的方法来自适应,640表示我制作时屏幕的高度,拥着两个数相除那么就可以得到Camera缩放的系数了。

 
1
2
3
4
5
6
static public float getCameraFOV(float currentFOV)
{
UIRoot root = GameObject.FindObjectOfType<UIRoot>();
float scale =Convert.ToSingle(root.manualHeight / 640f);
return currentFOV * scale;
}

 找一个合适的地方调用,60表示默认的参数,getCameraFOV这个方法的原理就是根据默认的FOV参数加上当前屏幕的系数以及布置屏幕时的系数,动态计算出一个新的FieldOfView。

 
1
Camera.main.fieldOfView = getCameraFOV(60);

 说到这里其实修改射线机的Z轴也可以达到自适应的效果,但是我觉得最好用fieldofView,因为游戏中你的摄像机可能位置会发生变化,总不能一直去改Z轴的属性吧,而FiewldOfView你只需要设置一次就可以了。嘿嘿。

4.拉伸变形

你可以让所有的摄像机在初始化的时候调用一下这个方法,它会完完整整的拉伸屏幕 ,大家可以试试,不过千万不要用,因为变形了太难看。。。。

 
1
2
3
4
foreach(Camera camera in Camera.allCameras)
{
camera.aspect  = 640f/960f;
}

NGUI 屏幕自适应的更多相关文章

  1. NGUI屏幕自适应

    NGUI确实是非常棒的一个做界面的插件,比起U3D自带的GUI要好很多,当然也有一些不好之处,毕竟什么都不可能那么完美. 最近在用Unity写游戏使用NGUI遇到了一个很多人都在遇到的问题,就是关于屏 ...

  2. 【Unity3D插件】NGUI屏幕自适应(转)

    屏幕自适应 NGUI可以比较方便的实现屏幕自适应,但是它的官方教程里面针对这个问题没有详细的教程,所以可能在实现的时候会走比较多的弯路.以下是我在开发过程中找到的一个比较方便的实现方法. 主要组件 1 ...

  3. NGUI屏幕自适应(转)

      屏幕自适应 NGUI可以比较方便的实现屏幕自适应,但是它的官方教程里面针对这个问题没有详细的教程,所以可能在实现的时候会走比较多的弯路.以下是我在开发过程中找到的一个比较方便的实现方法. 主要组件 ...

  4. NGUI 屏幕自适应大屏与小屏(初始设定宽高为1280x720,能适应比其小或者更大的屏)

    具体细节可以参考另外一篇随笔! 以下提供的算法完成的事: 1.自适应1280x720分辨率以下的屏幕 2.自适应1280x720分辨率以上的屏幕 在我设定的要求内包括的分辨率大部分都测过了,背景图.全 ...

  5. NGUI屏幕自适应解决方案

    NGUI研究院之自适应屏幕 http://www.xuanyusong.com/archives/2536 Unity3D研究院之使用Android的硬件缩放技术优化执行效率 http://www.x ...

  6. NGUI 屏幕自适应(初始设定宽高800x480只支持比其大的屏幕)

    自适应讲解部分可以参考以下网址:http://www.xuanyusong.com/archives/2536,下面代码中提到的AdaptiveManualHeight()函数就是参考该文章的. 下面 ...

  7. [Unity3D]NGUI用Sprite动画和屏幕自适应做游戏开始场景

    我们在玩任何一款手游产品时,都是先上来个logo界面,游戏欢迎界面等,这就意味着我们要做一款游戏需要多个场景,场景之间来回切换实现游戏逻辑,unity也不例外,所以从本篇开始将会介绍如何搭建多个场景, ...

  8. NGUI之自适应屏幕

     转载: 雨松MOMO 2014年05月04日 于 雨松MOMO程序研究院 发表 ,原文链接   现在用unity做项目 90%都是用NGUI,并且我个人觉得NGUI应该算是比较成熟的UI插件,虽然他 ...

  9. 【NGUI】屏幕自适应(不用UIStretch,用UIRoot)---------------good

    原地址:http://blog.csdn.net/lzhq1982/article/details/18814023 这篇文章是转载的,之前用UIStretch做屏幕自适应,但一直有两个硬伤让我难受, ...

随机推荐

  1. KETTLE 配置资源库

    KETTLE 是一款开源的ETL工具,通过图形界面进行设计,可以对数据进行转换.设计好的文件分为两类,一类是trans,一类是job,这些文件可以存储到文件系统中.   也可以存储到数据库中.   如 ...

  2. Ionic 的 ng-class 在聊天功能上面的巧妙运用

    很多人在问我是ionic好呢?还是react好呢? 其实我只想告诉你去看文档啊,不用用怎么知道哪个合适呢? 嘿嘿但是真的这么问的时候我也不会这么回答的,那岂不是太张狂了哈哈哈 react我确实没有用过 ...

  3. IOS多媒体

    概览 随着移动互联网的发展,如今的手机早已不是打电话.发短信那么简单了,播放音乐.视频.录音.拍照等都是很常用的功能.在iOS中对于多媒体的支持是非常强大的,无论是音视频播放.录制,还是对麦克风.摄像 ...

  4. 文顶顶iOS开发博客链接整理及部分项目源代码下载

    文顶顶iOS开发博客链接整理及部分项目源代码下载   网上的iOS开发的教程很多,但是像cnblogs博主文顶顶的博客这样内容图文并茂,代码齐全,示例经典,原理也有阐述,覆盖面宽广,自成系统的系列教程 ...

  5. 在windows 10中使用pip安装psutil 4.3.0

    环境版本:windows + python 2.7/3.5共存 使用的python是使用exe安装的,默认已经有pip并确保PATH设置正确,默认安装psutil 4.3.0 1:使用cmd安装2.7 ...

  6. Python - twisted web 入门学习之一

    原文地址:http://zhouzhk.iteye.com/blog/765884 python的twisted框架中带了一个web server: twisted web.现在看看怎么用. 一)准备 ...

  7. JSP内置对象---请求重定向与请求转发的区别

    视频地址:http://www.imooc.com/video/3306 方便理解:

  8. 转载《遭受arp攻击怎么办》

    ARP(Address Resolution Protocol,地址解析协议)协议的基本功能就是通过目标设备的IP地址,查询目标设备的MAC地址,以保证通信的进行.ARP攻击仅能在以太网(局 域网如: ...

  9. String使用机制及string.equals()和==的区别(转)

    http://904582819.blog.163.com/blog/static/11159282020127794456840/ equals方法和==的区别   首先大家知道,String既可以 ...

  10. Windows 10 RTM 官方正式版

    Windows 10 各版本区别: Windows 10 家庭版:供家庭用户使用Windows 10 专业版:供小型企业使用 在家庭版基础上增加了域账号加入.bitlocker.企业商店等功能Wind ...