NGUI如何让按钮的位置自动适应分辨率
1个回答
推荐于2016-10-02 · 知道合伙人数码行家
huanglenzhi
知道合伙人数码行家
向TA提问 私信TA
知道合伙人数码行家
采纳数:117538
获赞数:517174
长期从事计算机组装,维护,网络组建及管理。对计算机硬件、操作系统安装、典型网络设备具有详细认知。
向TA提问 私信TA
关注
展开全部
NGUI在unity3d游戏开发中非常常用,而NGUI对于每一个UI场景,都是以一个UIRoot为UI游戏对象树的根的,先简单看一下UIRoot中的基本属性
UIRoot游戏对象的属性只有4个,分别是缩放规则,手动高度,最小高度和最大高度
而正是这4个属性,将影响整个UI场景中整体的缩放比例,当设置好这4个属性之后,UIRoot游戏对象的相对缩放值(LocalScale)将会生成并且不能被直接修改(NGUI中很多属性都是不能直接被修改的,这种控制是在UIRoot脚本中,通过设置[ExecuteInEditMode]做到的,其相对缩放值是根据UIRoot的4个属性计算出来的),那么这4个属性分别是什么含义呢?
(吐槽一下,也许这里的用户体验并不足够友好,因为Manual Height和Minimum Height, Maximum Height并不会同时起作用,如果能做到在选择Scaling Style时动态的切换,使用者也许能更清楚它们之间的关系)
[size=14.399999618530273px][AppleScript] [color=rgb(51, 102, 153) !important]纯文本查看 [color=rgb(51, 102, 153) !important]复制代码
[color=white !important][backcolor=rgb(108, 226, 108) !important]
[color=white !important]?
[size=14.399999618530273px](FixedSize和FixedSizeOnMobiles类似,并且后者只添加了对ios和
[size=14.399999618530273px]android
[size=14.399999618530273px]平台的判断,所以前者可以替代后者使用)这里只讨论PixelPerfect和FixedSize的区别,两者都是针对于所有在此UIRoot之下的UI组件而言的,也可以认为是在此UIRoot下,整个游戏
[size=14.399999618530273px]屏幕
[size=14.399999618530273px]的尺寸的缩放类型!
[size=14.399999618530273px]2.Manual Height和Minimum Height, Maximum Height (手动高度和最小高度,最大高度)
[size=14.399999618530273px]Manual Height和Minimum Height, Maximum Height不会同时对此UIRoot起作用,当选择Scaling Style为PixelPerfect时,我们需要设置Minimum Height, Maximum Height;而当Scaling Style为FixedSize或FixedSizeOnMobiles时,我们需要设置Manual Height。(这就是我前面吐槽的原因)
[size=14.399999618530273px]3.使用
[size=14.399999618530273px](1)PexelPerfect和Minimum Height, Maximum Height
[size=14.399999618530273px]这个组合主要用于我们期望所有的UI纹理都“尽量”不进行缩放,所谓“尽量”的程度,则是取决于Minimum Height和Maximum Height,Minimum Height表示当设备分别率小于此设置值时,根据此设置值对UIRoot进行缩放;Maximum Height表示当设备分辨率大于此设置值时,根据此设置值对UIRoot进行缩放(UIRoot是UI游戏对象树的根,修改UIRoot的缩放,则会影响整棵UI树的缩放)
[size=14.399999618530273px](2)FixedSize和Manul Height
[size=14.399999618530273px]这个组合主要用于我们期望所有的UI纹理都进行“合适”的缩放,所谓“合适”缩放的原则,则是根据Manual Height设置值,当设备分辨率的高度值不同于此设置值时,则根据其比例(即Manual Height / Screen Height)对整棵UI树的进行“等比”缩放(宽度的缩放比也是此比例值),这样,我们就可以做一套资源,在不同尺寸的分辨率最好的“不变形”的适配了
[size=14.399999618530273px](3)交集
[size=14.399999618530273px]前面两组在什么情况下等同呢?
[size=14.399999618530273px]Manual Height == Minimum Height == Maximum Height
[size=14.399999618530273px]推导过程,呵呵~~
[size=14.399999618530273px]具体可参考UIRoot中activeHeight属性和GetPixelSizeAdjustment的计算过程
[size=14.399999618530273px]4.这也许并不够
[size=14.399999618530273px]基于以上推到,当我们以1024x768为标准分辨率做一套UI资源(也就是选择FixedSize并且Manual Height=768),似乎可以满足百分之90以上的机型了,而为什么是1024x768呢?
[size=14.399999618530273px]既然我们已经容忍在除1024x768之外的其他设备上进行等比缩放了,那为什么不是960x640呢?
[size=14.399999618530273px]计算一下1024x768的宽高比=1.33,960x640的宽高比=1.5,这就是移动设备的分辨率比例的全部了吗?
[size=14.399999618530273px]当然不是,iphone5的比例就要大于1.5,还有各种奇葩的android设备呢,比如夏新的n828就是960x540,宽高比=1.78
[size=14.399999618530273px]那为什么以1024x768为标准呢?
[size=14.399999618530273px]因为1.33的宽高比,当我们的1024x768的资源到960x640的设备上时会有什么现象?
[size=14.399999618530273px]根据Manual Height / Screen Height的比例可知,我们需要缩放768 / 640 = 1.2倍,假设是一张1024x768的纹理,高度缩放1.2倍变为了640,宽度也要相应缩放1.2倍变为853(保证等比缩放不变形),也就是说1024x768的资源放到960x640上反而两边有了黑边,这是我们可以容忍的,我们可以做一个很大的背景或者拉伸,保证UI组件不变形即可,很多游戏都是这么做的,比如植物大战僵尸在iphone5和ipad上看到的背景视野并不一样大!
[size=14.399999618530273px]当放到夏新的机器上呢?
[size=14.399999618530273px]我们需要缩放768 / 540 = 1.4倍,宽度1024 / 1.4 = 731,这是可以的,只是看起来更怪一些,因为两边的黑边相对比例更大了(960 - 731=229的黑边区域)
[size=14.399999618530273px]而我表示android机器的分辨率奇葩到只有想不到,没有做不到的程度,也许宽高比1.7并不是终点,当遇到1.8之后,黑边的相对比例会更大。。。
[size=14.399999618530273px]5.问题又来了
[size=14.399999618530273px]假设我们的游戏类型更适合iphone手机玩,不太适合ipad,所以我希望能以960x640为标准做一套资源,可以吗?
[size=14.399999618530273px]我只能说不太可以,因为你要在设计UI组件的大小做限制了,为什么需要做限制?
[size=14.399999618530273px]假设我有一张纹理是960x640大小的,在iphone上铺满整屏,根据我们的设置(FixedSize和Manual Height=640),拿到1024x768的分辨率上,高度640 / 768 = 0.83,为了保证等比缩放,宽度960 / 0.83 = 1156,不幸的事情发生了,1156 > 1024,这个UI组件宽度超过了屏幕的宽度,被裁剪了。。。这是我们不能容忍的,或许你可以说我们尽量不做这种尺寸的UI,OK,你可以对UI尺寸加限制,但是当面对android那些奇葩的分辨率的时候,你会发现限制越来越大,这也许会让美术和策划疯掉!
[size=14.399999618530273px]6.解决方案
[size=14.399999618530273px]当我们花上一些时间去观察现在移动设备的分辨率时,虽然奇葩很多,但是还是有一些规律的,规律的在于宽高比而不在于具体尺寸,大体上划分一下宽高比在1.3,1.5,1.7的范围上的居多(基本是全部吧!)即便是再有1.2,1.8的比例也无妨。。。
[size=14.399999618530273px]NGUI为我们提供的方案只有以各种高度为衡量标准是不够的,我们应该加上一种以宽度为衡量标准的缩放类型
[size=14.399999618530273px]而对于UI资源的标准,我们选取960x640,宽高比为1.5
[size=14.399999618530273px]这样,当我们在兼容大于1.5的尺寸的时候,使用NGUI的现有方案;当我们在兼容小于1.5的尺寸的时候,使用以宽度为衡量标准
[size=14.399999618530273px]也就是说有一个类似Manual Width的属性,当小于1.5时,我们使用Manual Width / Screen Width得出整棵UI树的缩放比例!
[size=14.399999618530273px]这样做的好处是“黑边”区域不会太大,并且不需要对UI组件的大小做限制!
[size=14.399999618530273px]
[size=14.399999618530273px]from: http://blog.csdn.net/kepoon/article/details/16902021
如果你还有什么不懂的,可以百度搜下:编程回忆录,他们现在正在录制这方面的教程,都是零基础开始,由浅入深。
UIRoot游戏对象的属性只有4个,分别是缩放规则,手动高度,最小高度和最大高度
而正是这4个属性,将影响整个UI场景中整体的缩放比例,当设置好这4个属性之后,UIRoot游戏对象的相对缩放值(LocalScale)将会生成并且不能被直接修改(NGUI中很多属性都是不能直接被修改的,这种控制是在UIRoot脚本中,通过设置[ExecuteInEditMode]做到的,其相对缩放值是根据UIRoot的4个属性计算出来的),那么这4个属性分别是什么含义呢?
(吐槽一下,也许这里的用户体验并不足够友好,因为Manual Height和Minimum Height, Maximum Height并不会同时起作用,如果能做到在选择Scaling Style时动态的切换,使用者也许能更清楚它们之间的关系)
[size=14.399999618530273px][AppleScript] [color=rgb(51, 102, 153) !important]纯文本查看 [color=rgb(51, 102, 153) !important]复制代码
[color=white !important][backcolor=rgb(108, 226, 108) !important]
[color=white !important]?
[size=14.399999618530273px](FixedSize和FixedSizeOnMobiles类似,并且后者只添加了对ios和
[size=14.399999618530273px]android
[size=14.399999618530273px]平台的判断,所以前者可以替代后者使用)这里只讨论PixelPerfect和FixedSize的区别,两者都是针对于所有在此UIRoot之下的UI组件而言的,也可以认为是在此UIRoot下,整个游戏
[size=14.399999618530273px]屏幕
[size=14.399999618530273px]的尺寸的缩放类型!
[size=14.399999618530273px]2.Manual Height和Minimum Height, Maximum Height (手动高度和最小高度,最大高度)
[size=14.399999618530273px]Manual Height和Minimum Height, Maximum Height不会同时对此UIRoot起作用,当选择Scaling Style为PixelPerfect时,我们需要设置Minimum Height, Maximum Height;而当Scaling Style为FixedSize或FixedSizeOnMobiles时,我们需要设置Manual Height。(这就是我前面吐槽的原因)
[size=14.399999618530273px]3.使用
[size=14.399999618530273px](1)PexelPerfect和Minimum Height, Maximum Height
[size=14.399999618530273px]这个组合主要用于我们期望所有的UI纹理都“尽量”不进行缩放,所谓“尽量”的程度,则是取决于Minimum Height和Maximum Height,Minimum Height表示当设备分别率小于此设置值时,根据此设置值对UIRoot进行缩放;Maximum Height表示当设备分辨率大于此设置值时,根据此设置值对UIRoot进行缩放(UIRoot是UI游戏对象树的根,修改UIRoot的缩放,则会影响整棵UI树的缩放)
[size=14.399999618530273px](2)FixedSize和Manul Height
[size=14.399999618530273px]这个组合主要用于我们期望所有的UI纹理都进行“合适”的缩放,所谓“合适”缩放的原则,则是根据Manual Height设置值,当设备分辨率的高度值不同于此设置值时,则根据其比例(即Manual Height / Screen Height)对整棵UI树的进行“等比”缩放(宽度的缩放比也是此比例值),这样,我们就可以做一套资源,在不同尺寸的分辨率最好的“不变形”的适配了
[size=14.399999618530273px](3)交集
[size=14.399999618530273px]前面两组在什么情况下等同呢?
[size=14.399999618530273px]Manual Height == Minimum Height == Maximum Height
[size=14.399999618530273px]推导过程,呵呵~~
[size=14.399999618530273px]具体可参考UIRoot中activeHeight属性和GetPixelSizeAdjustment的计算过程
[size=14.399999618530273px]4.这也许并不够
[size=14.399999618530273px]基于以上推到,当我们以1024x768为标准分辨率做一套UI资源(也就是选择FixedSize并且Manual Height=768),似乎可以满足百分之90以上的机型了,而为什么是1024x768呢?
[size=14.399999618530273px]既然我们已经容忍在除1024x768之外的其他设备上进行等比缩放了,那为什么不是960x640呢?
[size=14.399999618530273px]计算一下1024x768的宽高比=1.33,960x640的宽高比=1.5,这就是移动设备的分辨率比例的全部了吗?
[size=14.399999618530273px]当然不是,iphone5的比例就要大于1.5,还有各种奇葩的android设备呢,比如夏新的n828就是960x540,宽高比=1.78
[size=14.399999618530273px]那为什么以1024x768为标准呢?
[size=14.399999618530273px]因为1.33的宽高比,当我们的1024x768的资源到960x640的设备上时会有什么现象?
[size=14.399999618530273px]根据Manual Height / Screen Height的比例可知,我们需要缩放768 / 640 = 1.2倍,假设是一张1024x768的纹理,高度缩放1.2倍变为了640,宽度也要相应缩放1.2倍变为853(保证等比缩放不变形),也就是说1024x768的资源放到960x640上反而两边有了黑边,这是我们可以容忍的,我们可以做一个很大的背景或者拉伸,保证UI组件不变形即可,很多游戏都是这么做的,比如植物大战僵尸在iphone5和ipad上看到的背景视野并不一样大!
[size=14.399999618530273px]当放到夏新的机器上呢?
[size=14.399999618530273px]我们需要缩放768 / 540 = 1.4倍,宽度1024 / 1.4 = 731,这是可以的,只是看起来更怪一些,因为两边的黑边相对比例更大了(960 - 731=229的黑边区域)
[size=14.399999618530273px]而我表示android机器的分辨率奇葩到只有想不到,没有做不到的程度,也许宽高比1.7并不是终点,当遇到1.8之后,黑边的相对比例会更大。。。
[size=14.399999618530273px]5.问题又来了
[size=14.399999618530273px]假设我们的游戏类型更适合iphone手机玩,不太适合ipad,所以我希望能以960x640为标准做一套资源,可以吗?
[size=14.399999618530273px]我只能说不太可以,因为你要在设计UI组件的大小做限制了,为什么需要做限制?
[size=14.399999618530273px]假设我有一张纹理是960x640大小的,在iphone上铺满整屏,根据我们的设置(FixedSize和Manual Height=640),拿到1024x768的分辨率上,高度640 / 768 = 0.83,为了保证等比缩放,宽度960 / 0.83 = 1156,不幸的事情发生了,1156 > 1024,这个UI组件宽度超过了屏幕的宽度,被裁剪了。。。这是我们不能容忍的,或许你可以说我们尽量不做这种尺寸的UI,OK,你可以对UI尺寸加限制,但是当面对android那些奇葩的分辨率的时候,你会发现限制越来越大,这也许会让美术和策划疯掉!
[size=14.399999618530273px]6.解决方案
[size=14.399999618530273px]当我们花上一些时间去观察现在移动设备的分辨率时,虽然奇葩很多,但是还是有一些规律的,规律的在于宽高比而不在于具体尺寸,大体上划分一下宽高比在1.3,1.5,1.7的范围上的居多(基本是全部吧!)即便是再有1.2,1.8的比例也无妨。。。
[size=14.399999618530273px]NGUI为我们提供的方案只有以各种高度为衡量标准是不够的,我们应该加上一种以宽度为衡量标准的缩放类型
[size=14.399999618530273px]而对于UI资源的标准,我们选取960x640,宽高比为1.5
[size=14.399999618530273px]这样,当我们在兼容大于1.5的尺寸的时候,使用NGUI的现有方案;当我们在兼容小于1.5的尺寸的时候,使用以宽度为衡量标准
[size=14.399999618530273px]也就是说有一个类似Manual Width的属性,当小于1.5时,我们使用Manual Width / Screen Width得出整棵UI树的缩放比例!
[size=14.399999618530273px]这样做的好处是“黑边”区域不会太大,并且不需要对UI组件的大小做限制!
[size=14.399999618530273px]
[size=14.399999618530273px]from: http://blog.csdn.net/kepoon/article/details/16902021
如果你还有什么不懂的,可以百度搜下:编程回忆录,他们现在正在录制这方面的教程,都是零基础开始,由浅入深。
推荐律师服务:
若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询