NGUI介紹(五)-Atlas及 Atlas Maker

2014/7/2

名師專欄 Unity 林昭自

文.圖：林昭自

前言
在前幾篇的介紹中，我們陸陸續續為各位示範許多NGUI內建的元件，但是目前我們在使用這些內建元件時，都是用NGUI所提供的圖片，在這篇技術分享文章中，我們將為各位說明要如何自己來製作這些圖片，讓我們的不管是按鈕，或是底圖，都能使用我們自己的美術圖檔。

關於Atlas
所謂的Atlas，在遊戲業界或是圖學的領域中，是指由許多小圖片所組合成的大圖片，一般說來，會使用Atlas的原因主要都是因為效能上的需求，對於Rendering Pipeline中，切換材質是相對昂貴的工作，許許多多的小圖往往意味著在Rendering Pipeline中會導致過度頻繁的材質切換，而導致效能不彰。(關於這個議題可以參考遊戲引擎設計或是圖學的書籍)因此一個商業等級的遊戲在製作上往往會選擇使用Atlas來作為顯示UI圖片的方式，NGUI這個外掛也提供了相同的功能，讓我們來使用。製作Atlas的步驟如下：

1.首先將我們要用的圖片匯入Unity中，通常就是那些按鈕的圖片。
2.接著在場景中加入一個空物件，並且在此空物件中，加入UIAtlas腳本，這個UIAtlas腳本是NGUI事先提供好的，我們直接加入即可。
3.接著新增一個材質，這個材質是要給我們的Atlas使用的，Shader可以設定成Unlit/Transparent Colored(不打光，並且具有透明屬性)，新增完畢之後，將此材質指定到Atlas中的Material欄位。
4.接著將此物件重新命名，並拖曳到Project中，使這個物件變成Prefab。
5.接著我們由上方選單 NGUI -> Open -> Atlas Maker，將Atlas Maker打開。
6.Atlas Maker用來編輯我們的Atlas包含哪些圖片，如果目前不是選擇到我們剛剛所製作的Atlas的話，可以利用Show All的功能，NGUI會去更新清單。
7.接著在Unity的Project View中挑選你要的圖片，由Atlas Maker中的”Add Update”功能，Atlas Maker便會將此圖片加入到我們的Atlas中。
8.製作完的Atlas我們便可以由Sprite元件中來挑選指定。

20140619pic003