Cocos Creator 3D 打磚塊圖文教程(一)

在線體驗連接：
http://example.creator-star.cn/block3d/

上面圖中是打磚塊遊戲的主要 3D 節點元素，Shawn 這兩天在學習 Unity 與 Creator3D 感覺到製做 3D 遊戲與 2D 遊戲最大的不一樣是 3D 遊戲是在模擬一個真實世界，下面我對打磚塊遊戲場景中的主要 3D 節點作個簡要說明。

主燈光

當咱們建立場景時，引擎爲會咱們默認建立兩個節點：燈光、攝像機。
Main Light它是一隻平行燈光，模擬真實世界中的太陽，你將它放在任何位置場景效果的變化都不大，調整角度會影響3D物體的表面的光澤。

3D攝像機

Camera 攝像機所照攝的界面就是咱們運行時所看到的畫面。

咱們這裏使用的是透視視角，它像一個錐體，經過錐體能可視化地控制攝像機的參數表現：

1. 控制錐體底部的四個點能夠調節攝像機的視野；
2. 控制底部的中心點調節攝像機的遠近；
3. 控制攝像機的position、rotation調整攝像機的位置與角度；

在【主菜單】 > 【Develop】> 【Camera Privew】能夠觀察到實時的攝像機畫面，請看下圖：

地面

ground 是用 Plane 3D 節點模擬的地面，能夠經過下面菜單建立：

Plane 像一張紙，只有x、y，能夠設置 Plane 的大小，不論怎麼設置它的 Scale y 他在場景中的高度都不會變。

咱們重點看一下地塊節點和它的組件：

能夠看到在 Creator 3D 中節點屬性已經被精簡了，只有基本的Postion、Rotation、Scale三個基本的屬性（Layer屬性還沒了解做用）。

舒適提示：2D 節點一樣如此，2D節點中的錨點、Size屬性被移到名爲 cc.UITransformComponent 的組件上了，color 被移到 cc.SpriteComponent 組件上，並且沒有Opacity屬性，由 color 屬性統一接管。

3D 物理最爲重要的是它的 cc.ModelComponent 組件，其中Mesh屬性是控制 3D 物體的形狀，好比：立方體、球體、膠囊體等，引擎內置了以下 Mesh 資源：

像"#"井號同樣的圖標就是 Mesh 資源了，它主要保存的是模型的頂點數據。除了 Mesh 屬性，還有一個與 3D 物體表現有關的就是材質了，看下圖：

這裏爲了實驗地面不一樣的貼圖，我這裏自定一個材質資源，在資源管理器中，鼠標右鍵建立 Material：

從 2D 遊戲開發過渡到 3D 有一個關鍵的點就是理解材質系統，當建立一個材質資源，看到密密麻麻的屬性時，心都麻了半截：

通過 Shawn 的連蒙帶猜，將 ground 地塊的材質設置以下：

須要注意，這樣設置的材質顏色比較暗，還要把材質屬性面板拉到底部，將 Emissive 顏色屬性設置爲白色，地板看起來就亮了。

我以前還有一種作材質的作法，使用的是無光照的材質，比使用標準材質要簡單一些：

嘗試了這麼多，總算是把地面材質給弄的像點樣子了，下面是爲地塊添加碰撞組件：

在 Creator 3D 中物理引擎不須要使用代碼激活，直接將 cc.BoxColliderComponent 組件掛在節點上便可，須要注意地面只須要掛上碰撞組件就好了，若是添加了物理剛體組件，地面會向下掉落，這不是咱們想要的。

磚塊

磚塊是使用的 Cube 3D節點建立，它的 cc.ModelComponent 默認爲 box.mesh 看下圖：

磚塊的材質須要從新定製一個，方法與前面的地面材質相同，只要咱們一修改這個材質資源，場景中的全部磚塊都會發生變化，這裏就不在嘮叨了。

下面咱們爲磚塊添加 cc.RigidbodyComponent 組件，在節點屬性面板下方點擊 Add Component 按鈕，看下圖：

Creator 3D 目前仍是預覽版本，組件沒分類，看起來顯的有點亂，RigidBody 組件在倒數第3個，還須要再添加上 BoxCollider 在倒數第5個，節點組件屬性以下：

在 RigidBody 組件上，將 Mass 設置小一點，它表示物理的質量。BoxCollider組件默認就好，IsTrigger 屬性不能勾上，勾上以後物理碰撞效果就沒有了，但能夠用代碼接收到碰撞事件。

在空中的磚塊，當你運行起來發現他會天然掉落，與地面接觸會產生碰撞，而這一切咱們都不用編寫代碼哦！

小結

將磚塊節點多複製一些在場景中，製做成一堵牆咱們的遊戲場景就差很少了，咱們下次繼續子彈球體的製做與建立，以及使用鍵盤控制攝像機移動。

感謝你的關注與閱讀，歡迎你來「Creator星球遊戲開發社區」公衆號分享你的技術與經驗，願咱們在前進的道路上砥礪前行，共同成長！

本文由博客一文多發平臺 OpenWrite 發佈！