Cocos-2d中,涉及到4种坐标系:
GL坐标系Cocos2D以OpenglES为图形库,所以它使用OpenglES坐标系。GL坐标系原点在屏幕左下角,x轴向右,y轴向上。
屏幕坐标系苹果的Quarze2D使用的是不同的坐标系统,原点在屏幕左上角,x轴向右,y轴向下。ios的屏幕触摸事件CCTouch传入的位置信息使用的是该坐标系。因此在cocos2d中对触摸事件做出响应前需要首先把触摸点转化到GL坐标系。可以使用CCDirector的convertToGL来完成这一转化。
世界坐标系也叫做绝对坐标系。世界坐标系和GL坐标系一致,原点在屏幕左下角。
(cocos2d中的元素是有父子关系的层级结构,我们通过CCNode的position设定元素的位置使用的是相对与其父节点的本地坐标系而非世界坐标系。最后在绘制屏幕的时候cocos2d会把这些元素的本地坐标映射成世界坐标系坐标。)
本地坐标系本地坐标系也叫做物体坐标系,是和特定物体相关联的坐标系。每个物体都有它们独立的坐标系,当物体移动或改变方向时,和该物体关联的坐标系将随之移动或改变方向。比如用cocos2d-x创建了个矩形colorLayer:CCRect(10,10,100),这是的本地坐标系为以(10,10)为坐标原点,x轴向右,y轴向上。如果创建了一个CCSprite,锚点为(0.5,0.5),位置为(100,100),size为(40,40),这时的本地坐标系为以(80,80)为坐标原点,x轴向右,y轴向上。
Cocos-2d中,坐标系转换:
CCPointconvertToNodeSpace(const CCPoint& worldPoint);
CCPoint convertToWorldSpace(const CCPoint& nodePoint);
CCPoint convertToNodeSpaceAR(const CCPoint& worldPoint);
CCPoint convertToWorldSpaceAR(const CCPoint& nodePoint);
1.CCPointconvertToNodeSpace(const CCPoint& worldPoint);
CGPointnodeSpace = [spriteParentconvertToNodeSpace:orignPosition];
将orignPosition转换为相对于spriteParent的本地坐标
2.CCPoint convertToWorldSpace(const CCPoint& nodePoint);
CGPointwordeSpace = [spriteParentconvertToWorldSpace:orignPosition];
将orignPosition转换为相对于spriteParent的世界坐标
3.CCPoint convertToNodeSpaceAR(const CCPoint& worldPoint);
CGPointnodeSpaceAR = [spriteParent将spriteParent的坐标系原点设置在spriteParent的锚点位置
然后 orignPosition转换为相对于spriteParent的本地坐标
4.CCPoint convertToWorldSpaceAR(const CCPoint& nodePoint);
CGPointwordeSpaceAR = [spriteParentconvertToWorldSpace:orignPosition];
将spriteParent的坐标系原点设置在spriteParent的锚点位置
然后 orignPosition转换为相对于spriteParent的世界坐标
===============================================================================================
弄懂坐标系是开始开发的重要的一步,为了不让大家头晕,现在里沃特深入的为大家讲解一下,本人原文地址:http://www.cnblogs.com/lyout/p/3292702.html。
首先我们添加两个测试精灵(宽:27,高:40)到场景里面:
CCSprite *sprite1 = CCSprite::create(
"player.png"
);
sprite1->setPosition(ccp(20,40));
sprite1->setAnchorPoint(ccp(0,0));
this
->addChild(sprite1);
CCSprite *sprite2 = CCSprite::create(
);
sprite2->setPosition(ccp(-15,-30));
sprite2->setAnchorPoint(ccp(1,1));
->addChild(sprite2);
|
然后调试,在场景中大概是下图这样显示(以左下角为坐标原点,从左到右为x方向,从下到上为y方向,废话了:)):
在cocos2d-x中,每个精灵都有一个锚点,以后对精灵的操作(比如旋转)都会围绕锚点进行,我们暂且可以看作是精灵的中心位置,一般来说有每个方向有三种可能的值:0,0.5,1。上图中红色圆点即为各自的锚点,sprite1 锚点为 (0,0) 左下角,sprite2锚点为(1,1)在右上角。
现在我们来看看坐标系转换,同样地,我们先写点测试代码:
CCPoint p1 = sprite2->convertToNodeSpace(sprite1->getPosition());
CCPoint p2 = sprite2->convertToWorldSpace(sprite1->getPosition());
CCPoint p3 = sprite2->convertToNodeSpaceAR(sprite1->getPosition());
CCPoint p4 = sprite2->convertToWorldSpaceAR(sprite1->getPosition());
接着,再打印出各点的x,y值:
CCLog(
"p1:%f,%f"
,p1.x,p1.y);
"p2:%f,p2.x,p2.y);
"p3:%f,p3.x,p3.y);
"p4:%f,p4.x,p4.y);
现在开始分析这四个常用坐标系转换函数转换后的值(有兴趣的同学可以先算一算)。
由于cocos2d-x的坐标系(本地坐标系)是以左下角为坐标原点的,所以sprite1和sprite2的坐标原点在上图的位置分别是(20,40)、(-42,-70),那么很明显的:
p1就是sprite1锚点相对于sprite2原点来说在sprite2坐标系中的位置,经过对比上图,我们可以得到(20-(-42),40-(-70))即(62,110)
p2就是sprite2原点来说在上图坐标系中的位置,这样我们可以计算出sprite1在sprite2坐标系中的位置:(20+(-42),40+(-70)),即(-22,-30)
p3就是sprite2锚点来说在sprite2坐标系中的位置,也就是(20-(-15),40-(-30)),即(35,70)
p4就是sprite2锚点来说在上图坐标系中的位置,也就是(20+(-15),40+(-30)),即(5,10)
现在我们可以知道,计算方法都是用sprite1的坐标去加减sprite2的坐标,针对本地坐标系就用减法,针对世界坐标系就用加法。
==================================================================================================
我的测试代码:
CCSprite * sprite1 = CCSprite::create("Player.png");
sprite1->setAnchorPoint(ccp(1,0));
sprite1->setPosition(ccp(1,2));
this->addChild(sprite1);
CCSprite * sprite2 = CCSprite::create("Player.png");
sprite2->setAnchorPoint(ccp(0,1));
sprite2->setPosition(ccp(10,20));
this->addChild(sprite2);
CCSprite * sprite3 = CCSprite::create("Player.png");
sprite3->setAnchorPoint(ccp(1,1));
sprite3->setPosition(ccp(100,200));
sprite2->addChild(sprite3);
/*
函数解释:
convertToWorldSpace(函数作用:把对象坐标系里面的某个坐标转化为全局坐标,系统会自动计算对象坐标系的左下角所在坐标)
函数调用模型: 返回值 = 对象.convertToWorldSpace(参数)
对象 ----> 以“对象”坐标系为起点(父亲坐标系)
参数 ----> 需要从局部坐标转换为全局坐标的“局部坐标”(注意:这个坐标值是相对于“对象”坐标系的!!!!!不是相对于GL的,或者层的,或者屏幕的)
返回值 ----> 得到的坐标
锚点的作用:锚点只会影像到结点在全局坐标系的位置,但这个位置系统会自动计算
函数解释:
convertToNodeSpace(函数作用:把一个全局坐标转化为相对于某个结点的坐标,系统会自动计算对象坐标系的左下角所在坐标)
函数调用模型: 返回值 = 对象.convertToNodeSpace(参数)
对象 ----> 以“对象”坐标系为起点(父亲坐标系)
参数 ----> 需要从全局坐标转换到局部坐标的“全局坐标”(注意:这个坐标值是相对于全局的,或者说是该层的)
返回值 ----> 得到的坐标
锚点的作用:锚点只会影像到结点在全局坐标系的位置,但这个位置系统会自动计算
//后缀带AR的表示,对象坐标系不是左下角,是锚点
函数解释:
convertToWorldSpaceAR(函数作用:把对象坐标系里面的某个坐标转化为全局坐标,系统会自动计算对象坐标系的锚点所在坐标)
函数调用模型: 返回值 = 对象.convertToWorldSpaceAR(参数)
对象 ----> 以“对象”坐标系为起点(父亲坐标系)
参数 ----> 需要从局部坐标转换为全局坐标的“局部坐标”(注意:这个坐标值是相对于“对象”坐标系的!!!!!不是相对于GL的,或者层的,或者屏幕的)
返回值 ----> 得到的坐标
锚点的作用:锚点只会影像到结点在全局坐标系的位置,但这个位置系统会自动计算
函数解释:
convertToNodeSpaceAR(函数作用:把一个全局坐标转化为相对于某个结点的坐标,系统会自动计算对象坐标系的锚点所在坐标)
函数调用模型: 返回值 = 对象.convertToNodeSpaceAR(参数)
对象 ----> 以“对象”坐标系为起点(父亲坐标系)
参数 ----> 需要从全局坐标转换到局部坐标的“全局坐标”(注意:这个坐标值是相对于全局的,或者说是该层的)
返回值 ----> 得到的坐标
锚点的作用:锚点只会影像到结点在全局坐标系的位置,但这个位置系统会自动计算
*/
CCPoint p1 = sprite2->convertToNodeSpace(sprite1->getPosition());
CCPoint p2 = sprite2->convertToWorldSpace(sprite1->getPosition());
CCPoint p3 = sprite2->convertToNodeSpaceAR(sprite1->getPosition());
CCPoint p4 = sprite2->convertToWorldSpaceAR(sprite1->getPosition());
return true;
经过测试,对精灵的锚点不进行设置的话,默认锚点是(0.5,0.5)