Unity 5.0 GUI解析.docx

1.Unity GUI介绍2.GUI组件2-1.Canvas and UGUI Rendering Order2-2.Anchor and Center 2-3.RectTransform 2-4.Text 2-5.image 2-6.Raw Image and Mask 2-7.Button 2-8.Toggle and Toggle Group 2-9.Slider 2-10.ScrollBar and ScrollRect 2-11.Dropdown 2-12.InputField 2-13.EventSystem 2-14.Selectable 2-15.UI Special Efficacy 3.GUI应用实例3-1.游戏开始界面3-2.游戏菜单界面3-3.角色面板和背包系统3-4.关卡选择界面4.总结Unity GUI介绍在UNITY中使用GUI组件来完成游戏UI的绘制工作。对于一个游戏来说，UI界面是至关重要的一个元素，玩家对于一款游戏的第一印象大多数就来源于这款游戏的UI界面做得如何，虽然游戏的可玩性很重要，但是不可否认UI元素是游戏的第一出面相。所以做好游戏的UI界面也就是意味着你离成功更进一步。除了UNITY自带的GUI系统，我们也可以借助第三方的GUI插件来提高开发效率。例如，ASSET STORE中的第三方GUI插件，数量非常丰富，能够满足各种GUI制作的需求。第三方插件在使用的过程中有可能会存在一些小问题，UNITY内置的GUI系统一般就不会出现类似的问题，但是第三方插件有时候用起来确实更加方便一些，有利也有弊，如有需要的开发者可以在资源商店自行购买相关插件，以便提高开发效率。2.GUI组件2-1.Canvas以及UGUI渲染顺序Canvas的Render Mode有三种模式，分别是Overlay,Camere,World Space第一种模式的情况下，这个模式将UI元素放到场景的最上面渲染。如果屏幕缩放或改变了分辨率，Canvas会自动改变尺寸去匹配第二种模式下，这个和Screen Space - Overlay模式类似，但在这个渲染模式下，Canvas是被放在一个指定摄像机前面一定的距离上。UI元素是被这个摄像机渲染的，也就意味着摄像机相关的设置会影响UI的显示。如果摄像机设置为透视模式，UI元素就会渲染为透视，而透视后的扭曲程度由摄像机的视域决定。如果屏幕改变了大小或者改变了分辨率，或者摄像机的视景体改变了，Canvas都会自动改变尺寸去匹配第三种模式的情况下,这种渲染模式会将Canvas当作场景中任何的其它对象一样对待。Canvas的尺寸可以用Rect Transform进行手动调整，UI元素的遮挡效果由3D位置决定。对于需要将UI作为场景中的一部分或者作为剧情化界面的情况非常有用下面来介绍一下，UGUI的渲染顺序从上面的例子可以很直观地看出，后被添加的UI元素最优先显示在窗口上，如果想要改变显示顺序，只需要调换两个组件的名字即可。2-2.锚点和中心点如图所示，屏幕中间的花瓣形状图标就是锚点，图片中间的蓝圈就是中心点。白色的边框对应的就是Game视图。先来说一下锚点的作用：拖动其中一个花瓣，除了对角花瓣以外的花瓣位置就可以被改变锚点的其中一个作用就是使得图片4个角到对应锚点的距离不会改变，无论怎么拖动视图，图片大小会被改变，但是锚点与顶点之间的距离是不会被改变的。还有另一个约束就是，锚点到画布4条边的距离百分比不会改变，如下所示：如果没有锚点的约束，那么有可能你的游戏会跑到视图外边，这样会导致重要控件的丢失，再比如说，如果需要设置一个游戏背景图片，那么就必须要将图片的四个角和四个锚点分别重合，这样，无论你怎么改变屏幕大小，背景图片都会自适应屏幕大小。所以说，锚点是不可或缺的组件。再来说一下中心点的作用：中心点是适应图片大小，不是屏幕大小。图片左下角是坐标（0,0），右上角是（1,1）。图片的旋转和缩放就是自适应你的中心点。可以根据自己的需求，设置中心点再根据该点对图片进行相关操作。2-3.RectTransform组件我们可以发现几乎每个UI元素都自带RectTransform组件，由此我们可以看出这个组件的重要性。下面就来介绍一下这个组件的一些属性。新建一个UI组件的时候，锚点是合在一起的，与中心点重合，在这种情况下，如果想要移动UI位置，改变UI大小只要相应改变参数即可，此时的位置和大小信息如下所示：但是，一但改变锚点位置。那么面板显示会发生变化，如下：此时left就是25.95，意思就是UI的左边界距离左边两个锚点连线的距离，其他方向也是同理，这里的属性面板改变很容易被我们忽略，一定要注意。下面主要来介绍一下这个面板这是一个锚点的