游戏是由UI构成的，每个UI元素最主要的属性就是位置和样式，本节课讲从Cocos2d-x源码角度介绍如何确定一个UI元素的位置。
课程笔记 – UI元素
const Vec2& Node::getAnchorPointInPoints() const
{
return _anchorPointInPoints;
}
/// anchorPoint getter
const Vec2& Node::getAnchorPoint() const
{
return _anchorPoint;
}
void Node::setAnchorPoint(const Vec2& point)
{
#if CC_USE_PHYSICS
if (_physicsBody != nullptr && !point.equals(Vec2::ANCHOR_MIDDLE))
{
CCLOG(“Node warning: This node has a physics body, the anchor must be in the middle, you cann’t change this to other value.”);
return;
}
#endif
if( ! point.equals(_anchorPoint))
{
_anchorPoint = point;
_anchorPointInPoints = Vec2(_contentSize.width * _anchorPoint.x, _contentSize.height * _anchorPoint.y );
_transformUpdated = _transformDirty = _inverseDirty = true;
}
}
PS: 其实说白了，AnothorPoint，就是把精灵抽象成一个点，这个点是在精灵上。setAnothorPoint(0.5,0.5),就相当于把精灵的中心位置当做精灵，当你把精灵setPosition的时候，实质上是以0.5，0.5这个锚点所在的地方为基准放置。如果你setAnothorPoint(0,0),就相当于你把做下角当做精灵，setPosition的时候是设置的左下角得位置，精灵也是相应显示的！如果不理解，看完后，再看这句话。
Node
UI元素是指sprite、label、layer、scene等基本上所有常见的元素，继承自Node类，Node类的主要作用是提供：设置UI元素的位置、根据坐标系对UI元素进行坐标计算、确定UI元素的深度值、设置UI元素的缩放因子、得到UI元素的尺寸、设置UI元素的可见性/运行状态/事件监听器/动作/调度器/颜色/Camera、绘制UI元素、对子UI元素进行操作、操作与父UI元素的关系、获取UI元素的scene/碰撞矩阵绘制元素、查询OpenGL ES状态、操作用户数据等通用函数。
位置
UI元素的位置是通过3个因素确定的。1是确定UI元素的锚点，锚点的意义在于：设置UI位置的时候，通过讲锚点放在父UI元素坐标系的某个点上；2是确定UI元素的父UI元素是谁；3是确定讲UI元素的锚点放在父UI元素的那个点。确定了这三个因素后，UI元素的位置在开发者角度就基本确定了。如果父UI、祖父UI（如果有的话）等，在layer上的位置已经确定，那么UI元素的位置就算是确定了。
Node的setAnchorPoint用于设置Node的锚点位于Node本地坐标系的位置，传入参数为位置坐标的归一化坐标。getAnchorPoint与setAnchorPoint相对应。
Node的getAnchorPointInPoints得到Node的锚点在Node本地坐标系的非归一化位置。
Node的setPosition用于设置Node的锚点在其父UI元素的本地坐标系中的位置，传入参数为位置坐标。getPosition与setPosition相对应。
Node的setNormalizedPosition用于设置Node的锚点在其父UI元素的本地坐标系中的归一化位置，传入参数为位置坐标的归一化坐标。getNormalizedPosition与setNormalizedPosition相对应。
Node的setPosition3D除了设置位置的x和y值，还设置了一个_positionZ和_globalZOrder，_globalZOrder用于排序和给事件分发器提供位置信息使用。getPosition3D与setPosition3D相对应。
Node的ignoreAnchorPointForPosition是一个内部函数，只能用于scene和layer，作用是在设置scene和layer的位置的时候，锚点按照（0，0）来设置。其他类如果使用该函数会报错。
坐标系
Cocos2d-x拥有一个世界坐标系，世界坐标系等同于OpenGL ES坐标系；然而开发者接触的基本都是本地坐标系，每个父UI元素都有一个自己的本地坐标系，子UI设置坐标的时候都是相对父UI的坐标系进行设置。
Node的getNodeToParentTransform用于获取一个Mat4的矩阵，该矩阵可以用于将Node的本地坐标系中的坐标，转换到父UI元素的坐标系中。比如Node的锚点为(0.5, 0.5)，将Node的position设置为(100, 100)，假如Node的contentsize为(50, 50)，那么在Node本地坐标系(0, 0)的点，其实是其父UI元素坐标系中的(100-50*0.5, 100-50*0.5)＝(75, 75)。setNodeToParentTransform与getNodeToParentTransform。getNodeToParentAffineTransform类似getNodeToParentTransform，区别在于getNodeToParentTransform得到的是Mat4的矩阵，getNodeToParentAffineTransform得到的是仿射变换，在有限维的情况，每个仿射变换可以由一个矩阵A和一个向量b组成。
Node的getParentToNodeTransform用于获取一个Mat4的矩阵，该矩阵可以用于父UI元素的坐标系中的坐标，转变为Node的本地坐标系中的坐标。getParentToNodeAffineTransform得到的是仿射变换。
Node的getNodeToWorldTransform用于获取一个Mat4的矩阵，该矩阵可以用于将Node的本地坐标系中的坐标，转换到世界坐标系中。getNodeToWorldAffineTransform得到的是仿射变换
Node的getWorldToNodeTransform用于获取一个Mat4的矩阵，该矩阵可以用于将世界坐标系中的一个坐标，转换到Node的本地坐标系中的坐标。getWorldToNodeAffineTransform得到的是仿射变换
Node的convertToNodeSpace是借用getWorldToNodeTransform得到的Mat4矩阵，将世界坐标，转换到Node本地坐标系中的本地坐标。反之，Node的convertToWorldSpace是借用getNodeToWorldTransform得到的Mat4矩阵，将Node本地坐标系中的本地坐标转为世界坐标。
Node的convertToNodeSpaceAR是将世界坐标，转换到以Node锚点为原点的坐标系中的坐标。反之，Node的convertToWorldSpaceAR将以Node锚点为原点的坐标系中的某一点坐标，转为世界坐标。
