cocos2d-x手機遊戲開發筆記（二）--座標系

http://cocos2d-x.org/projects/cocos2d-x/wiki/Coordinate_System

介紹不同的座標體系

笛卡爾座標系

你可能在以前的幾何課裏學到了笛卡爾座標系。如果忘記了，下面的圖片可以很快讓你想起來。

       

以下三種座標系將在以後的手機遊戲中用到。

UI座標系

這個座標系在 IO/Android/Windows SDK平臺中的共性：

• 原點（x=0,y=0）在屏幕的左上角。
• x軸線沿着屏幕向右邊延伸。
• y軸線沿着屏幕向下延伸。

如圖：

       

Direct3D 座標系

  DirectX 採用的是左手式的笛卡爾座標系。

OpenGL 和 Cocos2d 座標系

Cocos2d-x/-html5/-iphone 採用的座標系與OpenGL一致。採用的是右手式的笛卡爾座標系。

 

在2D遊戲世界裏，我們只需要X與Y軸所構成的座標系。所以，在cocos2d中：

• 座標系原點（x=0,y=0）是屏幕的左下角，屏幕所在就是右手笛卡爾座標系的第一象限。
•    X軸沿着屏幕往右邊延伸。
• Y軸沿着屏幕往上延伸。

下面圖片能更好的闡明cocos2d座標系：

注意該座標系與世界座標系和DirectX座標系的區別。

父節點與子節點

每個繼承CCNode的類都會有一個錨點屬性。當要顯示一個對象時（sprite、layer等）元素時，cocos2d將根據對象的位置和錨點兩個屬性去繪製。如果該對象需要旋轉角度，那它的旋轉是以錨點爲定點的。

創建一個灰色的節點作爲父節點，藍色的作爲子節點，設置父節點的位置爲（100,100），子節點的錨點爲（0.5,0.5），即圓的中心 。

 1    CCSprite* parent = CCSprite::create("parent.png");
 2    parent->setAnchorPoint(ccp(0, 0));// Anchor Point
 3    parent->setPosition(ccp(100, 100));
 4    parent->setAnchorPoint(ccp(0, 0));
 5    addChild(parent);
 6
 7    //create child 
 8    CCSprite* child = CCSprite::create("child.png");
 9    child->setAnchorPoint(ccp(0.5, 0.5));
10    child->setPosition(ccp(0, 0));
11    parent->addChild(child);//add child sprite into parent sprite.

我們設置了子節點的位置爲（0,0），父節點的位置爲（100,100），因而，子節點的位置如圖:

錨點的介紹：

見此文： http://blog.csdn.net/o_longzhong/article/details/9493215

getVisibleSize、getVisibleOrigin 與 getWinSize

getVisibleSize獲取OpenGL視圖的可視界面的尺寸（像素），如果沒有調用CCEGLView::setDesignResolutionSize()函數，這個值與用getWinSize獲取的值是一樣的。

getVisibleOrigin獲取OpenGL視圖的原點。點擊查看更多信息Multi resolution support。

轉換座標系

convertToNodeSpace:

當你有一個基於小貼塊地圖的遊戲，但是地圖很大。covertToNodeSpace可以將OpenGL座標系的點轉換爲.tmx地圖的座標。

下圖中node1的錨點爲（0,0），node2的錨點爲（1,1）。

當調用CCPoint point = node1->convertToNodeSpace(node2->getPosition())； 將轉換node2的座標相對於node1的座標原點的座標位置，這裏node2的位置就是（-25，-60）。（就是把世界座標系轉換到當前節點的本地座標系中）

 convertToWorldSpace:

convertToWorldSpace(const  CCPoint)將當前節點的本地座標系轉化爲世界座標系。它總是返回節點在視圖中的位置。當需要移動或縮放地圖才能看到節點時，而又想獲取這個節點的taps（不懂），這個函數很有用。

一般是父節點調用這個方法，來返回它的子節點在世界座標系中的位置。因此，如果沒有子節點，一般節點不會調用這個方法。

例如：1CCPoint point = node1->convertToWorldSpace(node2->getPosition());

這個代碼主要將node2的座標轉換到世界座標系。

例如，如果node2的座標是（0,0），它將會在在node1的左下角，但不一定在屏幕上。這個轉換將會使node2的座標位置（0,0）轉換成相對應的世界座標（15,20），結果如圖：

示例代碼：

 1
 2CCSprite *sprite1 = CCSprite::create("CloseNormal.png");
 3
 4sprite1->setPosition(ccp(20,40));
 5
 6sprite1->setAnchorPoint(ccp(0,0));
 7
 8this->addChild(sprite1);
 9
10CCSprite *sprite2 = CCSprite::create("CloseNormal.png");
11
12sprite2->setPosition(ccp(-5,-20));
13
14sprite2->setAnchorPoint(ccp(1,1));
15
16this->addChild(sprite2);
17
18CCPoint point1 = sprite1->convertToNodeSpace(sprite2->getPosition());
19
20CCPoint point2 = sprite1->convertToWorldSpace(sprite2->getPosition());
21
22CCPoint point3 = sprite1->convertToNodeSpaceAR(sprite2->getPosition());
23
24CCPoint point4 = sprite1->convertToWorldSpaceAR(sprite2->getPosition());
25
26CCLog("position = (%f,%f)",point1.x,point1.y);
27
28CCLog("position = (%f,%f)",point2.x,point2.y);
29
30CCLog("position = (%f,%f)",point3.x,point3.y);
31
32CCLog("position = (%f,%f)",point4.x,point4.y);

結果：

 1
 2position = (-25.000000,-60.000000)
 3
 4position = (15.000000,20.000000)
 5
 6position = (-25.000000,-60.000000)
 7
 8position = (15.000000,20.000000)