NGUI組件參數總結
阿新 • • 發佈：2017-11-07
知新樹 寧金峰
如果你仍舊不知道怎麽設置正交相機的尺寸,那麽嘗試看看下面這圖.
UIAtlas-定義精靈的紋理圖
UIAtlas是一個容器,它包含了一堆sprite的坐標信息.如果你不熟悉這個概念.你可以這樣認為:使用一張包含很多小貼圖的大貼圖比用若幹張小貼圖更有效率.而大貼圖中的小的貼圖被稱作為精靈(sprite),大紋理成為圖集(atlas).
你使用NGUI之前都需要創建一個圖集(或使用現有的).可以從這裏了解圖集的做法.當然也可以直接使用UITexture,但它並不能應對所有問題.
Material:是描述繪制本圖集的材料.通常推薦用unlit著色器,比如用.Unlit – Transparent Colored為NGUI.
TP Import：用於導入從TexturePacker導出的精靈.只需要拖拽輸出的Txt文件和所有精靈即可.
Coordinates:這允許你從基於像素的坐標系切換為基於UV的坐標系.通常都是以像素坐標系制作,但如果你需要重新調整紋理,則要先切換為紋理坐標.
New Sprite:允許已當前選擇的精靈為範本創建新的精靈.
Delete:刪除所選精靈.
Sprite:可以通過下拉列表選擇所有正在使用的精靈.
Edit Name:重命名精靈的名稱.
Outer Rect:設置精靈的外邊框.
Inner Rect 設置精靈的內邊框,如果你不使用UISlicedSprite,可以跳過這個設置.
Padding:微調校正精靈的偏移量
Correction:基礎的校正精靈的坐標使用完美整數像素.
Show:檢查精靈在圖集中的位置.
提示
可以將精靈組織成組創建多個圖集.只要圖集共享相同的材質,那麽控件仍舊會使用很少的DrawCall.
為達到最佳效果,推薦將紋理的wrap模式設置為"Clamp"和將格式設置為"Truecolor".
將類似的紋理做成一個圖集是很好的方式,但是要盡量減少同時使用的圖集數量.
如果你是使用Texture Packer工具來創建圖集,要在輸出設置中選擇unity3d.
如果你是用photoshop創建圖集,你能通過選擇工具配合info panel面板來找出精靈的位置和尺寸.
UIFont-字體圖集
UIFont可以設置UI所使用的字體數據和材質.可以使用免費的BMFont,或使用更專業的Glyph Designer.一般只做一次字體,保存為一個預設,作為新標簽所用的字體.參數:
Import Font:用於導入Glyph Designer.或BMFont輸出的FNT(改後綴為TXT)數據.
UIAtlas:用來設置字體紋理所在的圖集,根據是否已選定UIAtlas,你會看到一下選項
如果UIAtlas已指定,你可以選擇使用字體的精靈.
如果沒有指定UIAtlas,你可以選擇用來繪制字體的材質.在NGUI中通常用"Unlit"類別下的著色器,如“Unlit – Transparent Colored".
你可以調整字體在材質紋理內的像素矩形.
快速校正完美像素坐標,四舍五入到最近的像素值.
Spacing:可以調整字符之間的間距.
Show:檢查字體在紋理貼圖中的位置.
提示
為達到最佳效果,推薦將紋理的wrap模式設置為"Clamp"和將格式設置為"Truecolor".
可以將多個字體合並為一個圖集.這樣整個UI使用這些字體,仍舊會保持一個DrawCall.
你可以給字體增加斜角,陰影,描邊等效果,只要確保BMFont導出之前你設置好足夠的邊距和間距就可以了.
UISprite-從圖集中畫一個精靈
UISprite是第二個不常用的插件(第一個是UITexture),它唯一用途就是繪制地圖集的一部分.
參數
Transform:是很重要的一個組件,每個控件都可以通過Transform來進行位置和大小的調整.它也會影響到"Make Pixel-Perfect".你可以在它和UICamera之間任選一個來進行"完美像素"的調整.
UIAtlas:用來指定所使用的圖集.拖拽或者按下左側的按鈕選擇最近使用的圖集.
Sprite:選擇圖集中使用的精靈.選擇好精靈後.點擊一下"Make Pixel-Perfect"會自動為你調整Transform的尺寸.
Depth是避免用Unity的Z排序(效率不好),而且如果你要旋轉UI窗口.單純的通過調整每個控件的Transform的Z軸來排序是不行的.所以要用這個深度來排序.
Color Tint:用來調整色調.
Make Pixel-Perfect:讓你快速調整控件的尺寸到實際像素尺寸.
Pivot:選擇部件的坐標原點位置.
Preview:預覽精靈的紋理.
提示:
如果你看到兩個控件有閃爍,意味著你設置了同樣的Depth導致了重疊,你要調整不同的深度,讓它們不重疊.
不要把多個控件混在一起,否則會影響到完美像素這個功能.添加新控件時要註意保持創建新的子對象.
也可以在使用完美像素按鈕後再移動組合控件.
Label-用指定的字體繪制一個文本標簽
UILabel被用來顯示文字.支持多行,只需要用"\n"換行即可.允許用[RrGgBb]來建立彩色文字
參數:
Transform:是很重要的一個組件,每個控件都可以通過Transform來進行位置和大小的調整.它也會影響到"Make Pixel-Perfect".你可以在它和UICamera之間任選一個來進行"完美像素"的調整.
UIFont:你可以選擇用於這個標簽的字體.你可以拖拽預設或者按下按鈕選擇最近使用的字體.
可以通過使用"\n"來決定標簽是多行還是單行,同樣可以用16進制顏色值來定義彩色文字,以[RrGgBb]開始,以[-]結束.如"Hello [FF0000]World[-]!",最後的結果是World是紅色的文字.
Line Width:用來指定文字行的最大寬度,如果是單行文本則切掉超出的.如多行文本則會根據寬度自動換行.
Multi-line:選擇該項後標簽達到最大寬度後會自動換行.
Password:勾選後字符將自動轉為星號.
Encoding:勾選後會關閉特殊字符處理,一般用於輸入框.
Depth:改邊標簽控件的層級.
Color Tint:更改文本的主色調.
Make Pixel-Perfect: 讓你快速調整控件的尺寸到實際像素尺寸.
Pivot:選擇部件的坐標原點位置.
Preview:預覽精靈的紋理.
提示:
如果你看到文本閃爍或看到被其他控件覆蓋了.那麽就要調整它的深度.
如果遇到復雜字符串(如斜體,標點,括號混合的)需要增加行寬度避免超寬.
用"\n"和顏色,僅一個標簽就可以做到下面的效果.
UIPanel-為控件分組,用於管理和優化DrawCalls
UIPanel用來負責創建實際的幾何體.不必特別添加UIPanel,只要創建一個控件,它就會自動被添加.你可以創建多個Panel,用於多個菜單.
參數:
Normals:顯示法線,用來檢查UI正反是否正確.
Gizmos:用來顯示幾何體,可供選取用.
Debug:配合調試檢查場景視圖的幾何體,如果你開啟了這個.就應該取消掉上面Gizmos這個選項.
Widgets:會顯示有多少個控件在這個Panel上.
Draw Calls:可以看到用了多少個DrawCall,這個越低越好.
Clipping:可以選擇你要顯示的部分,默認是不進行裁切的.是利用著色器進行裁切的,如果開啟這個選項,NGUI將自動切換為有裁切屬性的著色器.
如果開啟裁切.你可以通過Center和Size來設置裁切盒.單位為像素.
如果選擇柔化邊緣裁切,將會有40像素的柔化邊緣供處理柔化效果.
Material:是只讀的,可以看面板用了多少個材質.一個材質將占用一個DrawCall.
提示:
默認情況下如果沒有UIPanel的話,會被最根的控件創建並作為其父對象.而且最好讓你多個控件都用一個父對象,便於管理.
如果Panels下沒有控件.你可以放心的刪除這個面板.
如果你刪除一個存有控件的Panels,它和它下面的控件都會消失,但是當你播放時,所有控件又會重現,因為又自動創建了一個欣的UIPanel.
當沒有變化時,幾何體不會重建,這意味著如果有個完全靜止的UI,不會沒幀都去更新幾何形狀,相反它也會被重用,提高性能.
UIAnchor-能讓控件自動配合屏幕尺寸,填充滿屏和保持真實像素尺寸的UI.
UIAnchor有多種用途,其中包括在多種分辨率的屏幕的相對定位.
如果你將它放在2D UI的root上,它會自動進行完美像素處理.
如果將它用於一個對象,它將輔助對象在屏幕上的定位,比如側邊或者角落.
比如放在一個精靈上,可以用來將精靈自動填滿整個屏幕,比如做個背景.
參數:
HUD Camera是用來繪制該對象的相機,通常會自動選擇的.
Side:設置錨點,有4個邊,4個角和中心供選擇.
Half Pixel Offset:讓控件有半像素的位移以避免DirectX 9在Windows機器上的一個Bug.
Stretch To Fill:縮放填充,一般做背景時候會使用它.
Depth Offset:用於基於透視相機時調整計算點的深度.
提示:
如果對象有UIAnchor這個腳本,它自身的Transform將不接受你的修改,因為它受控於這個腳本.如果你希望添加基於這個錨點的位移,你可以添 加一個子對象.比如你希望有個控件始終在屏幕偏移(100,100)這個位置,你應該在層次面板做這樣的結 構.UI->Anchor->Offset->Widget.
UIAnchor同樣可用於非正交相機.
如果UIOrthoCamera附加到相機,用UIAnchor創建的界面將固定尺寸和位置,無論你將屏幕尺寸改成多大.
Events-NGUI強大的事件系統
UIEvents-事件系統
你可以添加下面的方法腳本到控件或者帶有碰撞盒的遊戲對象,當然也可以賦予給相機,不過需要相機同時有UICamera腳本:
void OnHover (bool isOver):當鼠標移出或者懸停在某個碰撞器上的時候返回布爾值.在觸摸設備上不會有作用.
void OnPress (bool isDown):當鼠標或者觸摸到碰撞器發生布爾值返回.
void OnSelect (bool selected):當鼠標或者觸摸從OnPress發生後的釋放將會返回這個布爾值.
void OnClick():和OnSelect的產生條件相同,當點擊或觸摸碰撞器並且沒有發生拖拽時候觸發.
void OnDrag (Vector2 delta):當移動鼠標或者觸摸按下時候位移超過特定閥值時觸發.
void OnDrop (GameObject drag):當鼠標或觸摸釋放於從發生OnDrag的不同碰撞器傷觸發.傳遞的參數是產生OnDrag的遊戲對象.
void OnInput (string text):當一個OnSelect發生後在同一個碰撞器上觸發輸入.一般只有UIInput用它.
void OnTooltip (bool show):當鼠標懸停超過tooltipDelay時間後觸發該命令.觸摸設備上不會有作用.
可以用UICamera.lastCamera找到誰發出的事件,可用UICamera.lastHit得到誰接受這個事件,以及用UICamera.lastTouchPosition得到觸摸或屏幕的位置
下面的腳本賦予一個碰撞器時,點擊這個碰撞器會輸出HelloWorld.
UICamera-可以添加到任何相機,包含事件系統.
UICamera是每個UI的重要組成部分.它負責發送Camera中所有NGUI的活動.如果場景中僅有一個Camera,要確保它附有 UICamera腳本.如果有多個相機,確保至少用來渲染UI的相機有UICamera腳本.當將這個腳本放在主相機上時,在遊戲場景中的所有都將有 OnClick, OnHover, OnDrag等事件.
參數
Tooltip Delay:設定懸停與對象多少秒才執行OnTooltip事件.
如果使用Orthographic Projection相機,建議將相機的Size的尺寸設置為當前分辨率高度的一半.比如針對iPad的屏幕1024*768分辨率,就設置Size為 384.另外一種方法是保持Size是1,縮放UI的Root為該值的倒數,比如在iPad上獲得完美尺寸你需要設置Root的縮放到1/384或者 0.002604167.第二種方法比較容易實行,不過物體在場景視圖中照比其他物體會比較小.
如果你仍舊不知道怎麽設置正交相機的尺寸,那麽嘗試看看下面這圖.
UIAtlas-定義精靈的紋理圖
UIAtlas是一個容器,它包含了一堆sprite的坐標信息.如果你不熟悉這個概念.你可以這樣認為:使用一張包含很多小貼圖的大貼圖比用若幹張小貼圖更有效率.而大貼圖中的小的貼圖被稱作為精靈(sprite),大紋理成為圖集(atlas).
你使用NGUI之前都需要創建一個圖集(或使用現有的).可以從這裏了解圖集的做法.當然也可以直接使用UITexture,但它並不能應對所有問題.
Material:是描述繪制本圖集的材料.通常推薦用unlit著色器,比如用.Unlit – Transparent Colored為NGUI.
TP Import：用於導入從TexturePacker導出的精靈.只需要拖拽輸出的Txt文件和所有精靈即可.
Coordinates:這允許你從基於像素的坐標系切換為基於UV的坐標系.通常都是以像素坐標系制作,但如果你需要重新調整紋理,則要先切換為紋理坐標.
New Sprite:允許已當前選擇的精靈為範本創建新的精靈.
Delete:刪除所選精靈.
Sprite:可以通過下拉列表選擇所有正在使用的精靈.
Edit Name:重命名精靈的名稱.
Outer Rect:設置精靈的外邊框.
Inner Rect 設置精靈的內邊框,如果你不使用UISlicedSprite,可以跳過這個設置.
Padding:微調校正精靈的偏移量
Correction:基礎的校正精靈的坐標使用完美整數像素.
Show:檢查精靈在圖集中的位置.
提示
可以將精靈組織成組創建多個圖集.只要圖集共享相同的材質,那麽控件仍舊會使用很少的DrawCall.
為達到最佳效果,推薦將紋理的wrap模式設置為"Clamp"和將格式設置為"Truecolor".
將類似的紋理做成一個圖集是很好的方式,但是要盡量減少同時使用的圖集數量.
如果你是使用Texture Packer工具來創建圖集,要在輸出設置中選擇unity3d.
如果你是用photoshop創建圖集,你能通過選擇工具配合info panel面板來找出精靈的位置和尺寸.
UIFont-字體圖集
UIFont可以設置UI所使用的字體數據和材質.可以使用免費的BMFont,或使用更專業的Glyph Designer.一般只做一次字體,保存為一個預設,作為新標簽所用的字體.參數:
Import Font:用於導入Glyph Designer.或BMFont輸出的FNT(改後綴為TXT)數據.
UIAtlas:用來設置字體紋理所在的圖集,根據是否已選定UIAtlas,你會看到一下選項
如果UIAtlas已指定,你可以選擇使用字體的精靈.
如果沒有指定UIAtlas,你可以選擇用來繪制字體的材質.在NGUI中通常用"Unlit"類別下的著色器,如“Unlit – Transparent Colored".
你可以調整字體在材質紋理內的像素矩形.
快速校正完美像素坐標,四舍五入到最近的像素值.
Spacing:可以調整字符之間的間距.
Show:檢查字體在紋理貼圖中的位置.
提示
為達到最佳效果,推薦將紋理的wrap模式設置為"Clamp"和將格式設置為"Truecolor".
可以將多個字體合並為一個圖集.這樣整個UI使用這些字體,仍舊會保持一個DrawCall.
你可以給字體增加斜角,陰影,描邊等效果,只要確保BMFont導出之前你設置好足夠的邊距和間距就可以了.
UISprite-從圖集中畫一個精靈
UISprite是第二個不常用的插件(第一個是UITexture),它唯一用途就是繪制地圖集的一部分.
參數
Transform:是很重要的一個組件,每個控件都可以通過Transform來進行位置和大小的調整.它也會影響到"Make Pixel-Perfect".你可以在它和UICamera之間任選一個來進行"完美像素"的調整.
UIAtlas:用來指定所使用的圖集.拖拽或者按下左側的按鈕選擇最近使用的圖集.
Sprite:選擇圖集中使用的精靈.選擇好精靈後.點擊一下"Make Pixel-Perfect"會自動為你調整Transform的尺寸.
Depth是避免用Unity的Z排序(效率不好),而且如果你要旋轉UI窗口.單純的通過調整每個控件的Transform的Z軸來排序是不行的.所以要用這個深度來排序.
Color Tint:用來調整色調.
Make Pixel-Perfect:讓你快速調整控件的尺寸到實際像素尺寸.
Pivot:選擇部件的坐標原點位置.
Preview:預覽精靈的紋理.
提示:
如果你看到兩個控件有閃爍,意味著你設置了同樣的Depth導致了重疊,你要調整不同的深度,讓它們不重疊.
不要把多個控件混在一起,否則會影響到完美像素這個功能.添加新控件時要註意保持創建新的子對象.
也可以在使用完美像素按鈕後再移動組合控件.
Label-用指定的字體繪制一個文本標簽
UILabel被用來顯示文字.支持多行,只需要用"\n"換行即可.允許用[RrGgBb]來建立彩色文字
參數:
Transform:是很重要的一個組件,每個控件都可以通過Transform來進行位置和大小的調整.它也會影響到"Make Pixel-Perfect".你可以在它和UICamera之間任選一個來進行"完美像素"的調整.
UIFont:你可以選擇用於這個標簽的字體.你可以拖拽預設或者按下按鈕選擇最近使用的字體.
可以通過使用"\n"來決定標簽是多行還是單行,同樣可以用16進制顏色值來定義彩色文字,以[RrGgBb]開始,以[-]結束.如"Hello [FF0000]World[-]!",最後的結果是World是紅色的文字.
Line Width:用來指定文字行的最大寬度,如果是單行文本則切掉超出的.如多行文本則會根據寬度自動換行.
Multi-line:選擇該項後標簽達到最大寬度後會自動換行.
Password:勾選後字符將自動轉為星號.
Encoding:勾選後會關閉特殊字符處理,一般用於輸入框.
Depth:改邊標簽控件的層級.
Color Tint:更改文本的主色調.
Make Pixel-Perfect: 讓你快速調整控件的尺寸到實際像素尺寸.
Pivot:選擇部件的坐標原點位置.
Preview:預覽精靈的紋理.
提示:
如果你看到文本閃爍或看到被其他控件覆蓋了.那麽就要調整它的深度.
如果遇到復雜字符串(如斜體,標點,括號混合的)需要增加行寬度避免超寬.
用"\n"和顏色,僅一個標簽就可以做到下面的效果.
UIPanel-為控件分組,用於管理和優化DrawCalls
UIPanel用來負責創建實際的幾何體.不必特別添加UIPanel,只要創建一個控件,它就會自動被添加.你可以創建多個Panel,用於多個菜單.
參數:
Normals:顯示法線,用來檢查UI正反是否正確.
Gizmos:用來顯示幾何體,可供選取用.
Debug:配合調試檢查場景視圖的幾何體,如果你開啟了這個.就應該取消掉上面Gizmos這個選項.
Widgets:會顯示有多少個控件在這個Panel上.
Draw Calls:可以看到用了多少個DrawCall,這個越低越好.
Clipping:可以選擇你要顯示的部分,默認是不進行裁切的.是利用著色器進行裁切的,如果開啟這個選項,NGUI將自動切換為有裁切屬性的著色器.
如果開啟裁切.你可以通過Center和Size來設置裁切盒.單位為像素.
如果選擇柔化邊緣裁切,將會有40像素的柔化邊緣供處理柔化效果.
Material:是只讀的,可以看面板用了多少個材質.一個材質將占用一個DrawCall.
提示:
默認情況下如果沒有UIPanel的話,會被最根的控件創建並作為其父對象.而且最好讓你多個控件都用一個父對象,便於管理.
如果Panels下沒有控件.你可以放心的刪除這個面板.
如果你刪除一個存有控件的Panels,它和它下面的控件都會消失,但是當你播放時,所有控件又會重現,因為又自動創建了一個欣的UIPanel.
當沒有變化時,幾何體不會重建,這意味著如果有個完全靜止的UI,不會沒幀都去更新幾何形狀,相反它也會被重用,提高性能.
UIAnchor-能讓控件自動配合屏幕尺寸,填充滿屏和保持真實像素尺寸的UI.
UIAnchor有多種用途,其中包括在多種分辨率的屏幕的相對定位.
如果你將它放在2D UI的root上,它會自動進行完美像素處理.
如果將它用於一個對象,它將輔助對象在屏幕上的定位,比如側邊或者角落.
比如放在一個精靈上,可以用來將精靈自動填滿整個屏幕,比如做個背景.
參數:
HUD Camera是用來繪制該對象的相機,通常會自動選擇的.
Side:設置錨點,有4個邊,4個角和中心供選擇.
Half Pixel Offset:讓控件有半像素的位移以避免DirectX 9在Windows機器上的一個Bug.
Stretch To Fill:縮放填充,一般做背景時候會使用它.
Depth Offset:用於基於透視相機時調整計算點的深度.
提示:
如果對象有UIAnchor這個腳本,它自身的Transform將不接受你的修改,因為它受控於這個腳本.如果你希望添加基於這個錨點的位移,你可以添 加一個子對象.比如你希望有個控件始終在屏幕偏移(100,100)這個位置,你應該在層次面板做這樣的結 構.UI->Anchor->Offset->Widget.
UIAnchor同樣可用於非正交相機.
如果UIOrthoCamera附加到相機,用UIAnchor創建的界面將固定尺寸和位置,無論你將屏幕尺寸改成多大.
Events-NGUI強大的事件系統
UIEvents-事件系統
你可以添加下面的方法腳本到控件或者帶有碰撞盒的遊戲對象,當然也可以賦予給相機,不過需要相機同時有UICamera腳本:
void OnHover (bool isOver):當鼠標移出或者懸停在某個碰撞器上的時候返回布爾值.在觸摸設備上不會有作用.
void OnPress (bool isDown):當鼠標或者觸摸到碰撞器發生布爾值返回.
void OnSelect (bool selected):當鼠標或者觸摸從OnPress發生後的釋放將會返回這個布爾值.
void OnClick():和OnSelect的產生條件相同,當點擊或觸摸碰撞器並且沒有發生拖拽時候觸發.
void OnDrag (Vector2 delta):當移動鼠標或者觸摸按下時候位移超過特定閥值時觸發.
void OnDrop (GameObject drag):當鼠標或觸摸釋放於從發生OnDrag的不同碰撞器傷觸發.傳遞的參數是產生OnDrag的遊戲對象.
void OnInput (string text):當一個OnSelect發生後在同一個碰撞器上觸發輸入.一般只有UIInput用它.
void OnTooltip (bool show):當鼠標懸停超過tooltipDelay時間後觸發該命令.觸摸設備上不會有作用.
可以用UICamera.lastCamera找到誰發出的事件,可用UICamera.lastHit得到誰接受這個事件,以及用UICamera.lastTouchPosition得到觸摸或屏幕的位置
下面的腳本賦予一個碰撞器時,點擊這個碰撞器會輸出HelloWorld.
本文出自 “13233523” 博客，請務必保留此出處http://13243523.blog.51cto.com/13233523/1979252
NGUI組件參數總結