UI开发核心问题-UI随屏幕自适应

最新推荐文章于 2024-09-21 10:52:49 发布

weixin_30633949

最新推荐文章于 2024-09-21 10:52:49 发布

阅读量155

点赞数

文章标签： ui 游戏

原文链接：http://www.cnblogs.com/-soy/p/5878309.html

版权

屏幕分辨率对UI适配的影响

　　一般来说，UIRoot都会选择FixSize的缩放模式，这样可以让UI随着分辨率而自动缩放，保持和屏幕相对的大小比例不变，让UI整体看上去不会有变大变小的奇怪现象。但是，还有另一个真正严重的问题：不同屏幕的宽高比不一样。

　　在Unity中，不同屏幕的宽高比，一般都会以高度为基准而拉伸宽度。

　　切换屏幕比例模式的方法为在Game视图中的屏幕比例菜单，FreeAspect为不限长宽比，可以在其中选择想要的长宽比。

　　如果屏幕比例菜单中没有想要的屏幕比例，可以单击菜单最底部那个小较好按钮，会弹出一个让自定义一个新的屏幕比例模式的界面，Label选项中，可以输入一个名称来为这个自定义的屏幕比例命名。在Type中可以选择FixedResolution和Aspect Ratio两个选项，如果选择FixedResolution，可以在下面的Width&Height中输入分辨率的宽和高的具体像素；如果选择Aspect Ratio，可以在下面的Width&Height中输入分辨率的宽高比。设定好之后单击OK按钮，即可保存这个自定义的屏幕分辨率模式。

　　因为NGUI的UIRoot具备FixSize模式，所以，一般在进行UI随屏幕自适应时，主要着重解决的是屏幕宽高比发生变化之后的自适应。

主流设备的屏幕分辨率

　　不论是PC设备还是移动设备，屏幕分辨率一般处于4:3到16:9之间，一般来说，只需要考虑这两个值作为极限值即可。

自适应核心组件Anchor的使用

　　所谓Anchor，即为锚点，它的工作原理是它会自动地绑定摄像机的某一个点作为锚点，锚点一共有上左、上、上右、左、中、右、左下、下、右下9个点可以设定。当相机变动时，Anchor组件所在的物体位置也会跟随相机的变动而变动，并始终处于相机边界的锚点位置。

　　Anchor的创建方式，在Unity顶部NGUI菜单中选择Create->Anchor即可。

　　Anchor组件的设置：

　　　　UICamera选项自动锁定了该Anchor所在的UI的摄像机，它将会绑定这个摄像机边缘上的某一个点作为锚点。Container即为包含的物体，一般情况下无需设置，因为将物体放置于Anchor的子物体中，就可以利用“子物体跟随父物体”实现跟随Anchor的锚点。

　　　　Side一项为核心项，选择该Anchor的脑电，一共9个点，分别对应相机边缘的上左、上、上右、左、中、右、左下、下、右下。

　　　　RunOnlyOnce意为执行一次，即只在开始的时候进行一次适配，默认为勾选上，一把把不需要去修改它。

　　　　RelativeOffset，这是Anchor的相对位置偏移，百分比形式的。

　　　　PixelOffset，像素偏移，Anchor会相对于相机边缘上的锚点以像素为单位进行偏移。