模塊三：制作游戲界面與動畫特效項目十：UGUI系統—《迷宮尋寶》游戲界面設計UnityGameEngineUNITY模塊三制作游戲界面與動畫特效UGUI系統

——《迷宮尋寶》游戲界面設計動畫系統——游戲動畫制作地形引擎——游戲場景制作聲光技術——聲光特效項目十項目十一項目十二項目十三粒子系統——粒子特效項目十四尋路技術——導航尋路動畫項目十五背包系統——物品拾取動畫項目十六任務概述近年來，游戲行業(yè)發(fā)展迅猛，一款界面設計精美的游戲往往會吸引更多的玩家，這就需要用到UGUI系統，即圖形用戶界面。游戲界面設計必須遵守相關的規(guī)定或法規(guī)，比如，圖標設計、色彩搭配、排版布局等都要遵循統一的視覺規(guī)范，游戲內容必須符合社會道德規(guī)范，操作方面需要符合用戶的操作習慣，同時，游戲界面設計也要根據用戶的需求和體驗進行優(yōu)化和創(chuàng)新，以提高游戲的競爭力。本項目我們以《迷宮尋寶》游戲界面設計為例學習一下UGUI系統的使用方法。行業(yè)PPT模板/hangye/學習目標011.掌握UGUI系統各個控件的構造和基本參數設置2.掌握控件的響應事件教學目標重難點重點：UGUI控件的使用及交互設計難點：對各控件參數的理解項目實現02任務1：游戲開始場景制作1.導入給出的素材資源并新建場景。2.新建背景Image，調整其大小并顯示在畫布中央。3.將GameBg背景圖片轉換為精靈圖片并作為Image的背景。制作步驟提示4.新建Image，設置其Width為300，Height為140。5.為Image添加dialogbj圖片，制作對話框背景。項目實現02任務1：游戲開始場景制作6.新建Text文本。7.設置Text屬性為“歡迎您來到亞斯星球！”，字號FontSize為16。制作步驟提示8.新建按鈕，設置其Text屬性為“繼續(xù)”，Font屬性為“方正少兒_GBK”字體，Color屬性為白色。9.設置按鈕背景為buttonBG圖片，同時調整Button的Width為120，Height為40。項目實現02任務1：游戲開始場景制作10.新建存放腳本的文件夾Script。11.創(chuàng)建空物體UIController。12.為空物體添加腳本UIEvent。制作步驟提示usingSystem.Collections;usingSystem.Collections.Generic;usingUnityEngine;usingUnityEngine.UI;//引入UI命名空間publicclassUIEvent:MonoBehaviour{publicImageimage;publicTexttext;publicvoidChangeText(){text.text="快來開啟你的尋寶之旅吧！";//更改單擊時的文字

text.color=Color.white;//更改單擊時文字的顏色

}publicvoidChangeImage(){image.color=Color.black;//更改單擊時背景圖片的顏色

}}項目實現02任務1：游戲開始場景制作13.為Button添加單擊事件ChangeImage（）方法。14.再次為按鈕添加ChangeText（）方法。制作步驟提示15.選擇UIController，在Inspector視圖中，將對應的游戲物體Image1和Text文本添加到UIEvent（Script）對應位置處。16.選擇畫布Canvas，將UIScaleMode設置為ScaleWithScreenSize，讓其隨著屏幕大小自動縮放。項目實現02任務2：菜單界面制作1.打開SampleScene場景。2.制作背景Image，設置其Width為900，Height為450，PosX為0，PosY為0，畫布隨著屏幕大小縮放，并添加背景圖片GameBG。制作步驟提示3.新建主菜單背景Image，命名為mainpage。4.設置其Width為250，Height為350，添加background圖片。項目實現02任務2：菜單界面制作5.利用Image、Button、Text制作完成主菜單界面制作。制作步驟提示6.用同樣的方法制作游戲設置界面。項目實現02任務2：菜單界面制作7.制作排行榜界面效果。制作步驟提示8.制作角色設置界面。首先利用InputField制作姓名輸入框。9.設置InputField的Width為80，Height為25，輸入文本的字號為10，顏色為黑色。項目實現02任務2：菜單界面制作10.利用Dropdown制作性別選項。設置其Width為80，Height為25。11.設置性別選項的Options內容為男和女。12.

Label和Item的字號屬性設置為10。制作步驟提示13.利用ScrollView制作角色介紹，設置其Width為200，Height為80。14.

新建文本xinggejieshaotxt，用于在滾動視圖中顯示角色介紹文字，字體為“方正少兒_GBK”，字號為14，顏色為白色，行間距為1.5，文字高度為150左右，并將其設置為ScrollView下Viewport下Content的子物體。項目實現02任務2：菜單界面制作15.制作音樂設置界面，利用Toggle制作背景音樂下面的開關選項，設置Label的Text屬性為“開“，字體為”方正少兒_GBK”，Color為白色。16.將Toggle復制，更改位置及l(fā)abel標簽的Text屬性為“關”。制作步驟提示17.新建一個空物體toggleControl，為其添加一個ToggleGroup組件。18.將兩個Toggle選中，拖動到toggleControl上，使其成為toggleControl的子物體，然后將toggleControl拖動到兩個Toggle的Group屬性處，此時，開和關按鈕就變成了二選一的狀態(tài)。項目實現02任務2：菜單界面制作19.利用Slider制作音量滑塊，Width為120，NormalColor屬性為黃色，MaxValue值為100，選中WholeNumbers選項，使滑塊的數值為整數。制作步驟提示20.新建一個Text，命名為slidertxt，調整一下它的顯示位置在Slider右側，更改其Text屬性為0%，Color屬性為白色，至此，音樂設置界面布置完成。項目實現02任務3：實現菜單交互1.實現各界面按鈕間的跳轉（1）將mainpage移動到所有游戲物體的最下方，并在Inspector視圖中將其顯示出來，將其它界面隱藏。（2）將游戲設置界面顯示，其它界面如排行榜、角色設置、音樂設置及主頁均隱藏。（3）用同樣的方法，為其它的所有按鈕設置跳轉效果。制作步驟提示項目實現02任務3：實現菜單交互2.實現開始與退出游戲功能以及音量控制的交互效果（1）新建空物體gameController，為其添加gameUIEvent腳本。（2）單擊File菜單下的BuildSettings命令，在彈出的窗口中，將SampleScene和gameScene兩個場景添加到ScenesInBuild中，測試場景。制作步驟提示usingUnityEngine.UI;usingUnityEngine.SceneManagement;publicclassgameUIEvent:MonoBehaviour{publicButtonstartButton;publicButtonexitButton;publicToggletoggle1;publicSliderslider;publicTexttext1;

publicvoidOnStartGameButtonPressed()//設置開始按鈕的場景跳轉功能

{SceneManager.LoadScene("gameScene");//雙引號中的是要跳轉到場景的名稱

}publicvoidOnExitGameButtonPressed()//設置退出按鈕的功能

{Application.Quit();//實現退出游戲功能

}publicvoidOnToggleChanged1()//音樂設置界面開或關時Slider滑塊是否可用

{if(toggle1.isOn)eractable=true;//當開關打開時，Slider滑塊可用

elseeractable=false;//當開關關閉時，Slider滑塊不可用

}publicvoidOnSliderValueChanged()//設置Slider滑塊拖動時文本的顯示數值

{text1.text=slider.value.ToStr