Unity 2-4 UGUI Unity5.1 UI 案例學習

任務1：UGUI簡介

什麽是GUI：
　　遊戲的開始菜單
　　RPG遊戲的菜單欄、側邊欄和功能欄（比如背包系統、任務列表等）
　　設計用來控制移動的虛擬桿和攻擊按鈕

UGUI：
　　Unity內置
　　GUI也可以用第三方插件實現：如NGUI、DFGUI等

任務2：遊戲案例介紹

任務3：創建遊戲菜單

UGUI中的組件：
　　UI -> Panel -- 面板
　　　　Button -- 按鈕
　　　　Text -- 文本
　　　　Image -- 圖片
　　　　Raw Image -- 可拖放的材質
　　　　Slider -- 滑動器
　　　　Scrollbar -- 滾動條
　　　　Toggle -- 開關 (check box)
　　　　Input Field -- 輸入框
　　　　Canvas -- 畫布（所有的UI組件都位於Canvas下）
　　　　Event System -- 事件系統（處理有關UI的事件）

幾乎所有的UI組件都有
　　Rect Transform -- 用來控制位置和Anchor信息
　　Script腳本 -- 控制組件的功能

Button：
　　Button->Text-> Text (Script) -- 可以修改文本顯示
　　Image (Script) -- 修改背景圖片

Toggle：勾選框
　　Toggle->Label-> Text (Script) -- 修改文本顯示
　　Toggle->Background-> Image (Script) -- 修改背景圖片
　　Toggle->Background->Checkmark-> Image (Script) -- 修改勾選的標誌

Slider：滑動器
　　Slider -> Value 當前滑塊位置對應的float值 [0, 1]
　　Slider->Background-> Image (Script) -- 修改後置背景（滑動塊未滑動區域）
　　Slider->Fill Area->Fill-> Image (Script) -- 滑動條前置背景：滑動塊已滑動區域
　　Slider->Handle Slide Area->Handle (Script) -> 滑動塊背景

任務4：創建公告的文本列表

創建Image，重命名為NoteBg，作為文本的背景
　　修改Alpha值：透明度

創建另一個Image，重命名為TitleBg，作為標題背景，為Note的子物體

分別在NoteBg下和TitleBg下創建Text

給NoteBg下的Text添加上下滾動功能
　　1. 在NoteBg下創建一個Image，大小與NoteBg->Text一樣
　　2. 給Image添加Scroll Rect組件
　　　　將Text作為Image的子物體
　　　　Content屬性：指定擁有滾動功能的控件，這裏賦值Text
　　　　此時，Text就擁有了可以滾動的功能
　　　　將水平方向的滾動取消勾選 Horizontal
　　　　此時滑動了一下，發現不行，只是出現了Text能夠被拖拽走
　　3.

任務5：監聽按鈕的點擊事件

任務6：創建旋轉的小球遊戲

Siki_Unity_2-4_UGUI_Unity5.1 UI 案例學習