Cocos2d-x坐標系介紹

目前成都創(chuàng)新互聯(lián)公司已為1000+的企業(yè)提供了網(wǎng)站建設、域名、網(wǎng)頁空間、網(wǎng)站托管、服務器租用、企業(yè)網(wǎng)站設計、于都網(wǎng)站維護等服務，公司將堅持客戶導向、應用為本的策略，正道將秉承"和諧、參與、激情"的文化，與客戶和合作伙伴齊心協(xié)力一起成長，共同發(fā)展。

在圖形圖像和游戲應用開發(fā)中坐標系是非常重要的，我們在Android和iOS等平臺應用開發(fā)的時候使用的二維坐標系它的原點是在左上角的。而在Cocos2d-x坐標系中它原點是在左下角的，而且Cocos2d-x坐標系又可以分為：世界坐標和模型坐標。

UI坐標

UI坐標就是Android和iOS等應用開發(fā)的時候使用的二維坐標系。它的原點是在左上角的。

UI坐標原點是在左上角，x軸向右為正，y軸向下為正。我們在Android和iOS等平臺使用的視圖、控件等都是遵守這個坐標系。然而在Cocos2d-x默認不是采用UI坐標，但是有的時候也會用到UI坐標，例如在觸摸事件發(fā)生的時候，我們會獲得一個觸摸對象（Touch），觸摸對象（Touch）提供了很多獲得位置信息的函數(shù)，如下面代碼所示：

使用getLocationInView()函數(shù)獲得觸摸點坐標事實上就是UI坐標，它的坐標原點在左上角。而不是Cocos2d-x默認坐標，我們可以采用下面的語句進行轉換：

通過上面的語句就可以將觸摸點位置從UI坐標轉換為OpenGL坐標，OpenGL坐標就是Cocos2d-x默認坐標。

OpenGL坐標

我們在上面提到了OpenGL坐標，OpenGL坐標是種三維坐標。由于Cocos2d-x底層采用OpenGL渲染，因此的默認坐標就是OpenGL坐標，只不過只采用兩維（x和y軸）。如果不考慮z軸，OpenGL坐標的原點在左下角。

提示: 三維坐標根據(jù)z軸的指向不同分為：左手坐標和右手坐標。右手坐標是z軸指向屏幕外。左手坐標是z軸指向屏幕里.OpenGL坐標是右手坐標，而微軟平臺的Direct3D[1]是左手坐標。

世界坐標和模型坐標

由于OpenGL坐標有可以分為：世界坐標和模型坐標，所以Cocos2d-x的坐標也有世界坐標和模型坐標。

你是否有過這樣的問路經(jīng)歷：張三會告訴你向南走一公里，再向東走500米。而李四會告訴你向右走一公里，再向左走500米。這里兩種說法或許都可以找到你要尋找的地點。張三采用的坐標是世界坐標，他把地球作為參照物，表述位置使用地理的東、南、西和北。而李四采用的坐標是模型坐標，他讓你自己作為參照物，表述位置使用你的左邊、你的前邊、你的右邊和你的后邊。

我們看看圖3-21，從圖中可以看到A的坐標是(5,5)，B的坐標是(4,6)，事實上這些坐標值就是世界坐標。如果采用A的模型坐標來描述B的位置，則B的坐標是(1,-1)。

有的時候我們需要將世界坐標與模型坐標互相轉換。我們可以通過Node對象如下函數(shù)實現(xiàn)：

Point convertToNodeSpace ( const Point & worldPoint )。將世界坐標轉換為模型坐標。

Point convertToNodeSpaceAR ( const Point & worldPoint )。將世界坐標轉換為模型坐標。AR表示相對于錨點。

Point convertTouchToNodeSpace ( Touch * touch )。將世界坐標中觸摸點轉換為模型坐標。

Point convertTouchToNodeSpaceAR ( Touch * touch )。將世界坐標中觸摸點轉換為模型坐標。AR表示相對于錨點。

Point convertToWorldSpace ( const Point & nodePoint )。將模型坐標中觸摸點轉換為世界坐標。

Point convertToWorldSpaceAR ( const Point & nodePoint )。將模型坐標中觸摸點轉換為世界坐標。AR表示相對于錨點。

下面我們通過兩個例子了解一下世界坐標與模型坐標互相轉換。

1、世界坐標轉換為模型坐標

下面是世界坐標轉換為模型坐標實例運行結果。

在游戲場景中有兩個Node對象，其中Node1的坐標是(400, 500)，大小是300 x 100像素。Node2的坐標是(200, 300)，大小也是300 x 100像素。這里的坐標事實上就是世界坐標，它的坐標原點是屏幕的左下角。

編寫代碼如下：

bool HelloWorld::init()
{
   
    if( !Layer::init() )
    {
         returnfalse;
    }
 
    SizevisibleSize = Director::getInstance()->getVisibleSize();
    Pointorigin = Director::getInstance()->getVisibleOrigin();
    autocloseItem = MenuItemImage::create(
         "CloseNormal.png",
         "CloseSelected.png",
         CC_CALLBACK_1(HelloWorld::menuCloseCallback,this));
 
    closeItem->setPosition(Point(origin.x+ visibleSize.width - closeItem->getContentSize().width/2 ,
         origin.y+ closeItem->getContentSize().height/2));
 
    automenu = Menu::create(closeItem, NULL);
    menu->setPosition(Point::ZERO);
    this->addChild(menu,1);
    //創(chuàng)建背景
    autobg = Sprite::create("bg.png");                                                                                         ①
    bg->setPosition(Point(origin.x+ visibleSize.width/2,
         origin.y+ visibleSize.height/2));
 
    this->addChild(bg,0);                                                                                                                      ②
    //創(chuàng)建Node1
    autonode1 = Sprite::create("node1.png");                                                                           ③
    node1->setPosition(Point(400,500));
    node1->setAnchorPoint(Point(1.0,1.0));
 
    this->addChild(node1,0);                                                                                                               ④
    //創(chuàng)建Node2
    autonode2 = Sprite::create("node2.png");                                                                           ⑤
    node2->setPosition(Point(200,300));         
    node2->setAnchorPoint(Point(0.5,0.5));
 
    this->addChild(node2,0);                                                                                                               ⑥
 
    PointPoint1 = node1->convertToNodeSpace(node2->getPosition());                                      ⑦
    PointPoint3 = node1->convertToNodeSpaceAR(node2->getPosition());                                 ⑧
   
    log("Node2NodeSpace = (%f,%f)",Point1.x,Point1.y);
    log("Node2NodeSpaceAR = (%f,%f)",Point3.x,Point3.y);
 
    returntrue;
}

代碼①~②行是創(chuàng)建背景精靈對象，這個背景是一個白色900 x 640像素的圖片。代碼第③~④行是創(chuàng)建Node1對象，并設置了位置和錨點屬性。代碼第⑤~⑥行是創(chuàng)建Node2對象，并設置了位置和錨點屬性。第⑦行代碼將Node2的世界坐標轉換為相對于Node1的模型坐標。而第⑧行代碼是類似的，它是相對于錨點的位置。

運行結果如下：

Node2的世界坐標轉換為相對于Node1的模型坐標，就是將Node1的左下角作為坐標原點（圖3-22中的A點），我們不難計算出A點的世界坐標是(100,400)，那么convertToNodeSpace函數(shù)就是A點坐標減去C點坐標，結果是(-100,100)。而convertToNodeSpaceAR函數(shù)要考慮錨點，因此坐標原點是B點，B點坐標減去C點坐標，結果是(-200, -200)。

2、模型坐標轉換為世界坐標

下面是模型坐標轉換為世界坐標實例運行結果。

在游戲場景中有兩個Node對象，其中Node1的坐標是(400, 500)，大小是300 x 100像素。Node2是放置在Node1中的，它對于Node1的模型坐標是(0, 0)，大小也是150 x 50像素。

編寫代碼如下：

bool HelloWorld::init()
{
    if( !Layer::init() )
    {
         returnfalse;
    }
 
    SizevisibleSize = Director::getInstance()->getVisibleSize();
    Pointorigin = Director::getInstance()->getVisibleOrigin();
 
    autocloseItem = MenuItemImage::create(
         "CloseNormal.png",
         "CloseSelected.png",
         CC_CALLBACK_1(HelloWorld::menuCloseCallback,this));
 
    closeItem->setPosition(Point(origin.x+ visibleSize.width - closeItem->getContentSize().width/2 ,
         origin.y+ closeItem->getContentSize().height/2));
 
    automenu = Menu::create(closeItem, NULL);
    menu->setPosition(Point::ZERO);
    this->addChild(menu,1);
 
    //創(chuàng)建背景
    autobg = Sprite::create("bg.png");
    bg->setPosition(Point(origin.x+ visibleSize.width/2,
         origin.y+ visibleSize.height/2));
    this->addChild(bg,0);
 
    //創(chuàng)建Node1
    autonode1 = Sprite::create("node1.png");
    node1->setPosition(Point(400,500));
    this->addChild(node1,0);
 
    //創(chuàng)建Node2
    autonode2 = Sprite::create("node2.png");
    node2->setPosition(Point(0.0,0.0));                                                                                              ①
    node2->setAnchorPoint(Point(0.0,0.0));                                                                              ②
    node1->addChild(node2,0);                                                                                                 ③
 
    PointPoint2 = node1->convertToWorldSpace(node2->getPosition());                                              ④
Point Point4 =node1->convertToWorldSpaceAR(node2->getPosition());                                  ⑤
 
 
    log("Node2WorldSpace = (%f,%f)",Point2.x,Point2.y);
    log("Node2WorldSpaceAR = (%f,%f)",Point4.x,Point4.y);
 
    returntrue;
}

上述代碼我們主要關注第③行，它是將Node2放到Node1中，這是與之前的代碼的區(qū)別。這樣第①行設置的坐標就變成了相對于Node1的模型坐標了。

第④行代碼將Node2的模型坐標轉換為世界坐標。而第⑤行代碼是類似的，它是相對于錨點的位置。

運行結果如下：

所示的位置，可以用世界坐標描述。代碼①~③行修改如下：

更多精彩內容請關注史上最牛的cocos2d-x課程

《cocos2d-x手機游戲開發(fā)實戰(zhàn)》直播課程第一期

報名Cocos2d-x直播課程還送關東升老師iOS終身會員。

課程鏈接:http://edu.51cto.com/pack/view/id-13.html

會員鏈接:http://edu.51cto.com/member/id-3.html

另外有需要云服務器可以了解下創(chuàng)新互聯(lián)scvps.cn，海內外云服務器15元起步，三天無理由+7*72小時售后在線，公司持有idc許可證，提供“云服務器、裸金屬服務器、高防服務器、香港服務器、美國服務器、虛擬主機、免備案服務器”等云主機租用服務以及企業(yè)上云的綜合解決方案，具有“安全穩(wěn)定、簡單易用、服務可用性高、性價比高”等特點與優(yōu)勢，專為企業(yè)上云打造定制，能夠滿足用戶豐富、多元化的應用場景需求。

網(wǎng)頁名稱：Cocos2d-x坐標系介紹-創(chuàng)新互聯(lián)
本文地址：http://www.rwnh.cn/article20/csdhjo.html

成都網(wǎng)站建設公司_創(chuàng)新互聯(lián)，為您提供定制開發(fā)、外貿(mào)網(wǎng)站建設、關鍵詞優(yōu)化、網(wǎng)頁設計公司、網(wǎng)站建設、域名注冊

廣告

聲明：本網(wǎng)站發(fā)布的內容（圖片、視頻和文字）以用戶投稿、用戶轉載內容為主，如果涉及侵權請盡快告知，我們將會在第一時間刪除。文章觀點不代表本網(wǎng)站立場，如需處理請聯(lián)系客服。電話：028-86922220；郵箱：631063699@qq.com。內容未經(jīng)允許不得轉載，或轉載時需注明來源： 創(chuàng)新互聯(lián)