4.1 圖形用戶界面組件

開發過程中，經常會用到圖形用戶界面組件，因為，在一個項目中一般少不了按鈕、文本框、圖片的插入以及滑桿等控件的應用，通過合理地設計可以搭建出優美的圖形用戶界面。所示一般的游戲設置界面和幫助界面都是通過圖形用戶界面組件中的各個控件的合理使用搭建而成的。

在此首先要聲明，圖形用戶界面組件的繪制的位置是通過坐標定位的，這里以屏幕左上角的坐標位置為（0,0），屏幕右下角的位置為（Screen.Width,Screen.Heigth），并且坐標的單位為像素進行開發的。

4.1.1 圖形用戶界面組件的變量

Unity 提供了豐富的圖形用戶界面組件變量，通過這些變量，可以在整體上對圖形用戶界面組件做相應的設置，從而實現特定的開發需求。下面將對圖形用戶界面的部分組件的常用變量進行詳細的介紹，具體的變量信息如表4-1所示。

表4-1 圖形用戶界面組件的變量

1．Skin皮膚

Skin變量是在總體上對使用的皮膚風格進行設置，在開發過程中可以通過改變Skin的總體風格來改變圖形用戶界面的風格，如果讀者將其設置為NULL，皮膚將會恢復到默認的統一的皮膚。具體使用如下面的代碼片段所示。

代碼位置：見隨書光盤中源代碼/第04章目錄下的 GUI/Assets/變量 JavaScript / Skin.js。

1　var s1 : GUISkin[];　　　　　　//聲明一個GUISkin數組

2　private var hSliderValue : float = 0.0;　//聲明私有變量hSliderValue

3　private var vSliderValue : float = 0.0;　//聲明私有變量vSliderValue

4　private var hSValue : float = 0.0;　　　//聲明私有變量hSValue

5　private var vSValue : float = 0.0;　　　//聲明私有變量vSValue

6　private var cont : int = 0;　　　　//聲明私有計數器cont

7　function Update() {　　　　　　//聲明Update方法

8　　if(Input.GetKeyDown(KeyCode.Space))　　//對鍵值狀態進行判定

9　　　　cont++;　　　　　　　//計數器count自加

10　}

11　function OnGUI() {　　　　　　　//聲明OnGUI方法，用于創建GUI組件

12　　GUI.skin = s1[cont%s1.Length];　　　//確定數組序列

13　　if(s1.Length == 0){　　　　　　//若數組長度等于0

14　　　Debug.LogError("Assign at least 1 skin on the array"); //打印提示信息

15　　　return;

16　　}

17　　GUI.Label (Rect (10, 10, 100, 20), "Hello World!");　　//畫標簽

18　　GUI.Box(Rect(10, 50, 50, 50), "A BOX");　　　　　//畫一個盒子

19　　if (GUI.Button(Rect(10,110,70,30), "A button"))　　　//若單擊按鈕

20　　　Debug.Log("Button has been pressed");　　　　　//打印提示信息

21　　hSliderValue = GUI.HorizontalSlider (Rect (10, 150, 100, 30), hSliderValue, 0.0, 10.0); //畫水平滑桿

22　　vSliderValue = GUI.VerticalSlider (Rect (10, 170, 100, 30), vSliderValue, 10.0,0.0);

//畫垂直滑桿

23　　hSValue = GUI.HorizontalScrollbar (Rect (10, 210, 100, 30), hSValue, 1.0, 0.0, 10.0); //畫水平滾動條

24　　vSValue = GUI.VerticalScrollbar (Rect (10, 230, 100, 30), vSValue, 1.0, 10.0,0.0);//畫垂直滾動條

25　}

將編寫好的腳本掛載到攝像機上，單擊 Unity 集成開發環境的運行按鈕，在游戲預覽面板中就會顯示出所設計的圖形用戶界面，如圖4-1所示。

▲圖4-1 游戲預覽面板中顯示的圖形用戶界面

提示

在此讀者只需在視覺感官上有一個大體的了解和認識，稍后的章節將對每個小圖形用戶界面組件的創建和腳本的掛載進行介紹，使讀者在根本上學會圖形用戶界面組件的應用與場景的合理搭建。

2．color變量

color變量是總體上圖形用戶界面組件的顏色，在開發過程中可以通過設置color的值來改變圖形用戶界面組件的顏色，進而實現開發的具體需求，具體使用如下面的代碼片段所示。

代碼位置：見隨書光盤中源代碼/第04章目錄下的 GUI/Assets/變量JavaScript / color.js。

1　function OnGUI() {　　　　　　　　　　//聲明OnGUI方法

2　　GUI.color = Color.yellow;　　　　　　　//將顏色設置為黃色

3　　GUI.Label (Rect (10, 10, 100, 20), "Hello World!");　//畫一個標簽

4　　GUI.Box(Rect(10, 50, 50, 50), "A BOX");　　　　//畫一個盒子

5　　GUI.Button(Rect(10,110,70,30), "A button");　　　//畫一個按鈕

6　　}

將編寫好的腳本掛載到攝像機上，單擊 Unity 集成開發環境的運行按鈕，在游戲預覽面板中就會顯示出對顏色變量的設置效果，如圖4-2所示。

3．backgroundColor變量

backgroundColor 變量是總體上圖形用戶界面組件的背景顏色，在開發過程中可以通過設置backgroundColor的值來改變圖形用戶界面組件的顏色，進而實現開發的具體需求，具體使用如下面的代碼片段所示。

代碼位置：見隨書光盤中源代碼/第04章目錄下的 GUI/Assets/變量JavaScript / backgroundColor.js。

1　function OnGUI() {　　　　　　　　　　//聲明OnGUI方法

2　　GUI.backgroundColor = Color.yellow;　　　　　//將背景顏色設置為黃色

3　　GUI.Button(Rect(10,10,70,30), "A button");　　　//畫一個按鈕

4　}

將編寫好的腳本掛載到攝像機上，單擊 Unity 集成開發環境的運行按鈕，在游戲預覽面板中就會顯示出對背景顏色變量的設置效果，如圖4-3所示。

▲圖4-2 游戲預覽面板中所顯顏色變量的設置結果

▲圖4-3 背景顏色變量設置結果

4．contentColor變量

contentColor 變量是對圖形用戶界面組件中的文本進行著色，在開發過程中可以通過設置contentColor的值來改變圖形用戶界面組件中文本的顏色，進而實現開發的具體需求，具體使用如下面的代碼片段所示。

代碼位置：見隨書光盤中源代碼/第04章目錄下的 GUI/Assets/變量JavaScript / contentColor.js。

1　function OnGUI() {　　　　　　　　　　//聲明OnGUI方法

2　　GUI.contentColor = Color.yellow;　　　　　　//將文本顏色設置成黃色

3　　GUI.Button(Rect(10,10,70,30), "A button");　　　//畫一個按鈕

4　}

將編寫好的腳本掛載到攝像機上，單擊 Unity 集成開發環境的運行按鈕，在游戲預覽面板中就會顯示出對文本顏色變量的設置效果，如圖4-4所示。

5．changed變量

changed變量是檢測輸入數據是否發生改變，若改變則返回true。在開發過程中可以通過調用changed變量來檢測輸入數據是否發生改變，若改變則返回true，并根據需要執行相應的操作或是打印一些提示信息，具體使用如下面的代碼片段所示。

代碼位置：見隨書光盤中源代碼/第04章目錄下的 GUI/Assets/變量JavaScript / changed.js。

1　varstringToEdit:String="Modifyme.";//聲明一個字符串stringToEdit，并且內容為“Modifyme.”

2　function OnGUI () {　　　　//聲明OnGUI方法

3　　　//繪制一個單行文本編輯框，并將輸入的數據賦給變量stringToEdit

4　　stringToEdit = GUI.TextField (Rect (10, 10, 200, 20), stringToEdit, 25);

5　　if (GUI.changed)　　　　//調用changed變量，檢測輸入數據是否發生改變

6　　　Debug.Log("Text field has changed.");//若檢測到輸入數據發生改變，則打印提示信息

7　}

將編寫好的腳本掛載到攝像機上，單擊 Unity 集成開發環境的運行按鈕，在游戲預覽面板中就會顯示出使用changed變量的效果，如圖4-5所示。若改變文本輸入框內的內容時，在狀態欄內就會顯示出“Text field has changed”的提示信息。

▲圖4-4 文本顏色變量的設置結果

▲圖4-5 changed變量的調用結果

6．enabled變量

enabled 變量是控制圖形用戶界面組件是否被啟用。在開發過程中可以對 enabled 變量的boolean值進行設置，來控制一些圖形用戶界面組件的啟用情況，以達到在開發中所要實現的具體效果，這個是實際開發中經常遇到的問題，具體實現如下面的代碼片段所示。

代碼位置：見隨書光盤中源代碼/第04章目錄下的 GUI/Assets/變量JavaScript / enabled.js。

1　//聲明一個初始值為true的Boolean型變量allOptions

2　var allOptions : boolean = true;

3　//分別聲明初始值為true的Boolean型變量extended1和extended2

4　var extended1 : boolean = true;

5　var extended2 : boolean = true;

6　function OnGUI () {　　　　　　//聲明OnGUI方法

7　　　//在自定義的區域內繪制一個名字為Edit All Options的開關，其初始狀態為allOptions

8　　　allOptions = GUI.Toggle (Rect (0,0,150,20), allOptions, "Edit All Options");

9　　　//將allOptions的值賦給enabled組件

10　　GUI.enabled = allOptions;

11　　// 分別在各個自定義的區域內繪制兩個開關

12　　extended1 = GUI.Toggle (Rect (20,20,130,20), extended1, "Extended Option 1");

13　　extended2 = GUI.Toggle (Rect (20,40,130,20), extended2, "Extended Option 2");

14　　//將enabled組件的值置為true

15　　GUI.enabled = true;

16　　// 在自定義的區域被繪制一個名字為OK的按鈕，并判斷按鈕是否被按下

17　　if (GUI.Button (Rect (0, 60, 150, 20), "Ok"))

18　　　　print ("user clicked ok");　　//若按鈕被按下，則打印提示信息

29　}

將編寫好的腳本掛載到攝像機上，單擊 Unity 集成開發環境的運行按鈕，在游戲預覽面板中就會顯示出使用enabled變量的效果，如圖4-6和圖4-7所示。

▲圖4-6 組件在啟用狀態效果圖

▲圖4-7 組件在禁用狀態效果圖

7．tooltip變量

tooltip變量是提示框變量，即當讀者創建一個GUI組件，讀者就可以傳入一個工具用作提示，這是通過改變內容參數采取一個定制的GUIContent對象，而不僅僅是通過在一個字符串來顯示。這里可以根據開發的實際需要，來制定不同的提示。

下面將用一個鼠標單擊按鈕來顯示提示信息的例子說明tooltip變量的具體應用，具體使用如下面的代碼片段所示。

代碼位置：見隨書光盤中源代碼/第04章目錄下的 GUI/Assets/變量JavaScript / tooltip1.js。

1　function OnGUI () {　　　//聲明OnGUI方法

2　　// 繪制一個按鈕，按鈕的名字設置為Click me，并設置提示信息This is the tooltip

3　　GUI.Button(Rect(10,10,100,20),GUIContent("Clickme","Thisisthetooltip"));

4　　// 繪制一個標簽，并將提示信息賦給標簽

5　　GUI.Label (Rect (10,40,100,40), GUI.tooltip);

6　}

將編寫好的腳本掛載到攝像機上，單擊 Unity 集成開發環境的運行按鈕，在游戲預覽面板中就會顯示出使用tooltip變量的效果，如圖4-8和圖4-9所示。

▲圖4-8 顯示按鈕

▲圖4-9 鼠標觸發提示信息

讀者還可以使用元素的順序，以創建“層次”工具提示，具體使用如下面的代碼片段所示。

代碼位置：見隨書光盤中源代碼/第04章目錄下的 GUI/Assets/變量JavaScript / tooltip2.js。

1　function OnGUI () {//聲明OnGUI方法

2　//在自定義的區域內繪制一個Box，Box中的內容為Box，且提示信息為this box has a tooltip

3　　　GUI.Box (Rect (5, 35, 220, 150), GUIContent ("Box", "this box has a tooltip"));

4　//在自定義的區域內繪制一個名字為No tooltip here的按鈕

6　　　GUI.Button (Rect (10, 90, 200, 20), "No tooltip here");

7　//在自定義的區域內繪制一個按鈕，按鈕的內容為I have a tooltip，且提示信息為The button //overrides the box

9　　　GUI.Button (Rect (10, 120, 200, 20),GUIContent ("I have a tooltip", "The button overrides the box"));

11　//在自定義的區域內繪制一個標簽，標簽顯示的內容為GUI.tooltip提供的信息

13　　GUI.Label (Rect (10,60,200,40), GUI.tooltip);

14　}

將編寫好的腳本掛載到攝像機上，單擊 Unity 集成開發環境的運行按鈕，在游戲預覽面板中就會顯示出使用tooltip變量的效果，如圖4-10和圖4-11所示。

▲圖4-10 提示一

▲圖4-11 提示二

tooltip變量作為工具提示框變量，其還可以用來實現一個OnMouseOver/ OnMouseOut郵件系統，具體使用如下面的代碼片段所示。

代碼位置：見隨書光盤中源代碼/第04章目錄下的 GUI/Assets/變量JavaScript / tooltip3.js。

1　var lastTooltip : String = " ";　　　//聲明一個字符串為空的lastTooltip

2　function OnGUI () {　　　　　　//聲明OnGUI方法

3　　GUILayout.Button (GUIContent ("PlayGame", "Button1"));//通過GUI的布局管理器繪制一個按鈕Button1

4　　GUILayout.Button (GUIContent ("Quit", "Button2"));//通過GUI的布局管理器繪制個按鈕Button2

5　　　if (Event.current.type == EventType.Repaint && GUI.tooltip != lastTooltip){　//對當前事件進行判定

6 if (lastTooltip != "") //若lastTooltip不等于空

7　　　　//若lastTooltip不等于空，則發送消息

8　　　SendMessage (lastTooltip + "OnMouseOut", SendMessageOptions.DontRequire-Receiver);

9 if (GUI.tooltip != "") //若GUI.tooltip不等于空

10 //若GUI.tooltip不等于空，則發送消息

11　　　SendMessage (GUI.tooltip + "OnMouseOver", SendMessageOptions.DontRequire-Receiver);

12　　　lastTooltip = GUI.tooltip;　　//將lastTooltip的值置為GUI.tooltip

13　　} }

14　function Button1OnMouseOver () {　　　//聲明Button1OnMouseOver方法

15　　Debug.Log ("Play game got focus");　//打印提示信息

16　}

17　function Button2OnMouseOut () {　　　//聲明Button2OnMouseOut方法

18　　Debug.Log ("Quit lost focus");　　//打印提示信息

19　}

將編寫好的腳本掛載到攝像機上，單擊 Unity 集成開發環境的運行按鈕，在游戲預覽面板中就會顯示出使用tooltip變量的效果，如圖4-12所示。

8．depth變量

depth 變量是按當前深度排序執行當前圖形用戶界面控件的行為，因此在搭建圖形用戶界面時，在場景中的組件按照 depth 變量的深度排序的，一般情況下在最上面的先執行。這在開發過程中是經常遇到的情況，因此必須學會。

▲圖4-12 郵件系統預覽界面

下面將用兩個按鈕按深度進行排序，并分別執行按鈕的操作，第一個按鈕的具體使用如下面的代碼片段1所示。

代碼位置：見隨書光盤中源代碼/第04章目錄下的 GUI/Assets/變量JavaScript / depth1.js。

1　class depth1 extends MonoBehaviour {　　//聲明一個類depth1，并繼承類MonoBehaviour

2　　static var guiDepth : int = 0;　　//聲明一個初始值為0的靜態整型變量guiDepth

3　　function OnGUI() {　　　　　//聲明OnGUI方法

4　　　GUI.depth = guiDepth;　　　　//將GUI.depth設置為guiDepth

5　　　if(GUI.RepeatButton(Rect(0,0,100,100), "GoBack")) {//繪制一個名字為GoBack 的RepeatButton

6　　　　guiDepth = 1;　　　　　//若持續按下按鈕GoBack，guiDepth變量置為1

7　　　　depth2.guiDepth = 0;　　　//depth2.guiDepth的值置為0

8　　　} } }

第二個按鈕的具體實現如下面的代碼片段2所示。

代碼位置：見隨書光盤中源代碼/第04章目錄下的 GUI/Assets/變量JavaScript / depth2.js。

1　　class depth2 extends MonoBehaviour {　//聲明一個類depth1，并繼承類MonoBehaviour

2　　static var guiDepth : int = 1;　　//聲明一個初始值為1的靜態整型變量guiDepth

3　　function OnGUI() {　　　　　//聲明OnGUI方法

4　　　GUI.depth = guiDepth;　　　　//將GUI.depth設置為guiDepth

5　　　if(GUI.RepeatButton(Rect(50,50,100,100), "GoBack")) {//繪制一個名字為GoBack 的RepeatButton

6　　　　guiDepth = 1;　　　　　//若持續按下按鈕GoBack，guiDepth變量置為1

7　　　　depth1.guiDepth = 0;　　　//depth1.guiDepth的值置為0

8　　　} } }

將編寫好的腳本掛載到攝像機上，單擊 Unity 集成開發環境的運行按鈕，在游戲預覽面板中就會顯示出使用depth變量的效果，如圖4-13所示。

▲圖4-13 depth變量的調用結果

上面介紹的這些變量在項目的開發過程中是經常用到的，需要一起相互配合才能發揮其強大的功能，只有將這些變量在整體上融會貫通才能搭建出具有實際應用價值的圖形用戶界面，才能在實際的項目中得到應用。

4.1.2 圖形用戶界面中的常用控件

Unity 提供了豐富的圖形用戶界面控件，通過這些控件可以搭建出完美的圖形用戶界面，若在這些控件上面添加一些具體的監聽方法即可實現特定的功能，下面就對這些具體的控件進行詳細介紹，具體的控件信息如表4-2所示。

表4-2 圖形用戶界面中的控件

下面將通過真實的代碼片段對各個控件進行詳細介紹，使讀者能夠更加理解各個控件的功能和具體實現的步驟。

1．Label控件

Label 控件是在屏幕上繪制一個文本或者紋理標簽，其方法的聲明可以有很多的方式，具體的方法聲明如表4-3所示。

表4-3 聲明Label控件的方法

在上面的方法聲明中有很多參數，具體的參數以及各個參數的含義如表4-4所示。

表4-4 聲明Label控件使用到的具體參數

用下面的代碼來創建 Label 控件，分別在屏幕上繪制一個文本標簽和一個紋理標簽，具體實現如下面的代碼片段所示。

代碼位置：見隨書光盤中源代碼/第04章目錄下的 GUI/Assets/控件JavaScript / Label.js。

1　var textureToDisplay : Texture2D;　　　　　　//聲明一個紋理圖片

2　function OnGUI () {　　　　　　　　　　//聲明OnGUI方法

3　　GUI.Label (Rect (10, 10, 100, 20), "Hello World!");　//繪制一個文本標簽

4　　　//繪制一個紋理圖片標簽

5　　GUI.Label (Rect (10, 40, textureToDisplay.width, textureToDisplay.height),textureToDisplay);

6　}

將編寫好的腳本掛載到攝像機上，單擊 Unity 集成開發環境的運行按鈕，在游戲預覽面板中就會顯示出Label控件的創建效果，如圖4-14所示。

▲圖4-14 Label控件的創建效果

2．DrawTexture控件

DrawTexture 控件是繪制一個指定的紋理圖片，其方法的聲明一般是靜態的方式，具體的方法聲明如表4-5所示。

表4-5 聲明DrawTexture控件的方法

在上面的方法聲明中有很多參數，具體的參數以及各個參數的含義如表4-6 所示。

表4-6 聲明DrawTexture控件使用到的具體參數

用下面的代碼來創建 DrawTexture 控件，在屏幕上繪制一個紋理圖片，具體實現如下面的代碼片段所示。

代碼位置：見隨書光盤中源代碼/第04章目錄下的 GUI/Assets/控件JavaScript / DrawTexture.js。

1　var aTexture : Texture2D;　　　　　　　　//聲明一個紋理圖片

2　function OnGUI() {　　　　　　　　　　//聲明OnGUI方法

3　　GUI.DrawTexture(Rect(10,10,60,60),aTexture,ScaleMode.ScaleToFit,true,0.0f);//繪制一個紋理圖片

4　}

將編寫好的腳本掛載到攝像機上，單擊 Unity 集成開發環境的運行按鈕，在游戲預覽面板中就會顯示出DrawTexture控件的創建效果，如圖4-15所示。

▲圖4-15 DrawTexture控件的創建效果

3．DrawTextureWithTexCoords控件

DrawTextureWithTexCoords 控件是在一個給定的坐標系內繪制一個紋理圖片，其方法的聲明一般是靜態的方式，具體的方法聲明如表4-7所示。

表4-7 聲明DrawTextureWithTexCoords控件的方法

在上面的方法聲明中有很多參數，具體的參數以及各個參數的含義如表4-8所示。

表4-8 聲明DrawTextureWithTexCoords控件使用到的具體參數

4．Box控件

Box 控件是在自定義的區域內繪制一個圖形化的盒子，其方法的聲明可以有很多的方式，具體的方法聲明如表4-9所示。

表4-9 聲明Box控件的方法

在上面的方法聲明中有很多參數，具體的參數以及各個參數的含義如表4-10所示。

表4-10 聲明Box控件使用到的具體參數

用下面的代碼來創建Box控件，在屏幕上繪制一個圖形化盒子，具體實現如下面的代碼片段所示。

代碼位置：見隨書光盤中源代碼/第04章目錄下的 GUI/Assets/控件JavaScript / Box.js。

1　function OnGUI() {//聲明OnGUI方法

2　　　//在屏幕的自定義范圍內繪制一個內容為This is a titel的Box控件

3　　GUI.Box(Rect(Screen.width/8,　Screen.height/8,Screen.width*3/4,Screen.height*3/4),"This is a title");

4　}

將編寫好的腳本掛載到攝像機上，單擊 Unity 集成開發環境的運行按鈕，在游戲預覽面板中就會顯示出Box控件的創建效果，如圖4-16所示。

5．Button控件

Button控件是繪制一個按鈕，當用戶單擊即會有事件發生。其方法的聲明可以有很多的方式，具體的方法聲明如表4-11所示。

▲圖4-16 Box控件的創建效果

表4-11 聲明Button控件的方法

在上面的方法聲明中有很多參數，具體的參數以及各個參數的含義如表4-12所示。

表4-12 聲明Button控件使用到的具體參數

用下面的代碼來創建Button控件，在屏幕上繪制一個紋理圖片的按鈕和文本按鈕，具體實現如下面的代碼片段所示。

代碼位置：見隨書光盤中源代碼/第04章目錄下的 GUI/Assets/控件JavaScript / Button.js。

1　var btnTexture : Texture2D;　　　　　　//聲明一個2D紋理圖片

2　function OnGUI() {　　　　　　　　//聲明OnGUI方法

3　　if (!btnTexture) {//判斷是否存在紋理圖片

4　　　Debug.LogError("Please assign a texture on the inspector");//若不存在，打印提示消息

5　　　return;

6　　}

7　　if (GUI.Button(Rect(10,10,50,50),btnTexture))//創建一個紋理按鈕，并進行是否執行按鈕操作的判定

8　　　Debug.Log("Clicked the button with an image");//若單擊按鈕，則打印提示信息

9　　if (GUI.Button(Rect(10,70,50,30),"Click"))//創建一個文本按鈕，并進行是否執行按鈕操作的判定

10　　　Debug.Log("Clicked the button with text");　//若單擊按鈕，則打印提示信息

11　}

將編寫好的腳本掛載到攝像機上，單擊 Unity 集成開發環境的運行按鈕，在游戲預覽面板中就會顯示出Button控件的創建效果，如圖4-17所示。

▲圖4-17 Button控件的創建效果

6．RepeatButton控件

RepeatButton 控件是繪制一個按鈕，這個按鈕只有在用戶持續按下時才起作用。其方法的聲明可以有很多方式，具體的方法聲明如表4-13所示。

表4-13 聲明RepeatButton控件的方法

在上面的方法聲明中有很多參數，具體的參數以及各個參數的含義如表4-14所示。

表4-14 聲明RepeatButton控件使用到的具體參數

用下面的代碼來創建RepeatButton控件，在屏幕上繪制一個紋理圖片的按鈕和文本按鈕，具體實現如下面的代碼片段所示。

代碼位置：見隨書光盤中源代碼/第04章目錄下的 GUI/Assets/控件JavaScript / RepeatButton.js。

1　var btnTexture : Texture;　　　　　　　//聲明一個紋理圖片

2　function OnGUI() {　　　　　　　　　//聲明OnGUI方法

3　　if (!btnTexture) {　　　　　　　　//判斷是否存在紋理圖片

4　　　Debug.LogError("Please assign a texture on the inspector");//若不存在，則打印提示信息

5　　　return;

6　　}

7　　if (GUI.RepeatButton(Rect(10,10,50,50),btnTexture))//繪制一個紋理圖片RepeatButton

8　　　Debug.Log("Clicked the button with an image");//若持續按下按鈕，則打印提示信息

9　　if (GUI.RepeatButton(Rect(10,70,50,30),"Click Me"))//繪制一個文本RepeatButton

10　　　Debug.Log("Clicked the button with text");　//若持續按下按鈕，則打印提示信息

11　}

將編寫好的腳本掛載到攝像機上，單擊 Unity 集成開發環境的運行按鈕，在游戲預覽面板中就會顯示出RepeatButton控件的創建效果，如圖4-18所示。

▲圖4-18 RepeatButton控件的創建效果

7．TextField控件

TextField 控件是繪制一個單行文本編輯框，可以在里面編輯一個字符串。其方法的聲明可以有很多的方式，具體的方法聲明如表4-15所示。

表4-15 聲明TextField控件的方法

在上面的方法聲明中有很多參數，具體的參數以及各個參數的含義如表4-16所示。

表4-16 聲明TextField控件使用到的具體參數

用下面的代碼來創建TextField控件，在屏幕上繪制一個單行文本編輯框，具體實現如下面的代碼片段所示。

代碼位置：見隨書光盤中源代碼/第04章目錄下的 GUI/Assets/控件JavaScript / TextField.js。

1　var stringToEdit : String = "Hello World";　　　　//聲明一個字符串

2　function OnGUI () {　　　　　　　　　　//聲明OnGUI方法

3　　stringToEdit = GUI.TextField (Rect (10, 10, 200, 20), stringToEdit, 25);//繪制一個單行文本編輯框

4　}

將編寫好的腳本掛載到攝像機上，單擊Unity集成開發環境的運行按鈕，在游戲預覽面板中就會顯示出TextField控件的創建效果，如圖4-19所示。

▲圖4-19 TextField控件的創建效果

8．PasswordField控件

PasswordField 控件是繪制一個密碼輸入框，用戶可以在里面輸入密碼。其方法的聲明可以有很多的方式，具體的方法聲明如表4-17所示。

表4-17 聲明PasswordField控件的方法

在上面的方法聲明中有很多參數，具體的參數以及各個參數的含義如表4-18所示。

表4-18 聲明PasswordField控件使用到的具體參數

用下面的代碼來創建PasswordField控件，在屏幕上繪制一個密碼編輯框，具體實現如下面的代碼片段所示。

代碼位置：見隨書光盤中源代碼/第04章目錄下的 GUI/Assets/控件JavaScript / Password.js。

1　var passwordToEdit : String = "My Password";　　　//聲明一個字符串

2　function OnGUI () {　　　　　　　　　　//聲明OnGUI方法

3　　//繪制一個密碼編輯框，并設置用*號來屏蔽密碼，且設置密碼編輯框的最大長度為25

4　　passwordToEdit = GUI.PasswordField (Rect (10, 10, 200, 20), passwordToEdit,"*"[0], 25);

5　}

將編寫好的腳本掛載到攝像機上，單擊Unity集成開發環境的運行按鈕，在游戲預覽面板中就會顯示出PasswordField控件的創建效果，如圖4-20所示。

▲圖4-20 PasswordField控件的創建效果

9．TextArea控件

TextArea控件是繪制一個多行文本編輯框，可以在里面編輯一段字符串。其方法的聲明可以有很多的方式，具體的聲明方法如表4-19所示。

表4-19 聲明TextArea控件的方法

在上面的方法聲明中有很多參數，具體的參數以及各個參數的含義如表4-20所示。

表4-20 聲明TextArea控件使用到的具體參數

用下面的代碼來創建TextArea控件，在屏幕上繪制一個多行文本編輯框，具體實現如下面的代碼片段所示。

代碼位置：見隨書光盤中源代碼/第04章目錄下的 GUI/Assets/控件JavaScript / TextArea.js。

1　var stringToEdit : String = "Hello World\nI've got 2 lines...";//聲明一段字符串

2　function OnGUI () {　　　　　　　　　　　//聲明OnGUI方法

3　　//繪制一個多行文本編輯框，并將上面聲明的字符串賦給它，并設置多行文本編輯框的最大長度為200

4　　stringToEdit = GUI.TextArea (Rect (10, 10, 200, 100), stringToEdit, 200);

5　}

將編寫好的腳本掛載到攝像機上，單擊 Unity 集成開發環境的運行按鈕，在游戲預覽面板中就會顯示出TextArea控件的創建效果，如圖4-21所示。

▲圖4-21 TextArea控件的創建效果

10．SetNextControlName控件和GetNameOfFousedControl控件

SetNextControlName 控件是給下一步控制設置事件名字。其方法的聲明一般是靜態的方式，具體的方法聲明如表4-21所示。

表4-21 聲明SetNextControlName控件的方法

GetNameOfFocusedControl 控件是得到當前控制焦點的名字。其方法的聲明一般是靜態的方式，具體的方法聲明如表4-22所示。

表4-22 聲明GetNameOfFousedControl控件的方法

用下面的代碼來創建SetNextControlName和GetNameOfFousedControl控件，可以通過得到當前控制焦點的名字來執行下一步的事件，具體實現如下面的代碼片段所示。

代碼位置：見隨書光盤中源代碼/第04章目錄下的 GUI/Assets/控件JavaScript / SetNextControlName.js。

1　var login : String = "username";　　　//聲明內容為username的字符串login

2　var login2 : String = "no action here";　//聲明內容為no action here的字符串login2

3　function OnGUI () {　　　　　　//聲明OnGUI方法

4　　GUI.SetNextControlName ("user");　　//設置下一個事件的名字為user

5　　login = GUI.TextField (Rect (10,10,130,20), login);　//繪制一個單行文本編輯框

6　　login2 = GUI.TextField (Rect (10,40,130,20), login2);　//繪制一個單行文本編輯框

7　　if (Event.current.Equals (Event.KeyboardEvent ("return")) &&//判斷當前事件是否為鍵盤事件return

8　　GUI.GetNameOfFocusedControl() == "user")　//判斷得到的當事件的名字是否為user

9　　　Debug.Log ("Login");　　　　　//打印提示信息Login

10　　if (GUI.Button (new Rect (150,10,50,20), "Login"))//在自定義的矩形區域內繪制一個按鈕

11　　　Debug.Log ("Login");　　　　　//打印提示信息

12　}

將編寫好的腳本掛載到攝像機上，單擊 Unity 集成開發環境的運行按鈕，在游戲預覽面板中就會顯示出SetNextControlName控件和GetNameOfFousedControl控件的創建效果，如圖4-22所示。

▲圖4-22 SetNextControlName控件的創建效果

11．FocusControl控件

FocusControl控件是在當前焦點處通過鍵盤輸入值。其方法的聲明一般是靜態的方式，具體的方法聲明如表4-23所示。

表4-23 聲明FocusControl控件的方法

用下面的代碼來創建FocusControl控件，可以在當前焦點處通過鍵盤輸入值用來顯示，具體使用如下面的代碼片段所示。

代碼位置：見隨書光盤中源代碼/第04章目錄下的 GUI/Assets/控件JavaScript / FocusControl.js。

1　var username : String = "username";　　//聲明一個內容為username字符串username

2　var pwd : String = "a pwd";　　　　//聲明一個內容為a pwd字符串pwd

3　function OnGUI () {　　　　　　//聲明OnGUI方法

4　　//給下一步控制事件設置名字為MyTextField

5　　GUI.SetNextControlName ("MyTextField");

6　　//繪制一個單行文本編輯框，并將字符串username的內容賦給它

7　　username = GUI.TextField (Rect (10,10,100,20), username);

8　　　//繪制一個單行文本編輯框，并將字符串pwd的內容賦給它

9　　pwd = GUI.TextField (Rect (10,40,100,20), pwd);

10　　// 繪制一個名字為Move Focus的按鈕，并進行按鈕是否被按下操作的判定

11　　if (GUI.Button (Rect (10,70,80,20), "Move Focus"))

12　　　GUI.FocusControl ("MyTextField");　//若按鈕按下，則焦點自動跳轉到MyTextField

13　}

將編寫好的腳本掛載到攝像機上，單擊 Unity 集成開發環境的運行按鈕，在游戲預覽面板中就會顯示出FocusControl控件的創建效果，如圖4-23所示。

▲圖4-23 FocusControl控件的創建效果

12．Toggle控件

Toggle控件是繪制一個開關，通過控制開關的閉合來執行一些具體的操作。其方法的聲明可以有很多的方式，具體的方法聲明如表4-24所示。

表4-24 聲明Toggle控件的方法

續表

在上面的方法聲明中有很多參數，具體的參數以及各個參數的含義如表4-25所示。

表4-25 聲明Toggle控件使用到的具體參數

用下面的代碼來創建Toggle控件，通過控制開關的閉合來執行相關的具體操作，具體實現如下面的代碼片段所示。

代碼位置：見隨書光盤中源代碼/第04章目錄下的 GUI/Assets/控件JavaScript / Toggle.js。

1　var aTexture : Texture;　　　//聲明一個紋理圖片

2　privatevartoggleTxt:boolean=false;//聲明一個初始值為false的Boolean變量toggleTxt

3　private var toggleImg : boolean = false;//聲明一個初始值為false的Boolean變量toggleImg

4　function OnGUI () {//聲明OnGUI方法

5　　if(!aTexture) {//判定是否存在紋理圖片

6　　　Debug.LogError("Please assign a texture in the inspector.");//若沒有則打印提示信息

7　　　return;

8　　}

9　　　//繪制一個名字為A Toggle text且初始狀態為toggleTxt開關

10　　toggleTxt = GUI.Toggle(Rect(10, 10, 100, 30), toggleTxt, "A Toggle text");

11　　//繪制一個紋理圖片為aTexture且初始狀態為toggleImg開關

12　　toggleImg = GUI.Toggle(Rect(10, 50, 50, 50), toggleImg, aTexture);

13　}

將編寫好的腳本掛載到攝像機上，單擊 Unity 集成開發環境的運行按鈕，在游戲預覽面板中就會顯示出Toggle控件的創建效果，如圖4-24所示。

▲圖4-24 Toggle控件的創建效果

13．Toolbar控件

Toolbar控件是繪制一個工具條，在里面可以置入一些工具按鈕。其方法的聲明可以有很多的方式，具體的方法聲明如表4-26所示。

表4-26 聲明Toolbar控件的方法

在上面的方法聲明中有很多參數，具體的參數以及各個參數的含義如表4-27所示。

表4-27 聲明Toolbar控件使用到的具體參數

用下面的代碼來創建 Toolbar 控件，通過工具條控件可以在里面置入一些具體的工具按鈕，具體實現如下面的代碼片段所示。

代碼位置：見隨書光盤中源代碼/第04章目錄下的 GUI/Assets/控件JavaScript / Toolbar.js。

1　var toolbarInt : int = 0;　　　　//聲明一個初始值為0的整型變量toolbarInt

2　var toolbarStrings : String[] = ["Toolbar1", "Toolbar2", "Toolbar3"];//聲明一個具有內容的字符型數組

3　function OnGUI () {　　　　　　//聲明OnGUI方法

4　　　//繪制一個內容為toolbarStrings且當前焦點在第toolbarInt上的工具條

5　　toolbarInt = GUI.Toolbar (Rect (25, 25, 250, 30), toolbarInt, toolbarStrings);

6　}

將編寫好的腳本掛載到攝像機上，單擊 Unity 集成開發環境的運行按鈕，在游戲預覽面板中就會顯示出Toolbar控件的創建效果，如圖4-25所示。

圖4-25 Toolbar控件的創建效果

14．SelectionGrid控件

SelectionGrid控件是繪制一個網格按鈕，可以在自定義的網格內具體功能置入按鈕。其方法的聲明可以有很多的方式，具體的方法聲明如表4-28所示。

表4-28 聲明SelectionGrid控件的方法

在上面的方法聲明中有很多參數，具體的參數以及各個參數的含義如表4-29所示。

表4-29 聲明SelectionGrid控件使用到的具體參數

用下面的代碼來創建SelectionGrid控件，通過工具條控件可以在里面置入一些具體的工具按鈕，具體使用如下面的代碼片段所示。

代碼位置：見隨書光盤中源代碼/第04章目錄下的 GUI/Assets/控件JavaScript / SelectionGrid.js。

1　var selGridInt : int= 0;　　　　　　//聲明一個初始值為0的整型變量selGridInt

2　var selStrings : String[] = ["Grid 1", "Grid 2", "Grid 3", "Grid 4"];//聲明一個具有內容的字符型數組

3　function OnGUI () {　　　　　　　　//聲明OnGUI方法

4　　//繪制一個內容為selStrings且當前焦點在第selGridInt上的網格按鈕控件

5　　selGridInt = GUI.SelectionGrid (Rect (50, 50, 200, 120), selGridInt, selStrings, 2);

6　}

將編寫好的腳本掛載到攝像機上，單擊Unity集成開發環境的運行按鈕，在游戲預覽面板中就會顯示出SelectionGrid控件的創建效果，如圖4-26所示。

▲圖4-26 SelectionGrid控件的創建效果

15．HorizontalSlider控件

HorizontalSlider控件是繪制一個水平的滑桿，并且可以自己設置閾值。其方法的聲明可以有兩種方式，具體的方法聲明如表4-30所示。

表4-30 聲明HorizontalSlider控件的方法

在上面的方法聲明中有很多參數，具體的參數以及各個參數的含義如表4-31所示。

表4-31 聲明HorizontalSlider控件使用到的具體參數

用下面的代碼來創建HorizontalSlider控件，可以創建一個水平滑桿，根據移動的具體滑桿位置來確定具體的值，具體實現如下面的代碼片段所示。

代碼位置：見隨書光盤中源代碼/第04章目錄下的 GUI/Assets/控件JavaScript / HorizontalSlider.js。

1　var hSliderValue : float = 0.0;　//聲明一個初始值為0.0的浮點型變量hSliderValue

2　function OnGUI () {　　　　//聲明OnGUI方法

3　　　//繪制一個初始值為hSliderValue的水平滑桿

4　　hSliderValue=GUI.HorizontalSlider(Rect(25,25,100,30),hSliderValue,0.0,10.0);

5　}

將編寫好的腳本掛載到攝像機上，單擊Unity集成開發環境的運行按鈕，在游戲預覽面板中就會顯示出HorizontalSlider控件的創建效果，如圖4-27所示。

▲圖4-27 HorizontalSlider控件的創建效果

16．VerticalSlider控件

VerticalSlider控件是繪制一個垂直的滑桿，并且可以自己設置閾值。其方法的聲明可以有兩種方式，具體的方法聲明如表4-32所示。

表4-32 聲明VerticalSlider控件的方法

在上面的方法聲明中有很多參數，具體的參數以及各個參數的含義如表4-33所示。

表4-33 聲明VerticalSlider控件使用到的具體參數

用下面的代碼來創建VerticalSlider控件，可以創建一個水平滑桿，根據移動的具體滑桿位置來確定具體的值，具體實現如下面的代碼片段所示。

代碼位置：見隨書光盤中源代碼/第04章目錄下的 GUI/Assets/控件JavaScript / VerticalSlider.js。

1　var vSliderValue : float = 0.0;　//聲明一個初始值為0.0的浮點型變量vSliderValue

2　function OnGUI () {　　　　//聲明OnGUI方法

3　　　//繪制一個初始值為vSliderValue的豎直滑桿

4　　vSliderValue = GUI.VerticalSlider (Rect (25, 25, 100, 100), vSliderValue, 10.0,0.0);

5　}

將編寫好的腳本掛載到攝像機上，單擊Unity集成開發環境的運行按鈕，在游戲預覽面板中就會顯示出VerticalSlider控件的創建效果，如圖4-28所示。

▲圖4-28 VerticalSlider控件的創建效果

17．HorizontalScrollbar控件

HorizontalScrollbar 控件是繪制一個水平的滾動條，并且可以自己設置閾值。其方法的聲明可以有兩種方式，具體的方法聲明如表4-34所示。

表4-34 聲明HorizontalScrol bar控件的方法

在上面的方法聲明中有很多參數，具體的參數以及各個參數的含義如表4-35所示。

表4-35 聲明HorizontalScrollbar控件使用到的具體參數

用下面的代碼來創建HorizontalScrollbar控件，可以創建一個水平滾動條，根據移動的具體滾動位置來確定具體的值，具體實現如下面的代碼片段所示。

代碼位置：見隨書光盤中源代碼/第04章目錄下的 GUI/Assets/控件JavaScript / HorizontalScrolbar.js。

1　var hSbarValue : float;　　　　　//聲明一個浮點型變量hSbarValue

2　function OnGUI () {　　　　　　//聲明OnGUI方法

3　　　//繪制一個初始值為hSbarValue的水平滾動條

4　　hSbarValue = GUI.HorizontalScrollbar (Rect (25, 25, 100, 30), hSbarValue, 1.0,0.0, 10.0);

5　}

將編寫好的腳本掛載到攝像機上，單擊 Unity 集成開發環境的運行按鈕，在游戲預覽面板中就會顯示出HorizontalScrollbar控件的創建效果，如圖4-29所示。

▲圖4-29 HorizontalScrollbar控件的創建效果

18．VerticalScrollbar控件

VerticalScrollbar控件是繪制一個垂直的滾動條，并且可以自己設置閾值。其一般聲明靜態的方法，具體的方法聲明如表4-36所示。

表4-36 聲明VerticalScrol bar控件的方法

在上面的方法聲明中有很多參數，具體的參數以及各個參數的含義如表4-37所示。

表4-37 聲明VerticalScrol bar控件使用到的具體參數

用下面的代碼來創建VerticalScrollbar控件，可以創建一個水平滾動條，根據移動的具體滾動位置來確定具體的值，具體使用如下面的代碼片段所示。

代碼位置：見隨書光盤中源代碼/第04章目錄下的 GUI/Assets/控件JavaScript / VerticalScrolbar.js。

1　var vSbarValue : float;　　　　　//聲明一個浮點型變量hSbarValue

2　function OnGUI () {　　　　　　//聲明OnGUI方法

3　　　//繪制一個初始值為hSbarValue的豎直滾動條

4　　vSbarValue=GUI.VerticalScrollbar(Rect(25,25,100,30),vSbarValue,1.0,10.0,0.0);

5　}

將編寫好的腳本掛載到攝像機上，單擊 Unity 集成開發環境的運行按鈕，在游戲預覽面板中就會顯示出VerticalScrollbar控件的創建效果，如圖4-30所示。

19．BeginGroup控件和EndGroup控件

BeginGroup控件是開始一個組，必須跟EndGroup配對出現。其方法的聲明可以有很多的方式，具體的方法聲明如表4-38所示。

▲圖4-30 VerticalScrollbar控件的創建效果

表4-38 聲明BeginGroup控件的方法

在上面的方法聲明中有很多參數，具體的參數以及各個參數的含義如表4-39所示。

表4-39 聲明BeginGroup控件使用到的具體參數

EndGroup控件是結束一個組，必須跟BeginGroup配對出現。其一般聲明為靜態方法，具體的方法聲明如表4-40所示。

表4-40 聲明EndGroup控件的方法

用下面的代碼來創建BeginGroup控件和EndGroup控件，具體使用如下面的代碼片段所示。

代碼位置：見隨書光盤中源代碼/第04章目錄下的 GUI/Assets/控件JavaScript / BeginGroupAndEndGroup.js。

1　function OnGUI () {　　　　　　　　//聲明OnGUI方法

2　　　//在屏幕自定義的區域內創建一個組

3　　　GUI.BeginGroup (new Rect (Screen.width / 2 - 400, Screen.height / 2 - 300,800, 600));

4　　　GUI.Box (new Rect (0,0,800,600),　　　//在自定義區域內創建一個Box控件

5　　　"This box is now centered! - here you would put your main menu");//Box控件用于顯示的內容

6　　　GUI.EndGroup ();　　　　　　　//結束這個組

7　}

將編寫好的腳本掛載到攝像機上，單擊Unity集成開發環境的運行按鈕，在游戲預覽面板中就會顯示出BeginGroup控件和EndGroup控件的創建效果，如圖4-31所示。

▲圖4-31 BeginGroup控件和EndGroup控件的創建效果

20．BeginScrollView控件和EndScrollView控件

BeginScrollView 控件是在圖形用戶界面中創建一個滾動視圖。其方法的聲明可以有很多的方式，具體的方法聲明如表4-41所示。

表4-41 BeginScrolView控件聲明方法

在上面的方法聲明中有很多參數，具體的參數以及各個參數的含義如表4-42所示。

表4-42 聲明BeginScrol View控件使用到的具體參數

EndScrollView控件是在圖形用戶界面中撤銷一個滾動視圖。其一般聲明靜態的方法，具體的方法聲明如表4-43所示。

表4-43 聲明EndScrol View控件的方法

用下面的代碼來創建BeginScrollView控件和EndScrollView控件，分別通過創建滾動視圖和撤銷滾動視圖來說明這兩個控件的具體用法，具體實現如下面的代碼片段所示。

代碼位置：見隨書光盤中源代碼/第04章目錄下的 GUI/Assets/控件JavaScript / BeginScrolViewAnd-EndScrol View.js。

1　var scrollPosition : Vector2 = Vector2.zero;//聲明一個初始為（0,0）的坐標scrollPosition

2　function OnGUI () {　　　　　　//聲明OnGUI方法

3　　//在屏幕的自定義區域內創建一個滾動視圖

4　　scrollPosition = GUI.BeginScrollView (Rect (10,300,100,100),

5　　　scrollPosition, Rect (0, 0, 220, 200));

6　　// 在屏幕自定義的區域內分別創建4個按鈕

7　　GUI.Button (Rect (0,0,100,20), "Top-left");

8　　GUI.Button (Rect (120,0,100,20), "Top-right");

9　　GUI.Button (Rect (0,180,100,20), "Bottom-left");

10　　GUI.Button (Rect (120,180,100,20), "Bottom-right");

11　　// 撤銷這個滾動視圖

12　　GUI.EndScrollView ();

13　}

將編寫好的腳本掛載到攝像機上，單擊 Unity 集成開發環境的運行按鈕，在游戲預覽面板中就會顯示出BeginScrollView控件和EndScrollView控件的創建效果，如圖4-32所示。

▲圖4-32 BeginScrollView控件和EndScrollView控件的創建效果

21．ScrollTo控件

ScrollTo 控件是給定一個坐標使當前焦點立即到位。其一般聲明靜態的方法，具體的方法聲明如表4-44所示。

表4-44 聲明Scrol To控件的方法

用下面的代碼來創建 ScrollTo 控件，通過給定一個坐標使當前焦點立即到位來說明 ScrollTo控件的具體用法，具體使用如下面的代碼片段所示。

代碼位置：見隨書光盤中源代碼/第04章目錄下的 GUI/Assets/控件JavaScript / ScrolTo.js。

1　var scrollPos : Vector2 = Vector2.zero;　//聲明一個初始為（0,0）的坐標scrollPos

2　function OnGUI () {　　　　　　//聲明OnGUI方法

3　　//在屏幕指定區域內創建一個自定義的滾動視圖

4　　scrollPos = GUI.BeginScrollView(Rect (10, 10, 100, 50), scrollPos, Rect (0, 0,220, 10));

5　　if(GUI.Button (Rect (0,0,100,20), "Go Right"))//創建一個名字為Go Right按鈕，并判斷按鈕是否被按下

6　　　GUI.ScrollTo(Rect (120,0,100,20));　//使當前焦點即刻跳到指定的區域

7　　if(GUI.Button (Rect (120,0,100,20) , "Go Left"))//創建一個名字為Go Left按鈕，并判斷按鈕是否被按下

8　　　GUI.ScrollTo(Rect (0,0,100,20));　//使當前焦點即刻跳到指定的區域

9　　//撤銷滾動視圖.

10　　GUI.EndScrollView ();

11　}

將編寫好的腳本掛載到攝像機上，單擊 Unity 集成開發環境的運行按鈕，在游戲預覽面板中就會顯示出 ScrollTo 控件的創建效果，如圖4-33所示。

▲圖4-33 ScrollTo控件的創建效果

22．Window控件

Window控件是創建一個窗口。其方法的聲明可以有很多的方式，具體的方法聲明如表4-45所示。

表4-45 聲明Window控件的方法

在上面的方法聲明中有很多參數，具體的參數以及各個參數的含義如表4-46所示。

表4-46 聲明Window控件使用到的具體參數

用下面的代碼來創建Window控件，通過在屏幕上所自定義的矩形區域內創建一個窗口來說明Window控件的具體用法，具體使用如下面的代碼片段所示。

代碼位置：見隨書光盤中源代碼/第04章目錄下的 GUI/Assets/控件JavaScript / Window1.js。

1　var windowRect : Rect = Rect (20, 20, 120, 50);　//聲明窗口的矩形區域windowRect0

2　function OnGUI () {　　　　　　　　//聲明OnGUI方法

3　　///在windowRect矩形區域內繪制一個名字為My Window的窗口

4　　windowRect = GUI.Window (0, windowRect, DoMyWindow, "My Window");

5　}

6　// 聲明DoMyWindow函數，用于創建一個按鈕

7　function DoMyWindow (windowID : int) {

8　　if (GUI.Button (Rect (10,20,100,20), "Hello World"))//創建一個按鈕，并判定按鈕是否被按下

9　　　print ("Got a click");　　　　　//若按鈕被按下，則打印提示信息

10　}

將編寫好的腳本掛載到攝像機上，單擊 Unity 集成開發環境的運行按鈕，在游戲預覽面板中就會顯示出Window控件的創建效果，如圖4-34所示。

▲圖4-34 Window控件的創建效果

在此只是要確保每個窗口都有其自己的ID，則可以使用相同的函數來創建多個窗口。具體實現如下面的代碼片段所示。

代碼位置：見隨書光盤中源代碼/第04章目錄下的 GUI/Assets/控件JavaScript / Window2.js。

1　var windowRect0 : Rect = Rect (20, 20, 120, 50); //聲明窗口的矩形區域windowRect0

2　var windowRect1 : Rect = Rect (20, 100, 120, 50);//聲明窗口的矩形區域windowRect1

3　function OnGUI () {　　　　　　　　//聲明OnGUI方法

4　　// 分別在windowRect0和windowRect1兩個矩形區域內繪制兩個窗口

5　　windowRect0 = GUI.Window (0, windowRect0, DoMyWindow, "My Window");

6　　windowRect1 = GUI.Window (1, windowRect1, DoMyWindow, "My Window");

7　}

8　//聲明DoMyWindow函數，用于創建一個按鈕

9　function DoMyWindow (windowID : int) {

10　　if (GUI.Button (Rect (10,20,100,20), "Hello World"))//繪制一個按鈕，并判定按鈕是否被按下

11　　　print ("Got a click in window " + windowID);//若按鈕被按下，則打印相關的提示信息

12　　//在自定義的矩形區域內繪制一個可拖動窗口.

13　　GUI.DragWindow (Rect (0,0,10000,10000));

14　}

將編寫好的腳本掛載到攝像機上，單擊Unity集成開發環境的運行按鈕，在游戲預覽面板中就會顯示出 Window控件的創建效果，如圖4-35所示。

▲圖4-35 通過同一個函數創建的兩個窗口

若想取消顯示屏幕上所創建的窗口，只需停止調用OnGUI 方法即可，這樣就會取消組建的繪制，也就取消了顯示。具體使用如下面的代碼片段所示。

代碼位置：見隨書光盤中源代碼/第04章目錄下的 GUI/Assets/控件JavaScript / Window3.js。

1　var doWindow0 : boolean = true;//設置一個初始值為true的Boolean型變量doWindow0

2　// 聲明DoWindow0函數，用于繪制一個按鈕

3　function DoWindow0 (windowID : int) {

4　　GUI.Button (Rect (10,30, 80,20), "Click Me!");//繪制一個名字為Click Me!的按鈕

5　}

6　function OnGUI () {　　　　　　　　//聲明OnGUI方法

7　　// 繪制一個開關，并將doWindow0的值賦給開關

8　　doWindow0 = GUI.Toggle (Rect (10,10,100,20), doWindow0, "Window 0");

9　　//對doWindow0變量進行判定，判斷是否繪制窗口

10　　if (doWindow0)

11　　　GUI.Window (0, Rect (110,10,200,60), DoWindow0, "Basic Window");//繪制指定的窗口

12　}

將編寫好的腳本掛載到攝像機上，單擊 Unity 集成開發環境的運行按鈕，在游戲預覽面板中就會顯示出Window控件的創建效果，如圖4-36和圖4-37所示。

▲圖4-36 開關開啟，窗口顯示

▲圖4-37 開關關閉，窗口消失

根據圖形用戶界面控件的變量來設置，可以創建出各種各樣獨具特色的窗口，下面就設置一些變量來創建一個不同的窗口，具體實現如下面的代碼片段所示。

代碼位置：見隨書光盤中源代碼/第04章目錄下的 GUI/Assets/控件JavaScript / Window4.js。

1　var windowRect0 : Rect = Rect (20, 20, 120, 50); //聲明窗口的矩形區域windowRect0

2　var windowRect1 : Rect = Rect (20, 100, 120, 50);//聲明窗口的矩形區域windowRect1

3　function OnGUI () {　　　　　　　　//聲明OnGUI方法

4　　//設置GUI的color變量為紅色，并在windowRect0區域內繪制一個窗口

5　　GUI.color = Color.red;

6　　windowRect0 = GUI.Window (0, windowRect0, DoMyWindow, "Red Window");

7　　//設置GUI的color變量為紅色，并在windowRect0區域內繪制一個窗口

8　　　GUI.color = Color.green;

9　　windowRect1 = GUI.Window (1, windowRect1, DoMyWindow, "Green Window");

10　}

11　//聲明DoMyWindow函數，用于創建一個可拖動窗口

12　function DoMyWindow (windowID : int) {

13　　if (GUI.Button (Rect (10,20,100,20), "Hello World"))//聲明一個按鈕，并判斷是否被按下

14　　　print ("Got a click in window with color " + GUI.color);　//打印提示信息

15　　//在自定義的區域內繪制一個可拖動窗口

16　　GUI.DragWindow (Rect (0,0,10000,10000));

17　}

將編寫好的腳本掛載到攝像機上，單擊Unity集成開發環境的運行按鈕，在游戲預覽面板中就會顯示出所創建的窗口，如圖4-38所示。

▲圖4-38 創建不同背景顏色的窗口

23．DragWindow控件

DragWindow控件是繪制一個可拖動的窗口，可以設置可拖動的區域。其一般聲明為靜態的方法，具體的方法聲明如表4-47所示。

表4-47 聲明DragWindow控件的方法

用下面的代碼來創建DragWindow控件，通過在屏幕上所自定義的矩形區域內創建一個可拖動窗口，并設置一個可拖曳的區域來說明DragWindow控件的具體用法，具體使用如下面的代碼片段所示。

代碼位置：見隨書光盤中源代碼/第04章目錄下的 GUI/Assets/控件JavaScript / DragWindow.js。

1　var windowRect : Rect = Rect (20, 20, 120, 50);　//聲明窗口的矩形區域windowRect

2　function OnGUI () {　　　　　　　　//聲明OnGUI方法

3　　// 在windowRect矩形區域內繪制一個內容為My Window窗口

4　　windowRect = GUI.Window (0, windowRect, DoMyWindow, "My Window");

5　}

6　//聲明DoMyWindow函數，用于創建一個可拖動窗口

7　function DoMyWindow (windowID : int) {

8　　　//在自定義的區域內創建一個可拖動窗口

9　　　GUI.DragWindow (Rect (0,0, 10000, 20));

10　}

將編寫好的腳本掛載到攝像機上，單擊 Unity 集成開發環境的運行按鈕，在游戲預覽面板中就會顯示出所創建的可拖動窗口，如圖4-39所示。

▲圖4-39 創建的可拖動窗口

24．BringWindowToFront控件

BringWindowToFront控件是將當前窗口顯示至最上面。即將當前窗口設置為所創建的所有窗口的最上面，其一般聲明為靜態的方法，具體的方法聲明如表4-48所示。

表4-48 聲明BringWindowToFront控件的方法

用下面的代碼來創建多個窗口，通過調用BringWindowToFront方法，將當前窗口設置為所創建的所有窗口的最上面，具體使用如下面的代碼片段所示。

代碼位置：見隨書光盤中源代碼/第04章目錄下的 GUI/Assets/控件JavaScript / BringWindowToFront.js。

1　private var windowRect : Rect = Rect (20, 20, 120, 50);//聲明窗口的矩形區域windowRect

2　privatevarwindowRect2:Rect=Rect(80,20,120,50);//聲明窗口的矩形區域windowRect2

3　function OnGUI () {　　　　　　　　//聲明OnGUI方法

4　　windowRect = GUI.Window (0, windowRect, DoMyFirstWindow, "First");//繪制第一個窗口

5　　windowRect2 = GUI.Window (1, windowRect2, DoMySecondWindow, "Second" );//繪制第二個窗口

6　}

7　function DoMyFirstWindow (windowID : int) {　　//聲明DoMyFirstWindow函數

8　　if (GUI.Button (Rect (10,20,100,20), "Bring to front"))//繪制一個按鈕，并判斷是否被按下

9　　　GUI.BringWindowToFront(1);　　　　//調用BringWindowToFront方法

10　　GUI.DragWindow(Rect (0,0, 10000, 20));　　//繪制一個可拖動窗口

11　}

12　function DoMySecondWindow (windowID : int) {//聲明DoMySecondWindow函數

13　　if (GUI.Button (Rect (10,20,100,20), "Bring to front"))//繪制一個按鈕，并判斷是否被按下

14　　　GUI.BringWindowToFront(0);　　　　//調用BringWindowToFront方法

15　　GUI.DragWindow(Rect (0,0, 10000, 20));　　//繪制一個可拖動窗口

16　}

將編寫好的腳本掛載到攝像機上，單擊Unity集成開發環境的運行按鈕，在游戲預覽面板中就會顯示出BringWindowToFront控件的創建效果，如圖4-40所示。

▲圖4-40 BringWindowToFront控件的創建效果

25．BringWindowToBack控件

BringWindowToBack控件是將當前窗口移至最下面。即將當前窗口設置為所創建的所有窗口的最下面，其一般聲明為靜態的方法，具體的方法聲明如表4-49所示。

表4-49 聲明BringWindowToBack控件的方法

用下面的代碼來創建多個窗口，通過調用BringWindowToBack方法，將當前窗口設置為所創建的所有窗口的最下面，具體實現如下面的代碼片段所示。

代碼位置：見隨書光盤中源代碼/第04章目錄下的 GUI/Assets/控件JavaScript / BringWindowToBack.js。

1　private var windowRect : Rect = Rect (20, 20, 120, 50);//聲明窗口的矩形區域windowRect

2　privatevarwindowRect2:Rect=Rect(80,20,120,50);//聲明窗口的矩形區域windowRect2

3　function OnGUI () {　　　　　　　　//聲明OnGUI方法

4　　windowRect = GUI.Window (0, windowRect, DoMyFirstWindow, "First");//繪制第一個窗口

5　　windowRect2 = GUI.Window (1, windowRect2, DoMySecondWindow, "Second" );//繪制第二個窗口

6　}

7　function DoMyFirstWindow (windowID : int) {　　　//聲明DoMyFirstWindow函數

8　　if (GUI.Button (Rect (10,20,100,20), "Put Back"))//繪制一個按鈕，并判斷是否被按下

9　　　GUI.BringWindowToBack(0);　　　　　//調用BringWindowToBack方法

10　　GUI.DragWindow(Rect (0,0, 10000, 20));　　　//繪制一個可拖動窗口

11　}

12　function DoMySecondWindow (windowID : int) {　　//聲明DoMySecondWindow函數

13　　if (GUI.Button (Rect (10,20,100,20), "Put Back"))//繪制一個按鈕，并判斷是否被按下

14　　　GUI.BringWindowToBack(1);　　　　　//調用BringWindowToBack方法

15　　GUI.DragWindow(Rect (0,0, 10000, 20));　　　//繪制一個可拖動窗口

16　}

將編寫好的腳本掛載到攝像機上，單擊Unity集成開發環境的運行按鈕，在游戲預覽面板中就會顯示出BringWindowToBack控件的創建效果，如圖4-41所示。

▲圖4-41 BringWindowToBack控件的創建效果

26．FocusWindow控件

FocusWindow控件是設置一個窗口為當前焦點窗口，通過調用窗口的 ID 即可完成設置，其一般聲明為靜態的方法，具體的方法聲明如表4-50所示。

表4-50 聲明FocusWindow控件的方法

用下面的代碼來創建多個窗口，通過調用FocusWindow方法，將當前窗口設置焦點窗口，具體實現如下面的代碼片段所示。

代碼位置：見隨書光盤中源代碼/第04章目錄下的 GUI/Assets/控件JavaScript / FocusWindow.js。

1　private var windowRect : Rect = Rect (20, 20, 120, 50);//聲明窗口的矩形區域windowRect

2　privatevarwindowRect2:Rect=Rect(20,80,120,50);//聲明窗口的矩形區域windowRect2

3　function OnGUI () {　　　　　　　　//聲明OnGUI方法

4　　windowRect = GUI.Window (0, windowRect, DoMyFirstWindow, "First");//繪制第一個窗口

5　　windowRect2　=　GUI.Window　(1,　windowRect2,　DoMySecondWindow,　"Second"　);//繪制第二個窗口

6　}

7　function DoMyFirstWindow (windowID : int) {　　　//聲明DoMyFirstWindow函數

8　　if (GUI.Button (Rect (10,20,100,20), "Focus other"))//繪制一個按鈕，并判斷是否被按下

9　　　GUI.FocusWindow(1);　　　　　　//將所調用的ID的窗口設置為焦點窗口

10　}

11　function DoMySecondWindow (windowID : int) {//聲明DoMySecondWindow函數

12　　if (GUI.Button (Rect (10,20,100,20), "Focus other"))//繪制一個按鈕，并判斷是否被按下

13　　　GUI.FocusWindow(0);　　　　　　//將所調用的ID的窗口設置為焦點窗口

14　}

將編寫好的腳本掛載到攝像機上，單擊 Unity 集成開發環境的運行按鈕，在游戲預覽面板中就會顯示出FocusWindow控件的創建效果，如圖4-42所示。

▲圖4-42 FocusWindow控件的創建效果

27．UnfocusWindow控件

UnfocusWindow控件是將當前的焦點窗口從所有窗口中移除，通過調用窗口的ID即可完成設置，其一般聲明為靜態的方法，具體的方法聲明如表4-51所示。

表4-51 聲明UnfocusWindow控件的方法

用下面的代碼來創建多個窗口，通過調用UnfocusWindow方法，將當前的焦點窗口從所有窗口中移除，具體使用如下面的代碼片段所示。

代碼位置：見隨書光盤中源代碼/第04章目錄下的 GUI/Assets/控件JavaScript / UnfocusWindow.js。

1　private var windowRect : Rect = Rect (20, 20, 120, 50);//聲明窗口的矩形區域windowRect

2　privatevarwindowRect2:Rect=Rect(20,80,120,50);//聲明窗口的矩形區域windowRect2

3　function OnGUI () {　　　　　　　　//聲明OnGUI方法

4　　windowRect = GUI.Window (0, windowRect, DoMyFirstWindow, "First");//繪制第一個窗口

5　　windowRect2 = GUI.Window (1, windowRect2, DoMySecondWindow, "Second" );//繪制第二個窗口

6　}

7　function DoMyFirstWindow (windowID : int) {　　　//聲明DoMyFirstWindow函數

8　　if (GUI.Button (Rect (10,20,100,20), "UnFocus"))　//繪制一個按鈕，并判斷是否被按下

9　　　GUI.UnfocusWindow();　　　　　　　//若被按下，則移除當前窗口的焦點

10　}

11　function DoMySecondWindow (windowID : int) {　//聲明DoMySecondWindow函數

12　　if (GUI.Button (Rect (10,20,100,20), "UnFocus"))　//繪制一個按鈕，并判斷是否被按下

13　　　GUI.UnfocusWindow();　　　　　　　//若被按下，則移除當前窗口的焦點

14　}

將編寫好的腳本掛載到攝像機上，單擊 Unity 集成開發環境的運行按鈕，在游戲預覽面板中就會顯示出UnfocusWindow控件的創建效果，如圖4-43所示。

▲圖4-43 UnfocusWindow控件的創建效果

4.1.3 圖形用戶界面控件綜合案例

在實際的開發過程中，圖形用戶界面控件會得到大量的應用，例如，一些游戲的設置界面和幫助界面的搭建，如果讀者能夠正確合理地應用這些圖形用戶界面控件，則可以搭建絢麗漂亮的界面。

下面就用單純的圖形用戶界面控件搭建一個相冊的界面。在里面繪制一些按鈕、紋理圖片、窗口，通過合理地搭配，進而搭建出這個絢麗的相冊界面，最終效果如圖4-44、圖4-45和圖4-46所示。

下面就對這個相冊的制作過程進行詳細介紹，具體的制作步驟如下。

（1）相冊所需資源的收集。

既然要搭建一個相冊界面，就避免不了收集風景照片，相冊中一些必須的按鈕紋理貼圖，以及相冊標題貼圖，下面用表4-52來詳細介紹這些資源的具體信息。

▲圖4-44 絢麗的相冊界面1

▲圖4-45 絢麗的相冊界面2

▲圖4-46 絢麗的相冊界面3

表4-52 相冊所需資源的詳細具體信息

（2）將所收集的資源導入Unity集成開發環境。

單擊桌面上的Unity圖標進而進入Unity集成開發環境，在開發環境中單擊File→New Scene菜單新建一個場景，然后單擊Assets→Import New Asset...菜單，會立刻彈出一個 Import New Asset對話框，如圖4-47所示，選擇需要導入的資源。

（3）編寫腳本，實現具體的圖形用戶界面的搭建。

單擊Assets→Create→Javascript菜單，在項目資源列表中就創建了一個JavaScript腳本，在此將腳本的名字改為XCScript，雙擊這個腳本即可進入默認的腳本編輯器，在腳本編輯器內編寫這個相冊腳本，具體實現如下面的代碼片段所示。

▲圖4-47 選擇需要導入的資源

代碼位置：見隨書光盤中源代碼/第04章目錄下的 GUI/Assets/典型案例/典型案例JavaScript / XCScript.js。

1　var beijingTexture:Texture;　　　　//聲明背景紋理圖片

2　var XCTexture:Texture;　　　　　　//聲明相冊標題紋理圖片

3　var fengjingTexture1:Texture;　　　　//聲明風景紋理圖片1

4　var fengjingTexture2:Texture;　　　　//聲明風景紋理圖片2

5　var fengjingTexture3:Texture;　　　　//聲明風景紋理圖片3

6　var fengjingTexture4:Texture;　　　　//聲明風景紋理圖片4

7　var fengjingTexture5:Texture;　　　　//聲明風景紋理圖片5

8　var fengjing:Texture[];　　　　　//聲明風景紋理圖片數組

9　var zuojiantouTexture:Texture;　　　　//聲明左箭頭按鈕紋理圖片

10　var youjiantouTexture:Texture;　　　　//聲明右箭頭按鈕紋理圖片

11　var quedingTexture:Texture;　　　　//聲明確定按鈕紋理圖片

12　var fanhuiTexture:Texture;　　　　　//聲明返回按鈕紋理圖片

13　var i:int = 0;　　　　　　　　//聲明風景紋理圖片數組的索引

14　var MyStyle:GUIStyle;　　　　　　//聲明GUIStyle

15　function Update () {　　　　　　//聲明Update方法

16　　if (Application.platform == RuntimePlatform.Android) {//判斷運行平臺是否為Android平臺

17　　if (Input.GetKeyUp(KeyCode.Home) ) {//判斷按鍵是否為Android設備的Home鍵

18　　　　Application.Quit();　　　　//若是Home鍵，則項目退出

19　　　}

20　　if (Input.GetKeyUp(KeyCode.Escape)) {　//判斷按鍵是否為Android設備的返回鍵

21　　　　Application.Quit();　　　　//若是返回鍵，則項目退出

22　　　} } }

23　function OnGUI(){　　　　　　　//聲明OnGUI方法

24　　var ratioScaleTempH=Screen.height/960.0;//為了進行屏幕自適應而聲明的縱向縮放比變量

25　　var ratioScaleTemp=Screen.width/540.0; //為了進行屏幕自適應而聲明的橫向縮放比變量

26　//聲明自定義的矩形窗口區域，并實現了屏幕的自適應

27　var windowRect : Rect = Rect (

28　　　　　20*ratioScaleTemp, 250*ratioScaleTempH, 500*ratioScaleTemp,550* ratioScaleTempH);

29　//在自定義的區域內繪制背景紋理圖片，并且實現了屏幕自適應

30　GUI.DrawTexture(Rect(0,0,540*ratioScaleTemp,960*ratioScaleTemp),

31　　　　beijingTexture, ScaleMode.ScaleToFit, true , 540.0/960.0);32　//在自定義的區域內繪制相冊標題紋理圖片，并且實現了屏幕自適應

33　GUI.DrawTexture(Rect(

34　　　　170*ratioScaleTemp,20*ratioScaleTempH,200*ratioScaleTemp,100*ratioScaleTempH),

35　　　　XCTexture, ScaleMode.ScaleToFit, true , 200.0/100.0);

36　//在自定義的區域內繪制左箭頭按鈕紋理圖片，并且實現了屏幕自適應，以及對按鈕是否被按下進行判定

37　if(GUI.Button(Rect(20*ratioScaleTemp,145*ratioScaleTempH,50*ratioScaleTemp,50*ratioScaleTempH),

38　　　　zuojiantouTexture,MyStyle)){

39　　　　　　i--;　　　　　　//風景紋理圖片數組的索引自減

40　　　　　　if(i<0){　　　　　//若風景紋理圖片數組的索引小于0

41　　　　　　i=4;　　　　　　//設置風景紋理圖片數組的索引等于4

42　　　　　　} }

43　//在自定義的區域內繪制風景1按鈕紋理圖片，并且實現了屏幕自適應，以及對按鈕是否被按下進行判定

44　if(GUI.Button(Rect(70*ratioScaleTemp,130*ratioScaleTempH,80*ratioScaleTemp,&nbsp;80*ratioScaleTempH),

45　　　　　fengjingTexture1,　MyStyle)){

46　　　　　i=0;　　　　　　　//設置風景紋理圖片數組的索引等于0

47　　　　　}

48　//在自定義的區域內繪制風景2按鈕紋理圖片，并且實現了屏幕自適應，以及對按鈕是否被按下進行判定

49　if(GUI.Button(Rect(150*ratioScaleTemp,130*ratioScaleTempH,80*ratioScaleTemp,80*ratioScaleTempH),

50　　　　　fengjingTexture2, MyStyle)){

51　　　　　i=1;　　　　　　　//設置風景紋理圖片數組的索引等于1

52　　　　　}

53　//在自定義的區域內繪制風景3按鈕紋理圖片，并且實現了屏幕自適應，以及對按鈕是否被按下進行判定

54　if(GUI.Button(Rect(230*ratioScaleTemp,130*ratioScaleTempH,80*ratioScaleTemp,80*ratioScaleTempH),

55　　　　　fengjingTexture3, MyStyle)){

56　　　　　i=2;　　　　　　　//設置風景紋理圖片數組的索引等于2

57　　　　}

58　//在自定義的區域內繪制風景4按鈕紋理圖片，并且實現了屏幕自適應，以及對按鈕是否被按下進行判定

59　if(GUI.Button(Rect(310*ratioScaleTemp,130*ratioScaleTempH,80*ratioScaleTemp,80*ratioScaleTempH),

60　　　　　fengjingTexture4, MyStyle)){

61　　　　　i=3;　　　　　　　//設置風景紋理圖片數組的索引等于3

62　　　　}

63　//在自定義的區域內繪制風景5按鈕紋理圖片，并且實現了屏幕自適應，以及對按鈕是否被按下進行判定

64　if(GUI.Button(Rect(390*ratioScaleTemp,130*ratioScaleTempH,80*ratioScaleTemp,80*ratioScaleTempH),

65　　　　　fengjingTexture5, MyStyle)){

66　　　　　i=4;　　　　　　　//設置風景紋理圖片數組的索引等于4

67　　　　}

68　//在自定義的區域內繪制右箭頭按鈕紋理圖片，并且實現了屏幕自適應，以及對按鈕是否被按下進行判定

69　if(GUI.Button(Rect(470*ratioScaleTemp,145*ratioScaleTempH,50*ratioScaleTemp,50*ratioScaleTempH),

70　　　　　youjiantouTexture,MyStyle)){

71　　　　　i++;　　　　　　　//風景紋理圖片數組的索引自加

72　　　　　if(i>4){　　　　　//若風景紋理圖片數組的索引大于4

73　　　　　i=0;　　　　　　　//設置風景紋理圖片數組的索引等于0

74　　　　} }

75　　windowRect = GUI.Window (0, windowRect, DoMyWindow, "相 冊"); //繪制一個窗口

76　//在自定義的區域內繪制確定按鈕紋理圖片，并且實現了屏幕自適應，以及對按鈕是否被按下進行判定

77　if(GUI.Button(Rect(70*ratioScaleTemp,830*ratioScaleTempH,100*ratioScaleTemp,50*ratioScaleTempH),

78　　　　　quedingTexture,MyStyle)){

79　　　　　Debug.Log("顯示的風景圖片"); //若被按下，則打印提示信息

80　　　　}

81　//在自定義的區域內繪制返回按鈕紋理圖片，并且實現了屏幕自適應，以及對按鈕是否被按下進行判定

82　if(GUI.Button(Rect(370*ratioScaleTemp,830*ratioScaleTempH,100*ratioScaleTemp,50*ratioScaleTempH),

83　　　　　fanhuiTexture,MyStyle)){

84　　　　　Application.Quit();　　//若被按下，則退出程序

85　　　　} }

86　function DoMyWindow (windowID : int) {　　//聲明DoMyWindow函數

87　　var ratioScaleTempH=Screen.height/960.0; //為了進行屏幕自適應而聲明的縱向縮放比變量

88　　var ratioScaleTemp=Screen.width/540.0;　//為了進行屏幕自適應而聲明的橫向縮放比變量

89　//在剛繪制的窗口內，自定義一個區域繪制相應的風景紋理圖片數組索引所對應的風景圖片

90　GUI.DrawTexture(

91　　　Rect(10*ratioScaleTemp,30*ratioScaleTempH,480*ratioScaleTemp,480*ratio-ScaleTempH),fengjing[i], ScaleMode.ScaleToFit, true , 500.0/500.0);

92

93　}

（4）腳本的掛載和腳本中聲明的資源與項目中資源的連接。

編寫完腳本即可將腳本掛載到場景中的攝像機上，此時攝像機就多了一個 XCScript.js腳本屬性，在這個屬性里面需要將聲明的資源與項目中資源相連接，具體的方法就是選中資源拖動到腳本聲明的對應資源處即可，即完成資源連接，此時項目就能正常運行，如圖4-48所示。

▲圖4-48 腳本中聲明的資源與項目中資源的連接