Ubuntu cocos2d-x 3.13版本游戏开发学习系列3 Cocos2d-x的坐标系

1.UI坐标和OpenGL坐标

1. UI坐标值得是移动设备,比如Andoroid手机,它们的坐标是以屏幕的左上角为原点,向右为x轴正方向,向下为Y轴正方向
2. OpenGL坐标是以屏幕的左下角为原点,向上为Y轴正向,向右为X轴正向.

Cocos2d-x默认坐标为OpenGL坐标.

2.世界坐标和模型坐标

在游戏里面,世界坐标就是相当于整块屏幕原点的坐标.也就是以屏幕的左下角为原点的OpenGL坐标系.
模型坐标就是相对于屏幕里面的某个精灵的坐标系,以精灵所在的位置为原点,向右为X轴正方向,向上为Y轴正方向.

3.4个API的解释

(1) Vec2 convertToNodeSpace(const Vec2& worldPoint). 将世界坐标转换为模型坐标
(2) Vec2 convertToNodeSpaceAR(const Vec2& worldPoint) 将世界坐标转换为模型坐标,AR代表锚点
(3) Vec2 converToWorldSpace(const Vec2& nodePonit) 将模型坐标转换为世界坐标
(4) Vec2 convertTpWorldSpaceAR(const Vec2& nodePoint) 将模型坐标转换为世界坐标.AR表示锚点

代码演示如下:

#include "HelloWorldScene.h"

USING_NS_CC;

Scene *HelloWorld::createScene() {
    // 'scene' is an autorelease object
    auto scene = Scene::create();

    // 'layer' is an autorelease object
    auto layer = HelloWorld::create();

    // add layer as a child to scene
    scene->addChild(layer);

    // return the scene
    return scene;
}

// on "init" you need to initialize your instance
bool HelloWorld::init() {
    //////////////////////////////
    // 1. super init first
    if (!Layer::init()) {
        return false;
    }

    auto visibleSize = Director::getInstance()->getVisibleSize();
    Vec2 origin = Director::getInstance()->getVisibleOrigin();

    /////////////////////////////

    //创建Nodel1  宽度为300,高度为100.
    auto nodel1 = Sprite::create("node1.png");
    nodel1->setPosition(Point(400, 500));
    nodel1->setAnchorPoint(Point(0.5, 0.5));
    this->addChild(nodel1);

    //创建Nodel2  宽度为300,高度为100
    auto nodel2 = Sprite::create("node2.png");
    nodel2->setPosition(Point(300, 300));
    nodel2->setAnchorPoint(Point(1, 0));
    this->addChild(nodel2);

    //这个是以node1的原点生成的坐标系,即node1左下角为原点.
    auto nsPos = nodel1->convertToNodeSpace(nodel2->getPosition());

    //AR代表锚点的意思,这个是以node1的锚点为原点.这个已经在代码里设置成了其中点.精灵默认锚点也是其中点
    auto nsArPos = nodel1->convertToNodeSpaceAR(nodel2->getPosition());

    log("模型2相当于模型1原点坐标的距离是:%f,%f", nsPos.x, nsPos.y);
    log("模型2相当于模型1锚点坐标的距离,看来是:%f,%f", nsArPos.x, nsArPos.y);



    //创建Nodel3  宽度为58,高度为59
    auto nodel3 = Sprite::create("orange.png");
    nodel3->setPosition(Point(100, 100));
    nodel3->setAnchorPoint(Point(1, 0));
    //吧node3添加到node1上去了,添加上去默认就是以node1左下角为原点,显然此时node3将不可见,因为已经抄错了
    nodel1->addChild(nodel3);

    log("node3相对于node1的坐标是:{%f,%f}", nodel3->getPosition().x, nodel3->getPosition().y);

    auto ns13 = nodel1->convertToNodeSpace(nodel3->getPosition());
    log("node3相对于node1的坐标是错误做法:{%f,%f}", ns13.x, ns13.y);  //这个也能看出其实转化坐标系其实是取node3的坐标与node1的距离

    //总结: 1.[node]->convertToNodeSpace 传入的 [node]世界里面其他的node坐标,来求相对于[node]的距离
    //     2.[node]->convertToNodeSpaceAR是不在以[node]模型的原点为坐标,而是以其锚地为坐标.


    auto ws13 = nodel1->convertToWorldSpace(nodel3->getPosition());
    auto wsAr13 = nodel1->convertToWorldSpaceAR(nodel3->getPosition());

    log("node3相对于node1的坐标在世界坐标系的表示:{%f,%f}", ws13.x, ws13.y);  //这个也能看出其实转化坐标系其实是取node3的坐标与node1的距离
    log("node3相对于node1(锚点)的坐标在世界坐标系的表示:{%f,%f}", wsAr13.x, wsAr13.y);  //这个也能看出其实转化坐标系其实是取node3的坐标与node1的距离

    return true;
}

结果为:

模型2相当于模型1原点坐标的距离是:50.000000,-150.000000
模型2相当于模型1锚点坐标的距离,看来是:-100.000000,-200.000000
node3相对于node1的坐标是:{100.000000,100.000000}
node3相对于node1的坐标是错误做法:{-150.000000,-350.000000}
node3相对于node1的坐标在世界坐标系的表示:{350.000000,550.000000}
node3相对于node1(锚点)的坐标在世界坐标系的表示:{500.000000,600.000000}