NGUI第四课--Progress Bar，Slider的介绍与Atlas图集的创建

今天这节课将为大家详细讲解 Progress Bar 和 Slider，同时介绍 Atlas 图集的创建方法。

Progress Bar 与 Slider 的对比

通过对比参数，我们可以发现 Progress Bar 和 Slider 的显著区别在于 Slider 多了一个 Thumb 选项。这里的 Thumb 指的是在拖动操作时用于点击的按钮。

从相关图示（原文提到的 4 副图）中，我们能清晰地看到两者的区别。关于具体的添加方法，在前面的课程中已经详细讲解过，这里不再赘述。接下来，我们重点看看两者在 Inspector 面板上的区别。

Empty 和 Full 选项分别对应前景和背景的 Sprite，相信大家对此已经比较熟悉。下面是 Progress Bar 和 Slider 根节点的参数对比：

下面对一些重要参数进行详细解释：

• Value：表示当前值。
• Steps：可以理解为将最大值等分的份数。
• Foreground：前景 Sprite。
• Thumb：只有 UISlider 有，ProgressBar 没有。
• Direction：表示方向。

编写脚本改变 Slider 的 Value 值

现在，我们创建一个脚本来改变 Slider 的 Value 值。创建 SliderControl.cs 脚本，并将其挂载到 UI Root 上。脚本代码如下：

using UnityEngine;
using System.Collections;

/// <summary>
/// 说明：此例子较为简单，只需获取到 UISlider 并改变其 Value 属性即可。
/// 本例子通过两种方式获取 Progress Bar 和 Slider 的 UISlider。（记得将 Progress Bar 控件赋予相应变量）
/// </summary>
public class SliderControl : MonoBehaviour {
public UISlider progressBar;
private UISlider slider;

void Start () {
slider = GameObject.Find("Slider").GetComponent<UISlider>();
progressBar.value = 1;
slider.value = 1;
}

void Update () {
progressBar.value -= 0.01f;
slider.value -= 0.02f;

if (progressBar.value <= 0)
progressBar.value = 1;

if (slider.value <= 0)
slider.value = 1;
}
}

Atlas 图集的创建

创建 Atlas 图集的步骤

1. 首先，选择几张图片放入 assets 文件夹中。这里我们放入了几张 bar 的图片。选中这些图片后，在右侧将图片格式改为 GUI 格式，然后点击下方的 Apply 按钮。
2. 再次选中图片，在菜单栏中选择 Atlas Maker。
3. 此时，默认会将图片放入已有的图集。这里我们不采用这种方式，而是选择右边的 New 选项，新建一个图集。之后会出现相应的界面，我们可以看到选中的图片都显示在 Sprites 下方。点击 Create 按钮，将 Atlas 图集保存到指定文件夹，此时会生成 3 个文件。至此，Atlas 图集创建完成。

向图集添加图片的方法

如果想要向图集添加图片，操作很简单。只需选中要添加的图片，然后选择 NGUI -> Open -> Atlas Maker，在 Atlas Maker 面板上选择对应的 Atlas，点击 Update 按钮，即可将所需图片添加到图集中。

以上就是关于 Progress Bar、Slider 的介绍以及 Atlas 图集创建的全部内容。