目錄

1、?節(jié)點和組件

2、?節(jié)點層級和顯示順序

3、坐標系和節(jié)點變換屬性

坐標系

錨點

旋轉(zhuǎn)

縮放

尺寸

4、?常用技巧

5、參考

1、?節(jié)點和組件

Cocos Creator 的工作流程是以組件式開發(fā)為核心的，組件式架構(gòu)也稱作?組件 — 實體系統(tǒng)（或?Entity-Component System），簡單的說，就是以組合而非繼承的方式進行實體的構(gòu)建。

在 Cocos Creator 中，節(jié)點（Node）?是承載組件的實體，我們通過將具有各種功能的?組件（Component）?掛載到節(jié)點上，來讓節(jié)點具有各式各樣的表現(xiàn)和功能。

2、?節(jié)點層級和顯示順序

1. 在?層級管理器?中會按照節(jié)點排列順序依次渲染，也就是顯示在列表上面的節(jié)點會被下面的節(jié)點遮蓋住，父節(jié)點永遠是出現(xiàn)在子節(jié)點上面的，因此子節(jié)點永遠都會遮蓋住父節(jié)點。

2. 父節(jié)點移動時，父子節(jié)點會作為一個整體一起移動。

3. 性能問題

父節(jié)點可以用來組織邏輯關(guān)系甚至是當做承載子節(jié)點的容器，但節(jié)點數(shù)量過多時，場景加載速度會受影響，因此在制作場景時應(yīng)該避免出現(xiàn)大量無意義的節(jié)點，應(yīng)該盡可能合并相同功能的節(jié)點。

3、坐標系和節(jié)點變換屬性

我們將會深入了解節(jié)點所在場景空間的坐標系，以及節(jié)點的?位置（Position）、旋轉(zhuǎn)（Rotation）、縮放（Scale）、尺寸（Size）?四大變換屬性的工作原理。

坐標系

標準屏幕坐標系使用和 OpenGL 不同的坐標系，和 Cocos2d-x 坐標系有很大區(qū)別。在 iOS、Android 等平臺用原生 SDK 開發(fā)應(yīng)用時使用的是標準屏幕坐標系，原點為屏幕左上角，x 向右，y 向下。Cocos2d-x 坐標系和 OpenGL 坐標系一樣，原點為屏幕左下角，x 向右，y 向上。

1. 世界坐標系

世界坐標系也叫做絕對坐標系，在 Cocos Creator 游戲開發(fā)中表示場景空間內(nèi)的統(tǒng)一坐標體系，「世界」就用來表示我們的游戲場景。

2. 本地坐標系

本地坐標系也叫相對坐標系，是和節(jié)點相關(guān)聯(lián)的坐標系。每個節(jié)點都有獨立的坐標系，當節(jié)點移動或改變方向時，和該節(jié)點關(guān)聯(lián)的坐標系將隨之移動或改變方向。

錨點

錨點（Anchor）?是節(jié)點的另一個重要屬性，它決定了節(jié)點以自身約束框中的哪一個點作為整個節(jié)點的位置

錨點由?anchorX?和?anchorY?兩個值表示，它們是通過節(jié)點尺寸計算錨點位置的乘數(shù)因子，范圍都是?0 ~ 1?之間。(0.5, 0.5)?表示錨點位于節(jié)點長度乘 0.5 和寬度乘 0.5 的地方，即節(jié)點的中心。

錨點屬性設(shè)為?(0, 0)?時，錨點位于節(jié)點本地坐標系的初始原點位置，也就是節(jié)點約束框的左下角。

旋轉(zhuǎn)

旋轉(zhuǎn)屬性只有一個值，表示節(jié)點當前的旋轉(zhuǎn)角度。

• 角度值為?正?時，節(jié)點?逆時針?旋轉(zhuǎn)。
• 角度值為?負?時，節(jié)點?順時針?旋轉(zhuǎn)。

縮放

在子節(jié)點上設(shè)置的縮放屬性會和父節(jié)點疊加作用，子節(jié)點的子節(jié)點會將每一層級的縮放屬性全部?相乘?來獲得在世界坐標系下顯示的縮放倍率。這一點和?位置、旋轉(zhuǎn)?屬性其實是一致的，只不過?位置?和?旋轉(zhuǎn)?屬性是?相加?作用，而?縮放?屬性是?相乘，作用表現(xiàn)得更加明顯。

比如父節(jié)點縮放 0.5，子節(jié)點縮放 0.5，那么相當于 子節(jié)點變成了 0.25 的樣子。

縮放?屬性會影響當前節(jié)點的?尺寸，不影響?位置?和?旋轉(zhuǎn)，但會影響子節(jié)點的?位置?和?尺寸。（保證錨點設(shè)置正確，才會變化）

尺寸

尺寸?屬性不會直接影響子節(jié)點的尺寸（但可以通過?對齊掛件（Widget）?間接影響）

4、?常用技巧

1、Canvas 作為渲染根節(jié)點。除了有具體圖像渲染任務(wù)的節(jié)點之外，我們還會有一部分節(jié)點只負責(zé)掛載腳本，執(zhí)行邏輯，不包含任何渲染相關(guān)內(nèi)容。通常我們將這些節(jié)點放置在場景根層級，和 Canvas 節(jié)點并列。

2、創(chuàng)建空節(jié)點就能夠創(chuàng)建一個不包含任何組件的節(jié)點?？展?jié)點可以作為組織其他節(jié)點的容器，也可以用來掛載用戶編寫的邏輯和控制組件。

3、創(chuàng)建節(jié)點菜單?里下一個類別是?創(chuàng)建渲染節(jié)點，這里我們能找到像 Sprite（精靈）、Label（文字）、ParticleSystem（粒子）、Tilemap（瓦片圖）等由節(jié)點和基礎(chǔ)渲染組件組成的節(jié)點類型。

4、UI 節(jié)點?類別里可以創(chuàng)建包括 Button（按鈕）、Widget（對齊掛件）、Layout（布局）、ScrollView（滾動視圖）、EditBox（輸入框）等節(jié)點在內(nèi)的常用 UI 控件。

5、參考

1.?Cocos Creator 2.4 手冊 - 管理節(jié)點層級和顯示順序

2.?Cocos Creator 2.4 API - Node

3.?Cocos Creator 2.4 手冊 - 節(jié)點和組件

4.?Cocos Creator 2.4 手冊 - 坐標系和變換