【Unity】8.2 GUI Style和GUISkin

分類：Unity、C#、VS2015

建立日期：2016-04-27

1、自定義GUI Control

功能控件 (Functional Control) 是遊戲必要的，而這些控件的外觀對遊戲的美感很是重要。在 UnityGUI 中，能夠微調控件 (Control) 外觀的不少細節。

默認狀況下，當你在未定義 GUIStyle 時建立一個控件 (Control)，將應用 Unity 的默認 GUIStyle。這種樣式內置於 Unity 中，且可用於對已發佈的遊戲進行快速原型設計，你也能夠選擇不對控件 (Control) 進行樣式化。

若是你要處理大量不一樣的 GUIStyles，能夠在單個 GUISkin 中定義全部 GUIStyles。GUISkin 不單單只是 GUIStyles 的集合。

2、樣式 (Style) 如何改變「GUI 控件」(GUI Control) 的外觀

GUIStyles 模仿網頁瀏覽器的層疊樣式表 (CSS)。不少 CSS 方法獲得調整，包括樣式的個體狀態屬性的差別化和內容與外觀的分離。

其中，控件 (Control) 定義內容，而樣式 (Style) 定義外觀。這樣你就能夠建立組合，好比看起來像常規 按鈕 (Button) 的功能切換鍵 (Toggle)。

3、皮膚 (Skin) 與樣式 (Style) 的區別

如上文所述，GUISkins 爲 GUIStyles 的集合。樣式 (Style) 定義 GUI 控件 (GUI Control) 的外觀。若是您要使用樣式 (Style)，也能夠不使用皮膚 (Skin)。

一、處理樣式 (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");
    }
}

二、建立一個公共變量 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);
    }
}

三、改變不一樣的樣式元素

當你已聲明瞭 GUIStyle，就能夠在「檢視器」 (Inspector) 中修改此樣式。檢視器中有大量的狀態 (State) 進行定義，並將其應用到任何類型的控件中。

注意：在應用指定的文本顏色 (Text Color) 以前，必須爲每一個控件狀態 (Control State) 分配背景 (Background) 顏色。

4、處理皮膚 (Skins)

Unity默認的控件外觀比較簡單。在遊戲開發過程當中，開發者都會根據遊戲的類型和內容來沒計一套個性化的遊戲界面。在Unity中，能夠經過配置GUISkin來更改控件的默認樣式，從而製做出符合遊戲風格的控件外觀。

GUISkin含有多種不一樣的樣式 (Styles)，基本上可徹底更新全部 GUI 控件 (GUI Control) 的外觀設計。

一、建立一個新的 GUISkin

要建立一個 GUISkin，請從菜單欄選擇資源 (Assets)->建立 (Create)->GUI 皮膚 (GUI Skin) 這將在您的「工程文件夾」(Project Folder) 裏面建立一個新的「GUI 皮膚」(GUI Skin)。選擇 GUI 皮膚可查看「檢視器」(Inspector) 中的皮膚 (Skin) 定義的全部 GUIStyles。

二、將皮膚應用到 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");
    }
}

三、示例

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),"自定義按鈕");

}

按【播放】按鈕，就會看到下面的效果：