Unity50GUI分析.docxVIP

1.Unity GUI介绍 2.GUI组件 2-1.Canvas and UGUI Rendering Order 2-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的左边界距离左边两个锚点连线的距离，其