NGUI第二课--创建简单的登录界面

一、创建登录背景——Sprite 介绍

在创建登录背景时，我们可以使用 Sprite。当然，大家也可以像在第一课中那样，在 Widget Tool 里创建 Sprite。

1. UISprite 脚本

在 Sprite 的 Inspector 面板中，我们可以看到 UISprite 脚本。其中，atlas 选项在前面的课程已经介绍过。点击 Sprite 可以进入 Atlas 选择相应的 Sprite，这里我选择了 [具体选择的 Sprite 内容，原文未提及，可补充]。

2. Type 属性

首先介绍 Type 属性：

• 如果图标较小，需要平铺很大且不想重复，可选择 sliced 模式。这里我选择了 simple 模式。
• UISprite 的 Type 选项中，前三种选项功能大致相同。而第四种选项下包含了三个特殊属性：
• Fill Dir（填充方向）：用于指定填充的方向，例如水平、垂直等。
• FillAmount（填充量）：控制填充的比例。
• Invert Fill（反转填充）：对填充效果进行反转。 大家可以自行试验不同设置下的效果，以了解它们的具体作用。

3. Widget 属性

接下来是 Widget 相关属性：

• Pivot：表示 Sprite 的中心点。
• Depth：代表层的深度，用于控制 Sprite 在界面中的显示层次。
• Size：即 Sprite 的大小。在 Size 后面有一个 snap 按钮，点击它后，图片会显示为实际图片大小。
• 关于 Anchor 属性，将在下一个教程中详细介绍。

二、创建 Label

现在，我们来创建用于显示名称和密码提示的 Label。

1. 字体选择

在 Label 的 Inspector 面板中，我们可以在 font 选项中选择所需的字体。需要注意的是，Unity 对中文的支持相对复杂，需要使用特定字体。目前我们先使用英文字体，后续会专门介绍如何添加中文字体。

2. Overflow 参数

Overflow 有 4 个参数，其具体含义如下：

• shrinkContent：表示方框不缩放，但会自动缩放字体以适应内容。
• clampContent：意味着方框和字体都不会缩小，当输入的字体超过方框范围时，超出部分将无法显示。
• ResizeFreely：表示方框会根据字体的大小和长度自适应调整。
• 第四个参数大家可以自行体验其效果。

3. 其他属性

• gradient：这个属性我个人使用较少，大家可以进一步探索其功能。
• Effect：用于设置字体效果，目前有阴影（shadow）和描边（outline）两种效果可供选择。
• spacing：控制字体之间的间距。
• maxLines：设置 Label 显示的最大行数。
• color Tint：用于调整字体的颜色。

至此，我们已经完成了 Sprite 背景和 Label 标签的创建。接下来，我们将制作输入框 Input。