Name: Unity 4.3 - 2D遊戲開發演練 (Unity 4.3 - 2D Game Development Walkthrough)
Uploaded: 2021-01-14T05:30:36.000Z
Duration: 28 min 22 s

In Unity 4.3 we're launching our first set of 2D features.

Unity 4.3 我們發佈了第一階段的2D工具

為此,我們用這個工具做了一個2D範例

Our 2D platformer is nicknamed 'Tower Bridge Defence'

描述倫敦鐵橋被外星人入侵的故事

It depicts London's Tower Bridge in the midst

範例完全用2D圖片和物理來呈現 讓你了解這些元素如何在Unity裡組合

影片會說明範例裡的背景、前景、角色、特效 鏡頭追跡、動作和腳本程式是如何製作的

It's a completely sprite-based, physics driven

開始之前,先來聊聊基本的Unity 2D工作

2D sample level that we hope will help you

首先,當要製作2D專案,你應該先設定工作環境為2D

understand how 2D games are put together in Unity.

可以在建立新專案時在下拉選單設定

This video will discuss the background and

或是在開發中到Edit - Project Settings - Editor調整

foreground construction, characters, effects,

這代表預設情況下，輸入的材質會 被視為2D圖片，場景視圖也會預設為2D

這個新的2D模式會採用完全的 正視圖視角來呈現你的2D遊戲

同時也會把右上角的3D小圖示都隱藏 讓工作空間更大

除此之外，Unity 2D的工作流程 是和現有的3D流程整合在一起的

如果你已經會操作原本的Unity 那Unity 2D會很好上手

Firstly, when working in 2D, you should set the

值得一提的是，你也可以混搭2D和3D共用

所以如果你想要有3D元素在你的2D遊戲裡 或2D元素在3D遊戲裡都沒有問題

現在來看看範例如何建立一個關卡

This can be done when making a new project

我們一開始勾勒關卡設計雛形 然後到Photoshop裡面去把每個圖層做出來

using the drop-down on the project wizard

然後輸出這些圖層 成為新的Sprite類型導入Unity

為了呈現出背景的視差，我們做了一些 背景元素在Sorting Layer裡

Edit - Project Settings - Editor from the top menu.

當所有背景指定到這一層後 我們可以在圖片著色器的圖層排序它們

調好位置之後也可以把圖層鎖定不能編輯

這樣的話我們編輯前景元素的時候 就不用擔心會不小心動到背景元素

This new mode gives you a completely orthographic

可以從介面右上方的圖層選單來設定

由於背景只是裝飾用的，所以 並不需要在圖片上放任何元件

in the top right of the view, giving you more space

並放入一個叫做叫做 BackgroundParallax的腳本來處裡視差

to work in. Aside from these settings the work

更多的細節可以詳查這個已經註解的腳本

flows for 2D have been designed to mirror

接下來製作角色活動的前景空間

existing Unity approaches to 3D game creation.

我們設計了倫敦鐵橋和降落在中間的飛碟

So if you already know a little about Unity

主角處於一個敵人從天而降並到處亂竄的環境

you'll be in a great position to start making

因此，每一個前景元素都需要 碰撞體(Collider)來讓主角在上面行走

大多數環境用方體碰撞就可以 除了外型比較複雜的飛碟

It's worth noting at this stage that you can

Unity提供多邊形碰撞體(Polygon Collider) 可以根據圖片外型自動產生多邊形碰撞體

so if you want to add 3D elements to your 2D game

你可以新增、移動或刪除節點 調整到更適合行走的外型

or vice versa you can do that with no worries.

為了排序前景元素我們建立了前景層 設定顯示在背景之前

Let's take a look at the demo project itself,

and how we built it up one stage at a time.

我們的主角也是在Photoshop裡面設計的 一個四肢獨立類似卡通主角雷曼的角色

We began by sketching out the level design

for this sample level and then went about

是一個以圖表化的動畫工具 可以在Photoshop裡繪製每一節點的圖

後面我們會介紹如何用這方法 製造我們的天鵝

因為身體部位分開比較好控制動畫 因此我們希望獨立每個身體部位

所以我們將身體部位獨立切開 好讓Unity在輸入時容易拆離它們

這代表我們可以為圖片單獨製作動作

In order to create parallaxing in our background later,

把這些部位放入建好的角色層 然後改變Z軸深度來改變前後順序

we kept some of the background elements separate

把這些圖片都放入一個有控制腳本 碰撞體、物理設定等等的物件

and placed them on to a Background Sorting Layer.

一旦做到這裡，就可以到動畫視窗給予圖片動作 建立待機、跑、跳、射擊和死亡的動畫

Yet another new feature of 2D development in Unity.

使用動畫視窗裡新的分鏡表功能 就可以簡單製作動作

Having assigned all of our backgrounds to this layer,

我們在父物件建立一個動畫元件 然後針對每一個子物件建立影格

we could then use the Order In Layer property

移動指標到想要的影格後調整角色部位 就會自動把變量錄到影格上

可隨時切換分鏡表和動畫曲線 使得它更容易調整設計

這些動作建立好之後我們可以 幫我們的角色設計控制狀態

we could lock the Background Sorting Layer

讓我們用程式呼叫角色執行各種動作

so that when we added foreground elements

因為不是驅動3D骨架，所以取消打勾Root Motion

we didn't need to worry about accidentally

也可以打勾Animate Physics如果 動畫要和物理行為相互作用

為了在場景走動，主角腳上有圓形碰撞體 和一個包覆整個身體的方形碰撞體

This is done using the Layers pull-down in the

這樣他可以平順地行走和跳下場景 跳起來的時候頭部也可以判定撞到

為了控制角色動作，我們寫了 一個腳本透過2D物理引擎來移動

Because the background elements are purely decorative

這代表在遊戲裡面可以指定主角和敵人 讓遊戲動態更豐富的物理行為

we did not require any additional components

我們用PlayerControl腳本來判斷角色的輸入

我們在此指定物理移動速度 同時也把輸入的值送到動畫控制器

They were parented to an empty game object

判定播放哪些動畫以及 順暢的播放分鏡表上圖片的轉變

that has a simple script to handle parallaxing

使用動畫控制建立圖片動態最大的好處是

可以調整動畫速度用來搭配物理速度 不需要額外再作任何判定

For more information you'll find this script

FixedUpdate函式會檢查每一步物理運算

在這裡我們第一件要做的事情是 把輸入的水平值傳給動畫的速度參數

Next up came the creation of the foreground elements

在我們的狀態設定裡 待機狀態到跑動需要速度參數大於0.1

that our characters would actually traverse.

當值成立時，動畫就會從待機切到跑步

We designed London's Tower Bridge with a UFO

要讓角色移動，讓它有Rigidbody2D元件 就可以為它加力道移動

同時我們也根據輸入的水平值是 大於0或小於0來處理角色面朝的方向

The character has the run of the environment

這是因為在Unity裡，按住左鍵會傳回-1 而按住右鍵會傳回+1

as enemies spawn from the skies and begin

根據輸入值呼叫一個簡單的翻轉函數 來翻轉角色的X軸縮放，讓角色面向反方向

為了判定角色是否著地 我們新增了一個Ground圖層

As such, each piece of the foreground required

並指定給全部可行走的前景物件

然後使用2D裡面的Linecast函數 檢查Ground圖層是否和角色的腳接觸

為了讓製作更容易，我們建立了 一個空白的物件當作檢查地面的標準點

在該物件上增加一個小圖示 我們就可以控制角色到地面的距離

but the UFO itself has a more complex shape.

就遊戲角度來看 角色在地面時只能做跳的動作

更多關於角色控制的資訊 可以查看範例腳本裡面的說明

It even meant that we could tweak the shape of

跟3D遊戲一樣，在2D遊戲裡 鏡頭運鏡也左右著遊戲體驗

要呈現經典的2D遊戲運鏡 我們參考了2D遊戲經典大作

任天堂或超任的超級瑪莉歐的鏡頭運作

在超級瑪莉歐世界裡鏡頭會水平移動 除了封閉的空間或關卡邊緣

在這兩類區域裡角色小幅移動 鏡頭不會追蹤

一旦角色移出區域 鏡頭又會開始追蹤角色

Foregrounds Sorting Layer, which was drawn

超級瑪莉歐的相機 用特定高度來進行垂直判定

above the backgrounds in the Tags And Layers manager.

但我們的遊戲沒有往上的長度 比較像動作平台，所以不需要這類設定

因此我們的相機在垂直判定 採用了和水平一樣的方法

Our player character was yet again designed

請看看主相機裡的CameraFollow腳本 了解鏡頭追蹤更完整的寫法和註解

遊戲中有許多特效 但最重要的是主角殺死外星人的能力

we chose to make a character with independent

主角會發射一個具有 反作用力動畫的火箭筒

首先檢查輸入，當按下Fire鍵時 產生一個火箭，播放音效並觸發火箭動畫播放

Our other option would have been to design

a sprite sheet-based animation and design each

為了可以播放其他動畫(跑步)時同時播放火箭發射 我們在動畫控制器建立了Shooting的動畫層

字幕列表影片播放

Unity 4.3 - 2D遊戲開發演練 (Unity 4.3 - 2D Game Development Walkthrough)

character

simply

function

layer