Cocos2d-X中的坐标

前端之家收集整理的这篇文章主要介绍了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默认大小和窗口一样,所以他的坐标体系和世界坐标体系重合,所以下面代码的精灵位于左下角

@H_301_96@
  • @H_502_99@//初始化精灵
  • boolCoord::init()
  • {
  • //先调用父类的init函数
  • CCLayer::init();
  • //创建一个精灵
  • CCSprite*sprite=CCSprite::create("CloseNormal.png");
  • addChild(sprite);
  • returntrue;
  • }

  • 执行结果:


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

    copy
      //设置精灵的坐标为(100,100),结点坐标
    1. sprite->setPosition(ccp(100,100));
    2. true;
    3. }


    执行结果:


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

    copy
      //得到窗口的尺寸
    1. CCSizewinSize=CCDirector::sharedDirector()->getWinSize();
    2. //创建一个背景颜色为红色的背景
    3. CCLayerColor*layerColor=CCLayerColor::create(ccc4(255,255),
    4. winSize.width/2,winSize.height/2);
    5. addChild(layerColor);
    6. //将精灵加到红色背景上
    7. layerColor->addChild(sprite);
    8. }

    执行结果


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


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

    copy
      boolCoord::init()
    1. {
    2. //先调用父类的init函数
    3. CCLayer::init();
    4. //得到窗口的尺寸
    5. CCSizewinSize=CCDirector::sharedDirector()->getWinSize();
    6. //创建一个背景颜色为红色的背景
    7. CCLayerColor*layerColor=CCLayerColor::create(ccc4(255,
    8. winSize.width/2,winSize.height/2);
    9. addChild(layerColor);
    10. //创建一个精灵
    11. CCSprite*sprite=CCSprite::create("CloseNormal.png");
    12. //将精灵加到红色背景上
    13. layerColor->addChild(sprite);
    14. sprite->setPosition(ccp(100,100));
    15. //设置红色背景的坐标为(100,100)
    16. layerColor->setPosition(ccp(100,108); list-style:decimal-leading-zero outside; color:inherit; line-height:18px; margin:0px!important; padding:0px 3px 0px 10px!important"> }

    执行结果:



    程序解析:代码中设置了红色背景和精灵的坐标都为(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,直接将触摸转换成节点坐标系的坐标


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

    程序代码

    copy
      //将红色背景增加到层上
    1. //将精灵的坐标转为世界坐标用ptSpriteInWorld保存转换后的坐标
    2. CCPointptSpriteInWorld=layerColor->convertToWorldSpace(sprite->getPosition());
    3. //打印精灵转换后的世界坐标
    4. CCLog("ptSpriteInWorld(%f,%f)",ptSpriteInWorld.x,ptSpriteInWorld.y);
    5. }

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


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

    程序代码

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

    copy
      #ifndef_Coord_H_
    1. #define_Coord_H_
    2. //防止代码重包含
    3. #include"cocos2d.h"
    4. USING_NS_CC;
    5. classCoord:publicCCLayer
    6. public:
    7. //创建一个场景
    8. staticCCScene*scene();
    9. //初始化场景
    10. boolinit();
    11. //菜单回调函数
    12. voidmenuCloseCallback(CCObject*pSender);
    13. //响应触摸处理事件
    14. boolccTouchBegan(CCTouch*,CCEvent*);
    15. CCSprite*_sprite;
    16. //用于创建创建、精灵、或者层(同create())
    17. CREATE_FUNC(Coord);
    18. };
    19. #endif

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

    copy
      #include"Coord.h"
    1. #include"HelloWorldScene.h"
    2. CCScene*Coord::scene()
    3. CCScene*scene=CCScene::create();
    4. CCLayer*layer=Coord::create();
    5. scene->addChild(layer);
    6. returnscene;
    7. }
    8. //将精灵赋值给全局变量
    9. _sprite=sprite;
    10. layerColor->setPosition(ccp(100,0); background-color:inherit">//将精灵的坐标转为世界坐标用ptSpriteInWorld保存转换后的坐标
    11. CCPointptSpriteInWorld=layerColor->convertToWorldSpace(sprite->getPosition());
    12. //打印精灵转换后的世界坐标
    13. CCLog("ptSpriteInWorld(%f,ptSpriteInWorld.y);
    14. //加一个触摸处理,来演示UI坐标和GL坐标的转换
    15. setTouchEnabled(true);
    16. setTouchMode(kCCTouchesOneByOne);
    17. }
    18. boolCoord::ccTouchBegan(CCTouch*touch,CCEvent*)
    19. //得到触摸点的UI坐标
    20. CCPointptInUI=touch->getLocationInView();
    21. //得到触摸点的世界坐标
    22. CCPointptInGL=touch->getLocation();
    23. //将UI坐标转换为GL坐标
    24. CCPointptUIConvert=CCDirector::sharedDirector()->convertToGL(ptInUI);
    25. //打印触摸点的UI坐标
    26. CCLog("ptInUI(%f,ptInUI.x,ptInUI.y);
    27. //打印触摸点的GL坐标
    28. CCLog("ptInGL(%f,%f),ptConvert(%f,ptInGL.x,ptInGL.y,ptUIConvert.x,ptUIConvert.y);
    29. //获取精灵所在的矩形
    30. CCRectrc=_sprite->boundingBox();
    31. //_sprite->getParent()->convertToNodeSpace(touchPoint)将touch转换成精灵的父节点的坐标体系内的坐标点
    32. //if(rc.containsPoint(_sprite->getParent()->convertToNodeSpace(touchPoint)))
    33. if(rc.containsPoint(_sprite->getParent()->convertTouchToNodeSpace(touch)))
    34. CCLog("OhIamtouched");
    35. }

    执行结果:


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


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

    猜你在找的Cocos2d-x相关文章