4.4 制作UI

首先创建塔防游戏的UI界面。

步骤 01 在本书资源文件目录rawdata/td/GUI/中存放了所有的UI图片，导入图片后，注意将Texture Type设为Sprite类型，如图4-7所示。Unity的UI系统只能使用Sprite类型的图片。

步骤 02 创建几个UI文字控件。在Hierarchy窗口中单击鼠标右键，选择【UI】→【Text】创建文字，在创建文字物体的同时，还会自动创建Canvas和EventSystem物体。Canvas会自动作为文字控件的父物体，所有的UI控件都需要放到Canvas层级下。EventSystem物体上有很多UI事件脚本，用来管理和响应UI事件，如图4-8所示。

步骤 03 设置文字的位置。在编辑器的上方单击UI编辑按钮，然后选择文字控件即可改变文字的位置和尺寸，如图4-9所示。

步骤 04 在不同的分辨率下对齐UI的位置一直是件很麻烦的事情，不过使用Unity的新UI系统，一切将变得非常简单。选择前面创建的文本UI控件，在【Inspector】窗口的Rect Transform中可以快速设置控件的对齐方式，如左对齐、右对齐等，如图4-10所示。

步骤 05 除了对齐，我们还需要根据不同的屏幕分辨率对UI控件进行缩放。将Canvas物体的Canvas Scaler设为Scale With Screen Size模式，UI控件将以设置的分辨率为基础，在不同的分辨率下进行缩放适配，如图4-11所示。

步骤 06 这里一共需要创建三个不同的文字控件，分别用来显示敌人进攻的波数、铜钱和生命值。我们在【Inspector】窗口可以设置文字的内容、字体、大小、颜色等，使用Unity的Rich Text功能，在文本中添加color标记，可以使同一个文字有不同的色彩，如图4-12所示。

步骤 07 现在很多游戏都给文字配上了描边，我们也加一个吧。选择文字，在菜单栏中选择【Component】→【UI】→【Effects】→【Outline】，如图4-13所示。

步骤 08 创建按钮，包括创建防守单位的按钮和重新游戏的按钮。在Hierearchy窗口中单击鼠标右键，选择【UI】→【Button】即可创建一个新的按钮控件，默认按钮下面还有一个文字控件用来显示按钮的名称。在【Inspector】窗口中找到Image组件下的Source Image设置按钮的图片，选择下面的Set Native Size可以使按钮的大小与图片的尺寸快速适配，如图4-14所示。

最后的UI效果如图4-15所示。注意UI控件的名字，我们在后面需要通过名字来查找UI控件。UI控件的层级关系也比较重要，因为控件均位于Canvas或其他层级之下，所以它们的位置只是相对于父物体的相对位置。如果通过脚本去修改控件的位置，通常是修改transform.localPosition，而不是transform.position。

完成UI设置后，可以将UI保存成Prefab。