目录

1、 节点和组件

2、 节点层级和显示顺序

3、坐标系和节点变换属性

坐标系

锚点

旋转

缩放

尺寸

4、 常用技巧

5、参考

1、 节点和组件

Cocos Creator 的工作流程是以组件式开发为核心的，组件式架构也称作 组件 — 实体系统（或 Entity-Component System），简单的说，就是以组合而非继承的方式进行实体的构建。

在 Cocos Creator 中，节点（Node） 是承载组件的实体，我们通过将具有各种功能的 组件（Component） 挂载到节点上，来让节点具有各式各样的表现和功能。

2、 节点层级和显示顺序

1. 在 层级管理器 中会按照节点排列顺序依次渲染，也就是显示在列表上面的节点会被下面的节点遮盖住，父节点永远是出现在子节点上面的，因此子节点永远都会遮盖住父节点。

2. 父节点移动时，父子节点会作为一个整体一起移动。

3. 性能问题

父节点可以用来组织逻辑关系甚至是当做承载子节点的容器，但节点数量过多时，场景加载速度会受影响，因此在制作场景时应该避免出现大量无意义的节点，应该尽可能合并相同功能的节点。

3、坐标系和节点变换属性

我们将会深入了解节点所在场景空间的坐标系，以及节点的 位置（Position）、旋转（Rotation）、缩放（Scale）、尺寸（Size） 四大变换属性的工作原理。

坐标系

标准屏幕坐标系使用和 OpenGL 不同的坐标系，和 Cocos2d-x 坐标系有很大区别。在 iOS、Android 等平台用原生 SDK 开发应用时使用的是标准屏幕坐标系，原点为屏幕左上角，x 向右，y 向下。Cocos2d-x 坐标系和 OpenGL 坐标系一样，原点为屏幕左下角，x 向右，y 向上。

1. 世界坐标系

世界坐标系也叫做绝对坐标系，在 Cocos Creator 游戏开发中表示场景空间内的统一坐标体系，「世界」就用来表示我们的游戏场景。

2. 本地坐标系

本地坐标系也叫相对坐标系，是和节点相关联的坐标系。每个节点都有独立的坐标系，当节点移动或改变方向时，和该节点关联的坐标系将随之移动或改变方向。

锚点

锚点（Anchor） 是节点的另一个重要属性，它决定了节点以自身约束框中的哪一个点作为整个节点的位置

锚点由 anchorX 和 anchorY 两个值表示，它们是通过节点尺寸计算锚点位置的乘数因子，范围都是 0 ~ 1 之间。(0.5, 0.5) 表示锚点位于节点长度乘 0.5 和宽度乘 0.5 的地方，即节点的中心。

锚点属性设为 (0, 0) 时，锚点位于节点本地坐标系的初始原点位置，也就是节点约束框的左下角。

旋转

旋转属性只有一个值，表示节点当前的旋转角度。

• 角度值为 正 时，节点 逆时针 旋转。
• 角度值为 负 时，节点 顺时针 旋转。

缩放

在子节点上设置的缩放属性会和父节点叠加作用，子节点的子节点会将每一层级的缩放属性全部 相乘 来获得在世界坐标系下显示的缩放倍率。这一点和 位置、旋转 属性其实是一致的，只不过 位置 和 旋转 属性是 相加 作用，而 缩放 属性是 相乘，作用表现得更加明显。

比如父节点缩放 0.5，子节点缩放 0.5，那么相当于 子节点变成了 0.25 的样子。

缩放 属性会影响当前节点的 尺寸，不影响 位置 和 旋转，但会影响子节点的 位置 和 尺寸。（保证锚点设置正确，才会变化）

尺寸

尺寸 属性不会直接影响子节点的尺寸（但可以通过 对齐挂件（Widget） 间接影响）

4、 常用技巧

1、Canvas 作为渲染根节点。除了有具体图像渲染任务的节点之外，我们还会有一部分节点只负责挂载脚本，执行逻辑，不包含任何渲染相关内容。通常我们将这些节点放置在场景根层级，和 Canvas 节点并列。

2、创建空节点就能够创建一个不包含任何组件的节点。空节点可以作为组织其他节点的容器，也可以用来挂载用户编写的逻辑和控制组件。

3、创建节点菜单 里下一个类别是 创建渲染节点，这里我们能找到像 Sprite（精灵）、Label（文字）、ParticleSystem（粒子）、Tilemap（瓦片图）等由节点和基础渲染组件组成的节点类型。

4、UI 节点 类别里可以创建包括 Button（按钮）、Widget（对齐挂件）、Layout（布局）、ScrollView（滚动视图）、EditBox（输入框）等节点在内的常用 UI 控件。

5、参考

1. Cocos Creator 2.4 手册 - 管理节点层级和显示顺序

2. Cocos Creator 2.4 API - Node

3. Cocos Creator 2.4 手册 - 节点和组件

4. Cocos Creator 2.4 手册 - 坐标系和变换