您的位置:首页 > 产品设计 > UI/UE

游戏开发之UGUI搭建UI界面

2017-08-27 19:12 183 查看

            游戏开发之UGUI搭建UI界面

UGUI呢是Unity团队开发的unity软件里自己的GUI系统,其实呢,最早许多使用unity的公司很多并不是使用UGUI的,而是使用的NGUI,因为NGUI可能会更加方便,功能更强一点,渲染也比UGUI强一点吧,后来呢,随着Unity公司的壮大,Unity公司把这个NGUI的开发CTO从NGUI公司挖过来了,所以现在的UGUI设计者呢就是这个NGUI的领头羊,好了闲话就不多说,感兴趣的童鞋可以自己去了解历史。今天呢,我把我是用UGUI的一些经验分享一下。UGUI的控件介绍我就不一一介绍了,大家想学习的话,网上都有相应的学习视频,比如SIKI学院,游戏蛮牛都有提供的。
那么在做界面之前呢,大家首先要把发布的平台给定了,因为每个平台的分辨率是不一样的,因为我本人就吃过没设置好分辨率的亏,导致呢,在我发布的平台上呢,UI界面很不美观,所以呢,在最开始的使用一定要先设置分辨率,对应在unity里的Game视图中的左上角位置,那么我把分辨率的设置步骤通过截图演示一下:


      


     


     


         
点完加号之后呢,有两个选项 1.Aspect Radio根据屏幕的宽高比进行设置的,2.Fixed Resoulution
是根据屏幕的分辨率进行设置的。
设置好分辨率之后,有待解决的另一个问题是:调整屏幕的自适应,这个呢,就对应的UGUI的每个控件都有的属性,汉语称锚点,
对应的是在UI中的这个图标:



我们用鼠标点击控件在Inspecter面板上的这个组件

              



 
会弹出一个九宫格的图标

        



 
按住shift键选中九宫格中的某个位置+鼠标左键 是设置锚点在屏幕中的位置;
按住 alt键选中九宫格中的某个位置+鼠标左键 是设置当前对应的UI控件在屏幕中位置。
然后调整控件在屏幕中的位置,当屏幕不改变分辨率的情况下,拉伸屏幕不会改变控件到锚点的位置,也就是控件距离锚点的宽高距离不会改变。通过对每个控件设置相应的锚点,这也就解决了屏幕的自适应性性问题。
还有一个需要注意的问题呢就是Canvas的设置,Canvas汉译为幕布的意思,每个UI控件都是它的子物体,那么它在Inspecter面板呢有个组件Canvas,这个组件呢,有一系列的属性:

         


RenderMode:
将这个属性选为Screen Space-Camera,接下来呢这个组件会弹出一个属性:Render Camera,然后我们就可以往这个里面拖一个我们自己创建的Camera
,这个摄像机呢专门负责向Game视图投射UI层的物体,所以呢,对于这个Camera物体的Camera组件,把它的Culling
Mask设为UI层,如果要让一个角色模型或者其他的3d物体出现在Game视图中呢,把相应的物体的Layer也设为UI,还需要调整Camera组件的Projection属性,将其模式设为为Orthographic,Projection属性有两个选择属性,一个是透视Perspective,Game视图中的物体会随着相机Camera距离Canvas的距离而变化,另一个是Orthographic,在这个模式下,Game视图中出现的东西不会随着相机Camera距离Canvas的距离而变化。
 这次总结了UGUI搭建界面的三个注意事项,关于NGUI的注意事项,往后会抽时间写的,关于draw call和NGUI图集的关系,会抽时间整理的。
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: