【Unity】8.2 GUI Style和GUISkin

分类：Unity、C#、VS2015

创建日期：2016-04-27

一、自定义GUI Control

功能控件 (Functional Control) 是游戏必要的，而这些控件的外观对游戏的美感非常重要。在 UnityGUI 中，可以微调控件 (Control) 外观的很多细节。

默认情况下，当你在未定义 GUIStyle 时创建一个控件 (Control)，将应用 Unity 的默认 GUIStyle。这种样式内置于 Unity 中，且可用于对已发布的游戏进行快速原型设计，你也可以选择不对控件 (Control) 进行样式化。

如果你要处理大量不同的 GUIStyles，可以在单个 GUISkin 中定义所有 GUIStyles。GUISkin 不仅仅只是 GUIStyles 的集合。

二、样式 (Style) 如何改变“GUI 控件”(GUI Control) 的外观

GUIStyles 模仿网页浏览器的层叠样式表 (CSS)。很多 CSS 方法得到调整，包括样式的个体状态属性的差异化和内容与外观的分离。

其中，控件 (Control) 定义内容，而样式 (Style) 定义外观。这样你就可以创建组合，比如看起来像常规按钮 (Button) 的功能切换键 (Toggle)。

三、皮肤 (Skin) 与样式 (Style) 的区别

如上文所述，GUISkins 为 GUIStyles 的集合。样式 (Style) 定义 GUI 控件 (GUI Control) 的外观。如果您要使用样式 (Style)，也可以不使用皮肤 (Skin)。

1、处理样式 (Style)

所有“GUI 控件”(GUI Control) 都具有一个可选的最后参数：用于显示控件的 GUIStyle。如果将其忽略，则使用 Unity 的默认 GUIStyle。样式处理通过将控件类型名称作为字符串应用而在内部进行，因此 GUI.Button() 使用 "按钮" 样式，GUI.Toggle() 使用 "toggle" 样式，等等。但您可以通过将控件的默认 GUIStyle 指定为最后参数来覆盖默认 GUIStyle。

using UnityEngine;

using System.Collections;

public class GUITest : MonoBehaviour {

    void OnGUI () {

        // 创建使用 "框" GUIStyle 的标签

        GUI.Label (new Rect (0,0,200,100), "Hi - I'm a label looking like a box", "box");

        // 创建使用"“切换键" GUIStyle 的按钮

        GUI.Button (new Rect (10,140,180,20), "This is a button", "toggle");

    }

}

2、创建一个公共变量 GUIStyle

当你声明一个公共 GUIStyle 变量时，该样式 (Style) 的所有元素都将在检视器 (Inspector)中显示。您可以在此编辑所有不同的值：

using UnityEngine;

using System.Collections;

public class GUITest : MonoBehaviour {

    public GUIStyle customButton;

    void OnGUI () {

        // 创建按钮。提交以上定义的 GUIStyle 作为使用的样式

        GUI.Button (new Rect (10,10,150,20), "I am a Custom Button", customButton);

    }

}

3、改变不同的样式元素

当你已声明了 GUIStyle，就可以在“检视器” (Inspector) 中修改此样式。检视器中有大量的状态 (State) 进行定义，并将其应用到任何类型的控件中。

注意：在应用指定的文本颜色 (Text Color) 之前，必须为每个控件状态 (Control State) 分配背景 (Background) 颜色。

四、处理皮肤 (Skins)

Unity默认的控件外观比较简单。在游戏开发过程中，开发者都会根据游戏的类型和内容来没计一套个性化的游戏界面。在Unity中，可以通过配置GUISkin来更改控件的默认样式，从而制作出符合游戏风格的控件外观。

GUISkin含有多种不同的样式 (Styles)，基本上可完全更新所有 GUI 控件 (GUI Control) 的外观设计。

1、创建一个新的 GUISkin

要创建一个 GUISkin，请从菜单栏选择资源 (Assets)->创建 (Create)->GUI 皮肤 (GUI Skin) 这将在您的“工程文件夹”(Project Folder) 里面创建一个新的“GUI 皮肤”(GUI Skin)。选择 GUI 皮肤可查看“检视器”(Inspector) 中的皮肤 (Skin) 定义的所有 GUIStyles。

2、将皮肤应用到 GUI

要使用创建的皮肤，请将其分配到 OnGUI() 函数中的 GUI.skin：

using UnityEngine;

using System.Collections;

public class GUITest : MonoBehaviour {

    public GUISkin mySkin;

    void OnGUI () {

        // 将该皮肤分配为当前所用的皮肤。

        GUI.skin = mySkin;

        // 创建按钮。这将从分配到 mySkin 的皮肤获得默认的“按钮”样式。

        GUI.Button (new Rect (10,10,150,20), "Skinned Button");

    }

}

这样一来，通过一次 OnGUI() 调用就可随意切换皮肤：

using UnityEngine;

using System.Collections;

public class GUITest : MonoBehaviour {

    public GUISkin mySkin;

    private bool toggle = true;

    void OnGUI () {

        // 将该皮肤分配为当前所用的皮肤

        GUI.skin = mySkin;

        // 创建切换键。这将从分配到 mySkin 的皮肤获得“按钮”样式。

        toggle = GUI.Toggle (new Rect (10,10,150,20), toggle, "Skinned Button", "button");

        // 将当前皮肤分配到 Unity 的默认皮肤

        GUI.skin = null;

        // 创建按钮。这将从内置皮肤获得默认的“按钮”样式。

        GUI.Button (new Rect (10,35,150,20), "Built-in Button");

    }

}

3、示例

GUISkin在使用前需要先创建和配置。创建方法是在Project视图的上方单击Create按钮，在弹出菜单中单击GUISkin选项。另一种办法是打开菜单栏中的【Assets】->【Create】->【GUISkin】来创建。

新建的GUISkin文件会显示在Project视图中，单击GUISkin文件，在Inspector视图中可设置其参数。

在一个GUISkin中，可对所有GUI控件的样式进行设置，例如Button、Toggle等。

下面以Button为例，说明如何通过GUISkin设置其样式。

假设现在需要更换按钮的背景图片，以及设置按钮上的字体为楷体，可先制作下面的图片素材：

首先把按钮的背景图和字体文件放入Project的Assets下，然后查看GUISkin的检视器视图，单击【Button】折叠项，展开Button的样式参数，更改Normal、Hover、Active、On Normal、OnHover、On Active、Font、Font Size这几个参数。

现在可以试试修改后的效果。在CUI脚本中声明一个类型为CUISkin的变量，在Inspector视图中将该变量的值没置为刚修改好的CUISkin文件。

在绘制控件代码前将变量赋值给CUI.skin参数，则控件就会以用户配置的GUISkin样式来绘制，示例代码如下：

public GUISkin myGUISkin;

void OnGUI()

{

GUI.skin=myGUISkin;

GUI.Button(Rect(60,50,240,60),"自定义按钮");

}

按【播放】按钮，就会看到下面的效果：