Cocos2d-X中的坐标

在Cocos2d-x中坐标可以分成四种：

1、GL坐标体系：GL坐标体系左下角为坐标原点，X轴向右，Y轴向上

2、UI坐标体系：UI坐标体系左上角为坐标原点，X轴向右，Y轴向上。

3、世界坐标体系：是窗口的坐标体系，它是GL坐标体系，它是左下角为坐标原点，X轴向右，Y轴向上。

4、 结点坐标体系：是Node的坐标体系，它是GL坐标体系，和世界坐标体系不同的是，它的原点是结点的左下角，
   
当一个结点调用SetPosition时，使用的参数是它的父结点（渲染树）的坐标体系

CCLayer默认大小和窗口一样，所以他的坐标体系和世界坐标体系重合

 CCScene默认大小和窗口一样，所以他的坐标体系和世界坐标

创建一个精灵，在不设置精灵的坐标时，精灵的默认坐标为(0,0)，使用的是Node的父类坐标体系
因为 CCLayer默认大小和窗口一样，所以他的坐标体系和世界坐标体系重合，所以下面代码的精灵位于左下角

[cpp] view plaincopy

1. //初始化精灵  
2. bool Coord::init()  
3. {   
4.     //先调用父类的init函数  
5.     CCLayer::init();  
6.   
7.     //创建一个精灵  
8.     CCSprite* sprite = CCSprite::create("CloseNormal.png");  
9.     addChild(sprite);  
10.   
11.     return true;  
12. }  

执行结果：

创建一个精灵，设置精灵的坐标为(100,100)，精灵的默认坐标为(0,0)，使用的是父结点坐标体系，原因和上面的一样

[cpp] view plaincopy

1. //初始化精灵  
2. bool Coord::init()  
3. {   
4.     //先调用父类的init函数  
5.     CCLayer::init();  
6.   
7.     //创建一个精灵  
8.     CCSprite* sprite = CCSprite::create("CloseNormal.png");  
9.     addChild(sprite);  
10.   
11.    //设置精灵的坐标为(100,100)，结点坐标  
12.     sprite->setPosition(ccp(100, 100));  
13.   
14.     return true;  
15. }  

执行结果：

在场景中创建一个红色的背景，并在背景上创建一个精灵

[cpp] view plaincopy

1. //初始化精灵  
2. bool Coord::init()  
3. {   
4.     //先调用父类的init函数  
5.     CCLayer::init();  
6.   
7.     //得到窗口的尺寸  
8.     CCSize winSize = CCDirector::sharedDirector()->getWinSize();  
9.   
10.     //创建一个背景颜色为红色的背景  
11.     CCLayerColor* layerColor = CCLayerColor::create(ccc4(255, 0, 0, 255),   
12.         winSize.width/2, winSize.height/2);  
13.     addChild(layerColor);  
14.   
15.     //创建一个精灵  
16.     CCSprite* sprite = CCSprite::create("CloseNormal.png");  
17.       
18.     //将精灵加到红色背景上  
19.     layerColor->addChild(sprite);  
20.   
21.     //设置精灵的坐标为(100,100)(是结点坐标体系)  
22.     sprite->setPosition(ccp(100, 100));  
23.   
24.     return true;  
25. }  

执行结果

程序解析：上面的代码实现了首先创建一个红色背景，然后在红色背景上增加一个精灵，再将精灵的坐标设置为(100,100),对于精灵，红色背景相当于精灵的父结点，所欲坐标原点位于红色背景的左下角，因为红色背景的坐标原点和窗口的坐标原点同和，所以精灵的位置没有发生变化

设置红色背景的坐标为(100,100)后的代码：

[cpp] view plaincopy

1. bool Coord::init()  
2. {   
3.     //先调用父类的init函数  
4.     CCLayer::init();  
5.   
6.     //得到窗口的尺寸  
7.     CCSize winSize = CCDirector::sharedDirector()->getWinSize();  
8.   
9.     //创建一个背景颜色为红色的背景  
10.     CCLayerColor* layerColor = CCLayerColor::create(ccc4(255, 0, 0, 255),   
11.         winSize.width/2, winSize.height/2);  
12.     addChild(layerColor);  
13.   
14.     //创建一个精灵  
15.     CCSprite* sprite = CCSprite::create("CloseNormal.png");  
16.       
17.     //将精灵加到红色背景上  
18.     layerColor->addChild(sprite);  
19.   
20.     //设置精灵的坐标为(100,100)(是结点坐标体系)  
21.     sprite->setPosition(ccp(100, 100));  
22.   
23.     //设置红色背景的坐标为(100,100)  
24.     layerColor->setPosition(ccp(100, 100));  
25.   
26.     return true;  
27. }  

执行结果：

程序解析：代码中设置了红色背景和精灵的坐标都为(100,100)，因为红色背景是精灵的父类，所以红色背景的左下角为精灵的坐标原点

程序中的坐标转换：

1、UI坐标和世界坐标之间的转换

 CCDirector::sharedDirector()->convertToUI();
  CCDirector::sharedDirector()->convertToGL();

2、 世界坐标和节点坐标之间的转换
  CCNode::convertToNodeSpace(CCPoint ptInWorld);
  CCNode::convertToWorldSpace(CCPoint ptInNode);

3、按照锚点为原点来进行转换的方法
  CCNode::convertToNodeSpaceAR(CCPoint ptInWorld); 这个函数返回的node坐标，是以锚点为原点
  CCNode::convertToWorldSpaceAR(CCPoint ptInNode);

 

4、 用touch作为参数转换
  CCNode::convertTouchToNodeSpace，直接将触摸转换成节点坐标系的坐标

实例：将精灵的结点坐标转换成世界坐标

程序代码：

[cpp] view plaincopy

1. bool Coord::init()  
2. {   
3.     //先调用父类的init函数  
4.     CCLayer::init();  
5.   
6.     //得到窗口的尺寸  
7.     CCSize winSize = CCDirector::sharedDirector()->getWinSize();  
8.   
9.     //创建一个背景颜色为红色的背景  
10.     CCLayerColor* layerColor = CCLayerColor::create(ccc4(255, 0, 0, 255),   
11.         winSize.width/2, winSize.height/2);  
12.   
13.     //将红色背景增加到层上  
14.     addChild(layerColor);  
15.   
16.     //创建一个精灵  
17.     CCSprite* sprite = CCSprite::create("CloseNormal.png");  
18.       
19.     //将精灵加到红色背景上  
20.     layerColor->addChild(sprite);  
21.   
22.     //设置精灵的坐标为(100,100)(是结点坐标体系)  
23.     sprite->setPosition(ccp(100, 100));  
24.   
25.     //设置红色背景的坐标为(100,100)  
26.     layerColor->setPosition(ccp(100, 100));  
27.   
28.     //将精灵的坐标转为世界坐标用ptSpriteInWorld保存转换后的坐标  
29.     CCPoint ptSpriteInWorld = layerColor->convertToWorldSpace(sprite->getPosition());  
30.   
31.     //打印精灵转换后的世界坐标  
32.     CCLog("ptSpriteInWorld(%f,%f)", ptSpriteInWorld.x, ptSpriteInWorld.y);  
33.   
34.     return true;  
35. }  

执行结果：编译成功红在输出中会看到转换后的坐标为(200,200)

处理触摸事件，并且显示UI坐标

程序代码：

首先在Coord.h中添加下面的代码(Coord为创建的一个场景)

[cpp] view plaincopy

1. #ifndef _Coord_H_  
2. #define _Coord_H_  
3. //防止代码重包含  
4.   
5. #include "cocos2d.h"  
6. USING_NS_CC;  
7.   
8. class Coord : public CCLayer  
9. {  
10. public:  
11.   
12.     //创建一个场景  
13.     static CCScene* scene();  
14.   
15.     //初始化场景  
16.     bool init();  
17.       
18.     //菜单回调函数  
19.     void menuCloseCallback(CCObject* pSender);  
20.   
21.     //响应触摸处理事件  
22.     bool ccTouchBegan(CCTouch*, CCEvent*);  
23.   
24.     CCSprite* _sprite;  
25.       
26.     //用于创建创建、精灵、或者层(同create())  
27.     CREATE_FUNC(Coord);  
28. };  
29.   
30. #endif  

然后在Coord.cpp中添加下面的代码

[cpp] view plaincopy

1. #include "Coord.h"  
2. #include "HelloWorldScene.h"  
3.   
4. CCScene* Coord::scene()  
5. {   
6.     CCScene *scene = CCScene::create();    
7.       
8.     CCLayer  *layer = Coord::create();      
9.       
10.     scene->addChild(layer);    
11.     
12.     return scene;    
13. }  
14.   
15. bool Coord::init()  
16. {   
17.       //先调用父类的init函数  
18.     CCLayer::init();  
19.   
20.     //得到窗口的尺寸  
21.     CCSize winSize = CCDirector::sharedDirector()->getWinSize();  
22.   
23.     //创建一个背景颜色为红色的背景  
24.     CCLayerColor* layerColor = CCLayerColor::create(ccc4(255, 0, 0, 255),   
25.         winSize.width/2, winSize.height/2);  
26.   
27.     //将红色背景增加到层上  
28.     addChild(layerColor);  
29.   
30.     //创建一个精灵  
31.     CCSprite* sprite = CCSprite::create("CloseNormal.png");  
32.   
33.     //将精灵赋值给全局变量  
34.     _sprite = sprite;  
35.   
36.     //将精灵加到红色背景上  
37.     layerColor->addChild(sprite);  
38.   
39.     //设置精灵的坐标为(100,100)(是结点坐标体系)  
40.     sprite->setPosition(ccp(100, 100));  
41.   
42.     //设置红色背景的坐标为(100,100)  
43.     layerColor->setPosition(ccp(100, 100));  
44.   
45.     //将精灵的坐标转为世界坐标用ptSpriteInWorld保存转换后的坐标  
46.     CCPoint ptSpriteInWorld = layerColor->convertToWorldSpace(sprite->getPosition());  
47.   
48.     //打印精灵转换后的世界坐标  
49.     CCLog("ptSpriteInWorld(%f,%f)", ptSpriteInWorld.x, ptSpriteInWorld.y);  
50.   
51.     // 加一个触摸处理，来演示UI坐标和GL坐标的转换  
52.     setTouchEnabled(true);  
53.     setTouchMode(kCCTouchesOneByOne);  
54.   
55.     return true;  
56. }  
57.   
58.   
59. //响应触摸处理事件  
60. bool Coord::ccTouchBegan(CCTouch* touch, CCEvent*)  
61. {  
62.     //得到触摸点的UI坐标  
63.     CCPoint ptInUI = touch->getLocationInView();  
64.   
65.     //得到触摸点的世界坐标  
66.     CCPoint ptInGL = touch->getLocation();  
67.   
68.     //将UI坐标转换为GL坐标  
69.     CCPoint ptUIConvert = CCDirector::sharedDirector()->convertToGL(ptInUI);  
70.   
71.     //打印触摸点的UI坐标  
72.     CCLog("ptInUI(%f, %f)", ptInUI.x, ptInUI.y);  
73.   
74.     //打印触摸点的GL坐标  
75.     CCLog("ptInGL(%f, %f), ptConvert(%f, %f)", ptInGL.x, ptInGL.y, ptUIConvert.x, ptUIConvert.y);  
76.   
77.     //获取精灵所在的矩形  
78.     CCRect rc = _sprite->boundingBox();  
79.   
80.     // _sprite->getParent()->convertToNodeSpace(touchPoint) 将touch转换成精灵的父节点的坐标体系内的坐标点  
81.     //if (rc.containsPoint(_sprite->getParent()->convertToNodeSpace(touchPoint)))  
82.       
83.     if (rc.containsPoint(_sprite->getParent()->convertTouchToNodeSpace(touch)))  
84.     {  
85.         CCLog("Oh I am touched");  
86.     }  
87.   
88.     return true;  
89. }  

执行结果：

1、当鼠标点击红色矩形框中的精灵时(提示触摸到了精灵)

2、当鼠标没有点击精灵时