屏幕坐标系:
与我们开发手机是一样,手机屏幕左上角为坐标系原点,横向右为正x轴,纵向下为正y轴。
OpenGL坐标系:
又是cocos2d坐标系,手机屏幕左下角为坐标系原点,横向右为正x轴,纵向上为正y轴。
世界坐标系:
又称绝对坐标系,这里是指游戏世界在屏幕上所显示的坐标系,一般与openGL一样。
本地坐标系:
又称相对坐标系,这里是相对于游戏元素中node(节点)的坐标系,以此时的node为参考物,以该node的锚点为原点,横向右为正x轴,纵向上为正y轴。
锚点:
作为node(节点)位置的参考物,其取值范围(0,0)~(1, 1),取值范围可看作node本身宽高的比例,(0.5, 0,5)表示node的中心位置
触摸点:
指触摸屏幕的点,所得点的坐标位于屏幕坐标系,需要转换为openGL坐标系坐标
触摸函数:
virtual bool onTouchBegan(Touch *touch, Event * event);
virtual void onTouchEnded(Touch *touch, Event * event);
virtual void onTouchCancelled(Touch *touch, Event * event);
virtual void onTouchMoved(Touch *touch, Event * event);
转换坐标函数:
// 把世界坐标转换到当前节点的本地坐标系中
Point convertToNodeSpace(const Point& worldPoint) const;
// 把基于当前节点的本地坐标系下的坐标转换到世界坐标系中
Point convertToWorldSpace(const Point& nodePoint) const;
// 基于Anchor Point把基于当前节点的本地坐标系下的坐标转换到世界坐标系中
Point convertToNodeSpaceAR(const Point& worldPoint) const;
// 基于Anchor Point把世界坐标转换到当前节点的本地坐标系中
Point convertToWorldSpaceAR(const Point& nodePoint) const;
实例应用:
实例1
Size visibleSize = Director::getInstance()->getVisibleSize();
Vec2 origin = Director::getInstance()->getVisibleOrigin();
// 窗口分辨率
log("visibleSize:(%f,%f)", visibleSize.width, visibleSize.height);
// 世界坐标系原点,等同于openGL原点
log("origin:(%f,%f)", origin.x, origin.y);
// 实例1
// 默认锚点为(0,0),锚点范围(0,1),可看做比例,(0.5,0.5)的锚点为中心点
auto red = LayerColor::create(Color4B(255, 0, 0, 255), visibleSize.width/2, visibleSize.height/2);
auto blue = LayerColor::create(Color4B(0, 0, 255, 255), visibleSize.width/5, visibleSize.height/5);
red->addChild(blue);
this->addChild(red);
实例1运行结果:
visibleSize:(480.000000,320.000000)
origin:(0.000000,0.000000)
实例2
// 实例2
// 这里默认忽略锚点即设置为(0,0),所以激活锚点,并设置红色区域中心为锚点,其锚点与其设置的位置一致
// 如果重新设置red的位置,则移动的参考点就是锚点(red的子节点blue在red中,因此会一起移动)
auto red = LayerColor::create(Color4B(255, 0, 0, 255), 150, 150);
red->ignoreAnchorPointForPosition(false); // 是否忽略锚点
red->setAnchorPoint(Point(0.5, 0.5)); // 设置锚点坐标
//red->setPosition(Point(150, 150));
auto blue = LayerColor::create(Color4B(0, 0, 255, 255), 60, 30);
red->addChild(blue);
this->addChild(red);
实例2运行结果:
实例3
// 实例3
// 这里blue为red子节点,默认位置为red的左下角,如果设置blue位置,其位置也是相对于父节点red而言
// 设置blue的锚点为其中心点,则其位置便以锚点为参考
auto red = LayerColor::create(Color4B(255, 0, 0, 255), 150, 150);
red->ignoreAnchorPointForPosition(false);
red->setAnchorPoint(Point(0.5, 0.5));
red->setPosition(Point(150, 150));
auto blue = LayerColor::create(Color4B(0, 0, 255, 255), 60, 30);
blue->ignoreAnchorPointForPosition(false);
blue->setAnchorPoint(Point(0.5, 0.5));
red->addChild(blue);
this->addChild(red);
实例3运行结果:
实例4
// 实例4
auto *sprite1 = Sprite::create("HelloWorld.PNG");
sprite1->setPosition(ccp(100, 100));
sprite1->setAnchorPoint(ccp(0, 0));
this->addChild(sprite1); // 此时添加到的是世界坐标系,也就是OpenGL坐标系
auto *sprite2 = Sprite::create("HelloWorld.PNG");
sprite2->setPosition(ccp(50, 50));
sprite2->setAnchorPoint(ccp(1, 1));
this->addChild(sprite2); // 此时添加到的是世界坐标系,也就是OpenGL坐标系
// 将 sprite2 这个节点的坐标ccp(50, 50)转换为sprite1节点下的本地(节点)坐标系统的位置坐标
// 这里可视为相对于sprite1的锚点的坐标
Point point1 = sprite1->convertToNodeSpace(sprite2->getPosition());
//将 sprite2 这个节点的坐标ccp(50, 50)转换为sprite1节点下的世界坐标系统的位置坐标
// 这里可视为相对于openGL坐标系原点的坐标
Point point2 = sprite1->convertToWorldSpace(sprite2->getPosition());
// 这里参考点为各自的锚点
log("point1:(%f,%f)", point1.x,point1.y);
log("point2:(%f,%f)", point2.x, point2.y);
实例4运行结果:
point1:(-50.000000,-50.000000)
point2:(150.000000,150.000000)
由于整个项目文件过于庞大,故上传了一个.cpp文件,复制黏贴到项目即可。
源代码下载:http://download.youkuaiyun.com/detail/u013707014/8973679