如今主流的UI解決方案是UGUI和NGUI，近年來更是以UGUI爲主，本期結合UWA學堂以及Blog的相關內容整理了《Unity引擎UI模塊知識Tree》，主要介紹了UGUI的優化、框架完善及解決方案，也涉及到NGUI和FairyGUI的內容，最後是UWA的工具篇，開發者們能夠根據報告查看問題，優化項目。html
前期咱們也整理更新過《Unity引擎渲染模塊知識Tree》和《Unity引擎資源管理模塊知識Tree》，深受開發者們的喜好，歡迎你們按照本身的興趣和須要參考取閱。數組
UGUI
框架緩存
《UGUI深度研究之源碼鑑賞》
從UI的代碼底層講起，經過理解底層代碼的原理來認知上層的有效優化方法。這裏會從源碼中深刻分析UI網格重建的實現原理，並完成了提取觸發UI重建的UI元素的代碼實現，能夠更方便、更準確地定位引發UI性能問題的UI元素，從而有針對性地作優化。
性能優化
《Unity手遊UI框架一站式解決方案》
該課程內容很是詳實、性價比極高。初級開發者能夠擁有一套完整的實戰UI框架源碼，快速進入實戰；中級及以上者能夠深刻理解框架的造成過程並在此基礎上進行修改，迭代出屬於本身的框架；語言中並無華麗的辭藻，技術則徹底以實用、穩健爲基礎。
服務器
《UI框架搭建：控件定製篇》
《UI框架搭建：消息重構篇》
《UI框架搭建：應用技巧篇》
整套框架分爲三節課程來說解：第一節課程主要講解控件側的框架搭建，第二節課程進一步講解消息流程框架搭建，最後一節則羅列咱們在研發過程當中特別推薦的高級技巧操做。該系列課程帶你從一個不一樣的視角審視UI框架，並在關鍵的地方給予踩坑預警；底層認識UI控件背後的邏輯；在搭建框架時，教你面對不一樣技術選型作出合理的取捨判斷。
框架
方案編輯器
《Unity UGUI 渲染3D對象詳解》
該課程是一個針對項目研發過程當中一個場景問題的解決方案。在UI界面中渲染3D物體是一個很是廣泛的需求，該課程講解的並非如何去渲染，而是講解在UI界面中渲染3D物體一般會遇到哪些棘手的問題，它的原理是什麼以及如何解決。經過該課程，你能夠對UI界面中渲染3D物體的原理進行掌握，同時對於大多數研發團隊中會碰到的問題和解決方案都會有一個更爲全面的瞭解。
ide
《Unity運行時動態圖集的實現》
本課程講解了Unity 運行時經過動態圖集來下降Draw Call的方法，從基本思路和實現原理切入，隨後對動態圖集的功能作了優化和擴展，附帶Demo源碼。不只包含可複用的圖集，還有空間利用效率更高的不可複用圖集的實現。
函數
《基於DOTS的UI解決方案》
本文介紹了DOTS UI解決方案，是比較早的對DOTS UI的介紹，基於0.3.0版本，主要是一些簡單的功能實現，包括Conversion、UI Mesh Batching、 RenderSystem，並作了UGUI和DOTS UI的性能對比。
工具
《UGUI 文本多語言方案》
Unity的兩套UI框架中，NGUI包含UI文本的多語言功能，而UGUI原生並不支持多語言。本文采用一套Key對應多套文本的方式，實現了遊戲內動態的語言切換，簡單、方便，又避免了插件的使用。原理講解清晰，並附上了關鍵的代碼講解，值得一讀。
《UGUI表情系統解決方案》
圖文混編是表情系統的常見問題，Unity推薦的TextMesh方式能夠混編，可是與UGUI難以整合、使用多個材質時還會帶來動態合批的問題，做者經過研究UGUI源碼和其Shader，重寫了UGUI的Text生成Mesh的方法，很好地解決了圖文混編的問題，本文詳細講解了這套表情系統解決方案，並附贈源碼。
《Unity遊戲界面解決方案: PSD For UGUI》
在遊戲開發過程當中界面系統需求變化頻繁，牽涉到人員最多，從項目長期各系統開發、維護所佔時間統計來看，界面系統所佔時間是最多的。筆者經過學習、總結，開發出這個從PSD文件直接生成Unity中Prefab資源的流程，該流程能夠高保真地在Unity中復現美術設計，減小溝通，提升遊戲總體研發效率。
《屬性雷達圖UGUI渲染器》
使用雷達圖展現角色的各個屬性值，是常見的UI界面，文中對方案的實現邏輯和思路作了詳細的講解並實際測評了效果。
《如何實現次時代美術效果—UGUI美術製做篇》
本視頻展現了使用UGUI，現場製做自定義的材質，實現酷炫的UI表現效果的過程，並講解了如何經過編寫自定義的UI組件實現複雜的UI狀態，結合動畫系統來實現動感的UI效果。
FairyGUI+NGUI
《FairyGUI插件解析及Lua導出》
本專欄做者詳細介紹了UI框架設計理念和核心內容，並經過FairyGUI的自動化邏輯，重構了UI管線，同時在插件建立和Lua腳本導出兩個環節，詳細地介紹了本身的工程操做、並對關鍵代碼進行了解析，很好地解決了重度遊戲開發中常見的反覆率高、耗時等痛點，文末還提出了編輯器化的將來擴展思路。提升遊戲工業生產力、解決開發痛點，選它！
《FairyGUI的使用技巧和優化建議》
當時做者的團隊正面臨Cocos2d向Unity的轉型，選擇了FairyGUI做爲大部分圖形界面設計和測試的工具，通過一年半的時間，很好地完成了過渡和不一樣部門的配合。文中分享了實戰中總結的7個技巧，都很實用。包括：
1）像素點擊測試功能的注意點
2）動效播放TimeScale的問題
3）列表使用的優化
4）合批
5）循環虛擬列表
6）Text影響Draw Call的例子
7）濾鏡影響Draw Call
該做者在學堂的另外一篇文章《Addressable系統解析及實踐經驗》也深受學堂用戶的歡迎。
《Unity一鍵圖集生成工具，附源碼（基於NGUI和TexturePacker）》
TexturePacker GUI是NGUI中打包管理圖集的經常使用工具，可是若是圖集較多，就會帶來不少的重複，筆者寫了這套工具來實現批量圖集的生成，從而提升效率。文中詳細講解了工具的製做過程，並附上了工程源碼。
優化
《Unity引擎渲染、UI、邏輯代碼模塊的量化分析和優化方法》
Unity引擎的渲染、UI和邏輯腳本耗時是大多數項目的Top 3耗時模塊。對此，咱們對這三個模塊進行量化地統計和分析，介紹準肯定位性能瓶頸的方法。同時，從常見的性能問題入手，分析和對比各類可行的性能優化方案，以求顯著地提高這些模塊的效率。內容包括：
- 渲染模塊的重要參數分析以及優化方法
- UI模塊瓶頸的精肯定位和優化
- C#/Lua瓶頸函數的優化方法
《Unity引擎移動遊戲性能優化全解析》
課程是在UWA DAY 2018上的分享，當時UWA已經爲超過70款移動遊戲項目進行了深度優化。在針對這些項目的性能進行深度剖析時，咱們遇到了大量的「疑難雜症」。在此，咱們將這些問題進行總結和概括，經過大量實際案例，讓你們可以瞭解和掌握如何對Unity引擎各個模塊、資源和內存管理方面的性能問題進行快速的定位和精準的分析，內容主要包括：
- 渲染、UI、加載、物理等Unity引擎各個主流模塊的「疑難雜症」分析
- 紋理、網格等主流資源的資源加載和內存管理
《Unity UI模塊優化案例精講》
對UI模塊常見的性能問題進行全方位的解析，具體分析UGUI和NGUI各自的優點和性能瓶頸所在，以及提高性能的主要方式，主要包括：
- 如何下降界面的渲染開銷
- 如何下降界面的更新開銷，以及避免峯值
- 如何高效地處理大量HUD元素等
《UGUI深度研究之優化技巧》
本課程經過講解紋理格式、紋理通道分離、紋理尺寸設置等方面，找到移動端UI紋理資源兼具效果和性能的合理格式，以此減小紋理資源加載耗時，從而減小UI的打開耗時。此外，還包括了UI製做上的常見UI製做優化思路，幫助開發者找到UI的「正確打開方式」。爲了更好地在研發後期找到瓶頸UI，這裏還提供了一個UI界面的靜態分析工具，能夠幫助開發者更直觀地分析定位「問題UI」。
隨着UI迭代和研發流程的變化，在UI資源上也會遇到一些不可避免的麻煩問題，本課程也對這些問題進行了舉例並給出了可參考的解決方案。經過學習，開發者能夠更好地對移動端UI製做進行有條理的性能把控，提高UI界面的運行效率。
《詳解UGUI Draw Call計算和Rebuild操做優化》
這是目前對UGUI Draw Call分析得最爲透徹、全面的一篇文章。經過大量舉例讓你們直接明白爲什麼UI界面中的Draw Call老是居高不下，同時讓你們掌握對Draw Call、UI重建、Overdraw等高頻實際問題的高效優化知識。
《如何實現高效UGUI性能—UGUI性能優化篇》
本視頻主要講解了如下四方面的內容：
- UGUI 中Draw Call的造成規則
- Overdraw的若干優化方式
- 經過對源碼的簡單修改，優化事件檢測的開銷
- UI 網格重建的機制和優化方法
《如何優化UGUI的ScrollRect》
UGUI的ScrollRect在加載太多物體的時候，第一次彈出界面會很是卡頓，並且不在界面裏的內容依然會參與繪製，致使毫無心義的浪費。筆者對此進行了一番研究，並將心得與你們分享。
《UGUI 下降填充率技巧兩則》
Fill Rate（填充率）是指顯卡每幀每秒可以渲染的像素數。在每幀繪製中，若是一個像素被反覆繪製的次數越多，那麼它佔用的資源也必然更多。目前在移動設備上，FillRate的壓力主要來自半透明物體。由於多數狀況下，半透明物體須要開啓 Alpha Blend 且關閉 ZTest和 ZWrite，同時若是咱們繪製像 alpha=0 這種實際上不會產生效果的顏色上去，也一樣有 Blend 操做，這是一種極大的浪費。所以，本文爲你們推薦了兩則UGUI 下降填充率的技巧，但願對你們有所幫助。
《Unity手遊開發札記——使用Shader進行UGUI的優化》
UI優化是個極其繁瑣且考驗功底的部分。筆者整理了以前工做中基於Shader來進行優化的思路和方法，以及本身構建的、代替UGUI提供的通用控件的組件，包括小地圖、Mask的使用、進度條、基於DoTween的動畫效果優化等，具備極高的參考意義。
《NGUI性能優化技巧》
包含了上、下兩節內容，上主要介紹了使 Widgets 對不一樣的屏幕尺寸進行自適應；自定義UI材質的製做；下降渲染時的Draw Call數量；解決拾取UI與場景物體的鼠標事件衝突等，下主要介紹了UI Panel 開銷原理和實例演示下降UI Panel的開銷。
《如何大幅優化NGUI的堆內存分配》
本文旨在修改NGUI的幾處底層實現，從而規避堆內存的臨時分配。文末，經過複雜的實例來這種方法進行了測試，經過比較能夠看出，該方法能夠大幅優化UI界面在運行時的堆內存分配。
對於NGUI解決方法的優化主要包括如下幾個方面：
- 對UIGeometry的頂點屬性作了緩存池，並保證OnFill時進行按需選擇
- 經過unsafe的方法來修改IndexBuffer的長度
- 填充數組前充分設置List.capacity
《高效的iPhone X適配技術方案（UGUI和NGUI）》
本文做者旨在經過改錨點的方式，分別實如今NGUI和UGUI上的iPhone X適配技術方案，並結合自身項目經驗，闡述了主要的實現細節，但願能對廣大遊戲開發團隊有借鑑意義。
《如何繞過Unity打造本身的HUD UI系統》
詳細講解如何本身實現一套UI系統渲染器，並實現HUD的高效渲染，從而解決戰鬥過程當中大量頭頂血條和傷害數字效果形成的卡頓問題，特別適合於大量HUD高頻出現的遊戲項目，內附工程源碼方便移植。
工具
《一個高效研發的制勝之道 | UWA GOT Online功能說明》
無論項目自己是否重度，性能調優永遠是上線前的必經之路。優化性能，不只須要足夠深度的分析來定位問題瓶頸，也需前瞻性的保障措施來緩解後續的優化壓力和性能風險。所以，咱們推出了UWA GOT Online，方便研發團隊在本地真機測試，並能在編輯器中搭建本地服務器查看性能數據。
《如何讀懂UWA性能報告？—UGUI篇》
《如何讀懂UWA性能報告？—NGUI篇》
UI模塊是不少開發團隊頭疼的疑難雜症之一，它的性能和UI設計師的製做及工程師的實現息息相關，兩套看上去徹底同樣的UI頗有可能在底層設計和實現上大相徑庭，所以性能也截然不同。因此咱們在UWA測評報告中也提供了UI的性能分析。
不管對於從業者仍是正在讀大學的技術萌新，學習的有效時間和我的時間都是有限的。高效學習者最在乎的是時間的價值，一個須要體系化的知識地圖就顯得尤其重要。以上就是本期爲你們梳理的Unity引擎UI模塊知識Tree，做爲體系化的知識，咱們但願你們能掌握背後的邏輯與原理，結合學習方法論並反覆實踐，可以在本身的項目中更高效地解決UI問題。同時也歡迎你們向咱們投稿，交流行業內的技術知識。