Unity中使用Tilemap快速創建2D游戲世界(轉)

本文轉自這里
Tilemap

首先,介紹一下Tilemap的基本概念,Tilemap用起來其實就和現實中畫畫一樣,它由以下五個基本部分組成:

image

(圖 01)

  • Sprite(精靈):紋理的容器。大型紋理圖集可以轉換為精靈圖集(Sprite Sheet)。

  • Tile(瓦片):包含一個精靈,以及二個屬性,顏色和碰撞體類型。使用瓦片就像在畫布上畫畫一樣,畫畫時可以設置一些顏色和屬性。

  • Palette(調色板):當你在畫布(Canvas)上畫畫時,會需要一個位置來保存繪畫的結果。類似地,調色板(Palette)的功能就是保存瓦片,將它們繪制到網格上。

  • Brush(筆刷):用于將畫好的東西繪制到畫布上。使用Tilemap時,可以在多個筆刷中任意選擇,繪制出線條、方塊等各種形狀。

  • Tilemap(瓦片地圖):類似Photoshop中的圖層,我們可以在Tilemap上畫上Tile。

Tilemap部分其它工具:

  • Grid(網格):用于控制網格屬性的組件。Tilemap是Grid的子對象。Grid類似于UI Canvas(UI畫布)。

  • Tilemap渲染器(Tilemap Renderer):用于控制Tile在Tilemap上的渲染,控制諸如排序、材質和遮罩等。

如何使用Tilemap

在層級窗口中,依次點擊Create->2D Object->Tilemap 新建Tilemap,這將自動創建兩個GameObject對象,一個是名為Grid的父對象,上面帶有Grid組件。另一個是名為Tilemap的子對象,它在Grid對象下,帶有Tilemap和Tilemap Renderer組件。

然后依次點擊Window->Tile Palette打開調色板窗口。在調色板窗口中,選擇Create New Palette,如圖02所示。設置名字和屬性,然后指定保存位置。

image

(圖 02)

現在要向調色板加入新瓦片,拖動精靈到調色板中,會打開一個新窗口,詢問瓦片的保存位置。你也可以通過精靈圖集拖動多個瓦片。在調色板中有了瓦片后,要想把瓦片添加到Tilemap上,你必須選擇一個瓦片再拖動它。瓦片加入調色板后,就可以用筆刷繪制場景了。

使用Tilemap中的碰撞體

當繪制好場景后,角色還不能在場景的地面上移動,因為還沒添加碰撞體。在Tilemap中添加碰撞體十分簡單,只要給Tilemap對象加入一個Tilemap Collider 2D組件即可。可以看到,這個組件自動為該Tilemap上的所有瓦片都加入了碰撞體。

image

(圖 03)

但這樣會有個問題。從圖03中可以看出,有很多碰撞體(綠色邊框表示),但是大部分碰撞體其實是沒用的,因為角色不會接觸到那些瓦片。

我們可以通過再添加Composite Collider來優化這里的碰撞體,Rigidbody 2D組件會隨著Composite Collider自動添加。因為平臺不會移動,所以要記得將Rigidbody 2D上的Body Type屬性設置為Static。最后在Tilemap Collider 2D上勾選Used By Composite,在整個平臺周圍生成一個復合碰撞體。設置好后的檢視窗口如圖04所示。

image

(圖 04)

這樣我們的Tilemap部分就完成了。

Cinemachine 2D

Cinemachine可在 Asset Store資源商店免費下載,最新版已經支持在2D游戲中使用。

首先依次點擊Cinemachine -> Create 2D Camera,創建新的虛擬攝像機。

image

(圖 05)

如果這是你首次添加該組件到場景中,它還會自動添加一個Cinemachine Brain到你的攝像機上,并創建一個帶有Cinemachine Virtual Camera組件的GameObject對象。我們可以將我們的角色設為跟隨對象,即下圖中的Follow屬性。在2D下設置虛擬攝像機的過程和3D中的一樣。

image

(圖 06)

在2D游戲開發中,一個很常用的組件是Cinemachine Confiner 2D。用它可以設置Bounding Shape 2D來將攝像機限制在某個區域中,讓我們的攝像機不會移出關卡,例如在角色掉出地圖時。

image

(圖 07 完成后的效果,攝像機不再會移出關卡界面外 )

2d-extras

為了提高開發速度,Unity創建了名為2d-extras的GitHub代碼庫,這里面的工具都是基于Tilemap制作,有很多實用的瓦片和筆刷,下面介紹幾個2d-extras中的實用工具。

規則瓦片(Rule Tile)

2d-extras中最重要的工具之一就是規則瓦片(Rule Tile)。不用這個工具的話,我們每次在Tilemap上繪制時,都要從調色板選取特定瓦片再進行繪制。如果你想要繪制相鄰瓦片,例如一個拐角,你需要從調色板上一次次選取不同瓦片進行繪制。這種方法效率不高。但有了規則瓦片,你可以為相鄰瓦片設置一組規則,它將自動選擇最合適的瓦片進行繪制。

image

(圖 08演示規則瓦片的使用效果

image

(圖 09規則瓦片的詳細設置 )

隨機瓦片和動畫瓦片

2d-extras中還有隨機瓦片和動畫瓦片。在使用不同的變體繪制相同的對象時,這兩個工具十分有用。你可以在項目中找到包含規則瓦片、隨機瓦片和動畫瓦片的Custom Tile Palette。創建新的Tilemap,然后設置它的排序圖層為Foreground。在Custom Tile Palette中,選擇任一草地瓦片,將該瓦片畫在地面圖層上。必須確保Active Tilemap設為你想要繪制的Tilemap。

image

(圖 10 隨機瓦片的使用效果

Custom Tiles Palette包含瀑布瓦片。如果選中瀑布規則瓦片,也就是Waterfall-RuleTile,可以看到它的導出類型為動畫(Animate)。這樣就可以為每個瓦片指定動畫幀。

image

(圖 11)

使用自定義筆刷繪制3D對象

在2d-extras中,還加入了預制件筆刷(Prefab Brush)。它能用預制件而不是瓦片來繪制畫面。預制件可以是3D對象、粒子效果或是動畫對象。要想創建自己的預制件筆刷,只要在項目窗口點擊Create -> Prefab Brush即可。然后選取剛創建的預制件筆刷,指定想要畫出的預制件。如果你添加了不止一個預制件,它會在這些預制件中隨機選取進行繪制。

image

(圖 12 預制件筆刷繪制效果)

制作出《超級馬里奧》的2D和3D混合效果?

現在來做點別的東西。Nintendo Switch上剛推出的《超級馬里奧》中,有一些關卡混合了2D和3D的畫面,這種效果十分讓人印象深刻。如何在Unity中實現這個效果呢?

image

(圖 13 超級馬里奧游戲畫面

正常情況下,攝像機會直接渲染到你的屏幕。我們如何能讓攝像機看到內容并顯示在另一個對象上呢?你可能注意到攝像機有一個屬性,叫目標紋理(Target Texture)。

image

(圖 14)

我們要在Asset文件夾里新建一個渲染紋理(Render Texture),添加到攝像機上。你可以在項目窗口依次點擊Create -> Render Texture來新建渲染紋理。創建好后,你可以將它拖到攝像機上的Target Texture屬性中。攝像機這時會將所有對象都渲染到這個紋理上。如果現在進入運行模式,游戲畫面將呈現為一片漆黑,因為目前沒有激活的攝像機渲染到屏幕上。

現在,我們要加入一個新攝像機到場景中,攝像機的Projection屬性為Perspective。在攝像機前添加一個新的3D對象,本例中,我們添加的是圓柱體。然后創建新材質,其Shader屬性設為Unlit/Texture,再將剛剛創建的渲染紋理拖到這個材質上的Main Texture部分。

得到的效果如下圖。

image

(圖 15)

這樣一來,我們就實現了類似《超級馬里奧》中的2D和3D混合效果,是不是很簡單!

?著作權歸作者所有,轉載或內容合作請聯系作者
平臺聲明:文章內容(如有圖片或視頻亦包括在內)由作者上傳并發布,文章內容僅代表作者本人觀點,簡書系信息發布平臺,僅提供信息存儲服務。
  • 序言:七十年代末,一起剝皮案震驚了整個濱河市,隨后出現的幾起案子,更是在濱河造成了極大的恐慌,老刑警劉巖,帶你破解...
    沈念sama閱讀 228,333評論 6 531
  • 序言:濱河連續發生了三起死亡事件,死亡現場離奇詭異,居然都是意外死亡,警方通過查閱死者的電腦和手機,發現死者居然都...
    沈念sama閱讀 98,491評論 3 416
  • 文/潘曉璐 我一進店門,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人,你說我怎么就攤上這事。” “怎么了?”我有些...
    開封第一講書人閱讀 176,263評論 0 374
  • 文/不壞的土叔 我叫張陵,是天一觀的道長。 經常有香客問我,道長,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 62,946評論 1 309
  • 正文 為了忘掉前任,我火速辦了婚禮,結果婚禮上,老公的妹妹穿的比我還像新娘。我一直安慰自己,他們只是感情好,可當我...
    茶點故事閱讀 71,708評論 6 410
  • 文/花漫 我一把揭開白布。 她就那樣靜靜地躺著,像睡著了一般。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發上,一...
    開封第一講書人閱讀 55,186評論 1 324
  • 那天,我揣著相機與錄音,去河邊找鬼。 笑死,一個胖子當著我的面吹牛,可吹牛的內容都是我干的。 我是一名探鬼主播,決...
    沈念sama閱讀 43,255評論 3 441
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼!你這毒婦竟也來了?” 一聲冷哼從身側響起,我...
    開封第一講書人閱讀 42,409評論 0 288
  • 序言:老撾萬榮一對情侶失蹤,失蹤者是張志新(化名)和其女友劉穎,沒想到半個月后,有當地人在樹林里發現了一具尸體,經...
    沈念sama閱讀 48,939評論 1 335
  • 正文 獨居荒郊野嶺守林人離奇死亡,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內容為張勛視角 年9月15日...
    茶點故事閱讀 40,774評論 3 354
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發現自己被綠了。 大學時的朋友給我發了我未婚夫和他白月光在一起吃飯的照片。...
    茶點故事閱讀 42,976評論 1 369
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖,靈堂內的尸體忽然破棺而出,到底是詐尸還是另有隱情,我是刑警寧澤,帶...
    沈念sama閱讀 38,518評論 5 359
  • 正文 年R本政府宣布,位于F島的核電站,受9級特大地震影響,放射性物質發生泄漏。R本人自食惡果不足惜,卻給世界環境...
    茶點故事閱讀 44,209評論 3 347
  • 文/蒙蒙 一、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧,春花似錦、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 34,641評論 0 26
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽。三九已至,卻和暖如春,著一層夾襖步出監牢的瞬間,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 35,872評論 1 286
  • 我被黑心中介騙來泰國打工, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留,地道東北人。 一個月前我還...
    沈念sama閱讀 51,650評論 3 391
  • 正文 我出身青樓,卻偏偏與公主長得像,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子,可洞房花燭夜當晚...
    茶點故事閱讀 47,958評論 2 373

推薦閱讀更多精彩內容