cocos2dx-3.0(27) 坐标系介绍

～～～～我的生活，我的点点滴滴！！

参照官方的一篇文章！

讲解之前，我们先罗列出cocos2dx里面有关的函数接口：

//转换坐标到世界坐标，世界坐标又叫绝对坐标，即 游戏世界是绝对定位某一位置convertToWorldSpace(); node类//转换坐标到体地坐标系，即物体坐标系，这是一个相对位置，即A物体相对B物体的位置convertToNodeSpace(); node类//转换到屏幕坐标系convertToUI(); Director类//转换到opengl坐标系convertToGL(); Director类//得到opengl坐标系getLocation(); Touch类//下面两函数都是本地坐标系setPosition();node类getPosition();node类

Cocos2d-x坐标系和OpenGL坐标系相同，都是起源于笛卡尔坐标系,笛卡尔坐标系中定义右手系原点在左下角，x向右，y向上，z向外，OpenGL坐标系为笛卡尔右手系。标准屏幕坐标系使用和OpenGL不同的坐标系，而Cocos2d则使用和OpenGL相同的坐标系。iOS, Android, Windows Phone等在开发应用时使用的是标准屏幕坐标系，原点为屏幕左上角，x向右，y向下,Cocos2d坐标系和OpenGL坐标系一样，原点为屏幕左下角，x向右，y向上。看下面这张图片：

在开发中，我们经常会提到两个比较抽象的概念-世界坐标系和本地坐标系。这两个概念可以帮助我们更好的理解节点在Cocos2d坐标系中的位置以及对应关系。

世界坐标系(World Coordinate)也叫做绝对坐标系，是游戏开发中建立的概念。因此，“世界”指游戏世界。cocos2d中的元素是有父子关系的层级结构，我们通过Node的setPosition设定元素的位置使用的是相对与其父节点的本地坐标系而非世界坐标系。最后在绘制屏幕的时候cocos2d会把这些元素的本地坐标映射成世界坐标系坐标。

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

对于物体我们还需要提前了解一个概念------> 锚点

锚点(Anchor Point)

将一个节点添加到父节点里面时，需要设置其在父节点上的位置，本质上是设置节点的锚点在父节点坐标系上的位置。

Anchor Point的两个参数都在0~1之间。它们表示的并不是像素点，而是乘数因子。(0.5, 0.5)表示Anchor Point位于节点长度乘0.5和宽度乘0.5的地方，即节点的中心

在Cocos2d-x中Layer的Anchor Point为默认值(0, 0)，其他Node的默认值为(0.5, 0.5)。

我们用以下代码为例，使用默认Anchor Point值，将红色层放在屏幕左下角，绿色层添加到红色层上：

auto red = LayerColor::create(Color4B(255, 100, 100, 128), visibleSize.width/2, visibleSize.height/2);auto green = LayerColor::create(Color4B(100, 255, 100, 128), visibleSize.width/4, visibleSize.height/4);red->addChild(green);this->addChild(red, 0);

效果图

我们用以下代码为例，将红色层的Anchor Point设为中点放在屏幕中央，绿色层添加到红色层上，绿色层锚点为右上角。

注：因为Layer比较特殊，它默认忽略锚点，所以要调用ignoreAnchorPointForPosition()接口来改变锚点，关于ignoreAnchorPointForPosition()接口的使用说明，我们将在后面详细讲解。

auto red = LayerColor::create(Color4B(255, 100, 100, 128), visibleSize.width/2, visibleSize.height/2);red->ignoreAnchorPointForPosition(false);red->setAnchorPoint(Point(0.5, 0.5));red->setPosition(Point(visibleSize.width/2 + origin.x, visibleSize.height/2 + origin.y));auto green = LayerColor::create(Color4B(100, 255, 100, 128), visibleSize.width/4, visibleSize.height/4);green->ignoreAnchorPointForPosition(false);green->setAnchorPoint(Point(1, 1));red->addChild(green);this->addChild(red, 0);

效果图

忽略锚点(Ignore Anchor Point)

Ignore Anchor Point全称是ignoreAnchorPointForPosition，作用是将锚点固定在一个地方。如果设置其值为true，则图片资源的Anchor Pont固定为左下角，否则即为所设置的位置。

我们用以下代码为例，将两个层的ignoreAnchorPointForPosition设为true，并将绿色的层添加到红色的层上：

auto red = LayerColor::create(Color4B(255, 100, 100, 128), visibleSize.width/2, visibleSize.height/2);red->ignoreAnchorPointForPosition(true);red->setPosition(Point(visibleSize.width/2 + origin.x, visibleSize.height/2 + origin.y));auto green = LayerColor::create(Color4B(100, 255, 100, 128), visibleSize.width/4, visibleSize.height/4);green->ignoreAnchorPointForPosition(true);red->addChild(green);this->addChild(red, 0);

效果图：

VertexZ，PositionZ和zOrder

    VerextZ是OpenGL坐标系中的Z值

    PositionZ是Cocos2d-x坐标系中Z值

    zOrder是Cocos2d-x本地坐标系中Z值

在实际开发中我们只需关注zOrder。

可以通过setPositionZ接口来设置PositionZ。

以下是setPositionZ接口的说明：

 /**     * Sets the 'z' coordinate in the position. It is the OpenGL Z vertex value.     *     * The OpenGL depth buffer and depth testing are disabled by default. You need to turn them on     * in order to use this property correctly.     *     * `setPositionZ()` also sets the `setGlobalZValue()` with the positionZ as value.     *     * @see `setGlobalZValue()`     *     * @param vertexZ  OpenGL Z vertex of this node.     */    virtual void setPositionZ(float positionZ);    CC_DEPRECATED_ATTRIBUTE virtual void setVertexZ(float vertexZ) { setPositionZ(vertexZ); }

即PositionZ的值即为opengl的z值VertexZ。

同样节点的PositionZ也是决定了该节点的渲染顺序，值越大显示顺序越靠上，

但是与zOrder不同的区别在于，PositionZ是全局渲染顺序即在根节点上的渲染顺序，

而zOrder则是局部渲染顺序，即该节点在其父节点上的渲染顺序，与Node的层级有关，优先顺序是先比较全局的Z值在比较局部zOrder值。

并且Node 增加了新的函数 setGlobalZOrder() / getGlobalZOrder(),之前的旧函数 setZOrder() / getZOrder()被废弃重命名为 setLocalZOrder() / getLocalZOrder()。

用以下事例来说明:

首先看下addchild的函数定义

    void addChild(cocos2d::CCNode *child);    void addChild(cocos2d::CCNode *child,int zOrder);    void addChild(cocos2d::CCNode *child, int zOrder, int tag);

默认情况下zorder都为0，看下面的实例：

    auto red = LayerColor::create(Color4B(255, 100, 100, 255), visibleSize.width/2, visibleSize.height/2);    red->ignoreAnchorPointForPosition(false);    red->setPosition(Point(visibleSize.width / 2, visibleSize.height / 2));    auto green = LayerColor::create(Color4B(100, 255, 100, 255), visibleSize.width/4, visibleSize.height/4);    green->ignoreAnchorPointForPosition(false);    green->setPosition(Point(visibleSize.width / 2, visibleSize.height / 2 - 100));//red全局z值为1    red->setPositionZ(1);//green全局z值为1    green->setPositionZ(0);//虽然这里他的zorder为0 默认比green的小，但是他是以Z值为标准的//所以最后red依然会在green上面显示    this->addChild(red, 0);    this->addChild(green, 1);

虽然green的zOrder大于red的zOder，但是因为red的PositionZ较大，所以red还是在green上面显示。

触摸点（Touch position)
在处理触摸事件时需要用重写以下四个函数：

virtual bool onTouchBegan(Touch *touch, Event * event);    virtual void onTouchEnded(Touch *touch, Event * event);    virtual void onTouchCancelled(Touch *touch, Event * event);    virtual void onTouchMoved(Touch *touch, Event * event);

在函数中获取到touch，我们在设计游戏逻辑时需要用到触摸点在Cocos2d坐标系中的位置，就需要将touch的坐标转换成OpenGL坐标系中的点坐标。

Touch position是屏幕坐标系中的点，OpenGL position是cocos2d-x用到的OpenGL坐标系上的点坐标。通常我们在开发中会使用两个接口getLocation()和getLocationInView()来进行相应坐标转换工作。

在开发中一般使用getLocation()获取触摸点的GL坐标，而getLocation()内部实现是通过调用Director::getInstance()->convertToGL(_point);返回GL坐标。

此外，关于世界坐标系和本地坐标系的相互转换，在Node中定义了以下四个常用的坐标变换的相关方法。

    // 把世界坐标转换到当前节点的本地坐标系中    Point convertToNodeSpace(const Point& worldPoint) const;     // 把基于当前节点的本地坐标系下的坐标转换到世界坐标系中    Point convertToWorldSpace(const Point& nodePoint) const;    //基于Anchor Point把世界坐标转换到当前节点的本地坐标系中    Point convertToNodeSpaceAR(const Point& worldPoint) const;     // 基于Anchor Point把基于当前节点的本地坐标系下的坐标转换到世界坐标系中    Point convertToWorldSpaceAR(const Point& nodePoint) const;

下面通过一个例子来说明这四个方法的理解和作用:

auto sprite1 = Sprite::create("HelloWorld.png");    sprite1->setPosition(ccp(120,40));    sprite1->setAnchorPoint(ccp(0,0));    this->addChild(sprite1);  //此时添加到的是世界坐标系，也就是OpenGL坐标系    auto sprite2 = Sprite::create("HelloWorld.png");    sprite2->setPosition(ccp(-15,-120));    sprite2->setAnchorPoint(ccp(1,1));    this->addChild(sprite2); //此时添加到的是世界坐标系，也就是OpenGL坐标系    //将 sprite2 这个节点的坐标ccp(-15,-120) 转换为 sprite1节点 下的本地(节点)坐标系统的 位置坐标    Point point1 = sprite1->convertToNodeSpace(sprite2->getPosition());    //将 sprite2 这个节点的坐标ccp(-15,-120) 转换为 sprite1节点 下的世界坐标系统的 位置坐标    Point point2 = sprite1->convertToWorldSpace(sprite2->getPosition());    log("position = (%f,%f)",point1.x,point1.y);    log("position = (%f,%f)",point2.x,point2.y);

运行结果：

Cocos2d: position = (-135.000000,-160.000000)
Cocos2d: position = (105.000000,-80.000000)

Point point1 = sprite1->convertToNodeSpace(sprite2->getPosition());

这行代码是以sprite1为坐标系原点(0,0)，那么sprite2相对于sprite1的坐标位置就是偏移了一个sprite1的坐标，所以是两坐标相减

Point point2 = sprite1->convertToWorldSpace(sprite2->getPosition());

这行代码是将sprite2的坐标转换到sprite1的世界坐标系下，而其中世界坐标系是没有变化的，始终都是和OpenGL等同，只不过sprite2在变换的时候将sprite1作为了”参照“而已，也就是说世界坐标系问 sprite1 你在我的什么位置，sprite1告诉他，我在 距离你x轴为120，y轴为40的位置，这个时候世界坐标系又问 sprite2 你在我什么位置，sprite2告诉他，我在你x轴为-15， y轴为-120的位置，sprite1与sprite2彼此互不知道，那么以sprite1为基准，在他-15， -120的位置的坐标是(105, -80) 简而言之：转化为A相对于B的节点坐标，得到的点就是A-B，转化为A相对于B的世界坐标就是A+B。