維克的煩惱

Now that our UI has been set up in the previous step, let’s add few widgets: NGUI menu -> Create a Widget.

This wizard lets you create some of the basic widgets. You will need to select the atlas you will want to use, as well as the font. Since you are in a brand-new project, clicking the buttons won’t have much of an effect as they only show you recently used elements. What you will want to do is Drag & Drop the atlas and font you wish to use into the fields beside the buttons. Let’s choose the SciFi Atlas for the atlas, and SciFi Font – Normal for the font.

1. Assuming you’ve chosen the SciFi Atlas as noted above, select the “Dark” sprite.
2. Click the Add To button (if the button is greyed out for you, it means you forgot to add the atlas — just find the SciFi Atlas and drag it onto the field). If you are not sure how to find it: in the Project window there is a search field next to the “Create” drop-down. Type “scifi” there.
3. Your sprite has now been created and it is currently selected. It’s also very, very small! Let’s change that. When working with NGUI, you will always be moving widgets around, scaling them, and rotating them exactly the same as any other game object — by modifying their Transform.

1. 假設你已經照上面講的選擇了SciFi Atlas，接下來把Sprite部分的框框選擇“Dark”這個小圖。(維克：請參考上面的圖。)
2. 按下Add To按鈕(假如按鈕變成灰色的，代表你忘記加入圖集了— 只要找出SciFi Atlas，再把他拖進去框框內就可以了).假如你不確定該如何找到他：在專案視窗中，在"Creat"下拉選單旁邊有一個搜尋框，在裡面打"scifi"就可以搜尋到了。
3. 你的小圖被建立，並且是在選取狀態。它也非常非常的小：讓我們來改變這點。當你使用NGUI進行工作時，你總是會藉由改變物件的 Transform屬性來移動，放大縮小以及旋轉該物件。

One important thing to note is that the Z part of the Transform is not used when working with widgets from the same atlas. Instead, you can bring them forward or push them back by adjusting the Depth parameter. If later on you end up working with multiple atlases (or multiple UI Panels), you will need to adjust the Z. The reason for this is simple — this lets you create completely flat windows that you can turn to the side without their widgets messing up the order in which they are drawn.

有一個重點要注意的是，當工具集使用同一個atlas時，Transform 屬性的Z軸部分是沒有用的。但你可以藉由調整深度(Depth)參數來把widgets往前面移動，或是往後面移動。假如你有多個圖集(或是多個UI Panels)，你才會需要調整Z軸。這理由很簡單— 你可以建立一個完全平坦的視窗，而且也不會在換到另外一邊時把繪圖的順序弄亂。

Add a couple more widgets before moving on to the next part of the tutorial. Try changing the type of the sprite to Sliced (a sprite using 9-slicing, ideal for creating borders), Tiled (a sprite that fills the entire area defined by the transform’s Scale), and Filled (a sprite that has an extra parameter that controls how much of it is visible — ideal for progress bars and sliders). If you can’t figure out one of them, don’t worry — they will be covered in the next tutorial.

再看下個教學步驟前，再多新增一些的widgets看看。試著把Template欄位中的sprite改為Sliced(一種被分為9宮格的小圖，適合用來做邊框)、Tiled拼貼(小圖會填滿整個transform的大小所定義區域)、以及Filled(有額外的參數可以控制可見範圍的大小—適合用來做進度條以及滾動條)。假如你搞不清楚這些東西也不用擔心，在下一個教學步驟將會提到。