NGUI Tutorial: Step 1

NGUI Tutorial: Step 1 Creating Your UI

  1. Create a brand-new scene.
  2. Select and delete the Main Camera.
  3. Open the NGUI menu and select Create a New UI — this will open up the UI Creation Wizard.
  4. On this panel you can choose which layer to place your UI on, but we’ll just use the Default layer. Click theCreate Your UI button.
  5. That’s it. Your UI is now ready to be used.

NGUI 教學:第一步 建立使用者介面

  1. 建立一個全新的場景。
  2. 選擇主攝影機,並且將其刪除。
  3. 打開NGUI選單然後選擇Create a New UI — 這會打開一個UI(使用者介面)建立精靈。
  4. 在這個面板中你可以選擇要將UI放到哪個layer(層), 但這裡我們使用原本的Default layer. 按下Create Your UI 按鈕。
  5. 就這樣,UI已經準備好可以使用了。

Note that when using NGUI in an existing project you will skip step 2, and you will want to specify a proper UI layer before step 4. You should also make sure that other cameras (such as your Main Camera) don’t draw the layer you will choose for your UI.

注意,當你在既有的專案中使用NGUI時要跳過第二步,並且在第四步前指定一個合適的UI層。你也要注意其他的攝影機(譬如說你的主攝影機),並不會繪出你所選擇的UI層。

Before moving on, let’s examine what the wizard has created for us.

  1. 2D Root object has a UIRoot script on it. This script rescales the object it’s on to be 2/ScreenHeight in size, letting you specify widget coordinates in pixels and still have them be relatively small when compared to the rest of your game world.
  2. Camera object contains the Camera and the UICamera script. The UICamera script contains NGUI’s event system.
  3. Anchor contains the UIAnchor script. Although this script can be used to “attach” widgets to sides of the screen, in this case it’s used to apply a half-pixel offset on Windows machines, for pixel-perfect results.
  4. Panel object has a UIPanel on it. The UIPanel is a container that will collect all UI widgets under it and will combine them into as few draw calls as possible.

You may also notice that the Panel game object is currently selected. This is a hint — all widgets you will be adding in the next step will be automatically parented to the pane

在開始前,讓我們看一下建立精靈為我們建立了些什麼。

  1. 2D 根物件有一個UIRoot腳本。 這個腳本會將它所在位置的物件重新調整大小為 2/ScreenHeight,這讓你能夠以畫素指定工具集座標,並且依然能保持與你的遊戲世界的其餘部分的相對大小。
  2. Camera物件包含了Camera與UICamera腳本。UICamera腳本包含了NGUI的事件系統。
  3. Anchor (錨) 包含了UIAnchor腳本。這個腳本能被用來將工具集"貼到"螢幕的邊緣。但在這個例子中,他只是用來提供Windows機器上的半畫素的位移,讓畫面能更好看。(維克:DirectX 9在Windows機器上似乎有一個Bug.而Anchor能夠提供半像素的位移用來避免這問題,大概是這意思 )
  4. Panel 物件有一個 UIPanel腳本在裡面. UIPanel是一個容器用來把工具急收集到它裡面,並且把它們合再一起以求盡可能地減少繪圖呼叫(draw calls)。 

You may also notice that the Panel game object is currently selected. This is a hint — all widgets you will be adding in the next step will be automatically parented to the panel.

你可能注意到,Panel這個遊戲物件現在是選取的狀態。這是個暗示—所有你在下一個步驟加入的工具集都會自動把panel物件當成父物件。

 
 

  按個讚!~支持本站!~

FB推薦載入中