很长一段时间被屏幕自适应搞得很晕,这里总结下最近的学习感悟。
首先明白几个概念:
1、屏幕分辨率(手机常用1280*720,800*480等)
2、图片分辨率(图片大小 256 * 256等)
游戏开发时,规定好标准的适配机型,这里机型以1280*720为例,所有制作的图片在1280*720的机型上将没有任何缩放。NGUI的UIRoot可以选择Scaling Type,这里选择FixedSize,此时可以在Manaul Height栏输入标准机型的高度,于是这里输入720,此后的屏幕自适应都将以这个高度来进行等比缩放。假设我们在Panel下创建了一个sprite,摆好位置后,该sprite的位置是<320,180,0>,sprite的大小为100*100。将该UI放入480*320的手机后,sprite的大小会根据当前设备高度进行缩放:
缩放后的sprite大小 = 设备高度/标准分辨率高度 * <sprite宽,sprite高> ,这里缩放后的大小为 : 320/720 * <100,100> = <44.44,44.44>
缩放后的位置 = 设备高度/标准分辨率高度 * <x,y,z> ,这里缩放后的大小为 : 320/720 * <320,180,0> = <142,80,0>
这里就完成了一次屏幕适应。
再举一个例子,如果图片的大小为1280*720,位置为<0,0,0>,在标准分辨率下该图片恰好和屏幕大小相同,将该图片放入480*320的手机后,
缩放后大小 320/720*<1280,720> = <568,320>
缩放后位置 320/720* <0,0,0> = <0,0,0>
屏幕大小为<480,320> ,因此该图片的两边将会被裁减。1280*720的宽高比为1.7:1, 480*320的宽高比为1.5:1,因此基于高度的自适应不适合适配宽高比更小的机型。
要解决这个问题,可以用基于宽度的自适应方式(原理同基于高度缩放一致)。
自适应需要解决的另一个问题是sprite位置自适应的问题,假设一个sprite想要靠在屏幕的最左边,该sprite的大小为100*100,可以将该sprite挂上UIAnchor脚本,container选择UIRoot,Relative offset中选择 x = -0.5 (代表屏幕的最左边,0代表中间,0.5代表最右边),Pixel Offset中 x选择1/2的图片大小,这里为50(代表图片中心距离屏幕边缘恰好为图片的一半,即图片紧贴屏幕边缘),这样设置以后无论怎样缩放,图片的位置都距离屏幕最左边1/2的图片宽度,可以实现图片位置的自适应。