详解iOS游戏开发中Cocos2D的坐标位置关系


本文向大家介绍详解iOS游戏开发中Cocos2D的坐标位置关系,包括了详解iOS游戏开发中Cocos2D的坐标位置关系的使用技巧和注意事项,需要的朋友参考一下

接触Cocos2D有段时间了,今天特意研究了下Cocos2D坐标系中各种位置关系,anchor属性,CCNode坐标和地图坐标转换。

    先看一段代码:


-(id) init  

{  

    // always call "super" init  

    // Apple recommends to re-assign "self" with the "super" return value  

    if( (self=[super init])) {  

        CCTMXTiledMap *gameWorld = [CCTMXTiledMap tiledMapWithTMXFile:@"PositionText.tmx"];  

        [self addChild:gameWorld];  

        CGSize winSize = [[CCDirector sharedDirector] winSize];  

        CCLOG(@"gameWorld.mapSize.width:%.2f  gameWorld.mapSize.height:%.2f",gameWorld.mapSize.width, gameWorld.mapSize.height);  

        CCLOG(@"gameWorld.tileSize.width: %.2f  gameWorld.tileSize.height:%.2f", gameWorld.tileSize.width, gameWorld.tileSize.height);  

        CCLOG(@"winSize.width:%.2f  winSize.height:%.2f", winSize.width, winSize.height);  

          

        CCSprite *pointSprite = [CCSprite spriteWithFile:@"point.png"];  

        [gameWorld addChild:pointSprite z:2 tag:1];  

        pointSprite.position = ccp(20,20);  

        pointSprite.anchorPoint = ccp(0.5, 0.5);  

          

          

        CCSprite *rectSprite = [CCSprite spriteWithFile:@"myrect.png"];  

        [gameWorld addChild:rectSprite z:1 tag:1];  

        rectSprite.position = ccp(20,20);  

        rectSprite.anchorPoint = ccp(0.5, 0.5);       

    }  

    return self;  

} 


1、加载地图:

CCTMXTiledMap *gameWorld = [CCTMXTiledMap tiledMapWithTMXFile:@"PositionText.tmx"];  


2、获取手机屏幕大小


CGSize winSize = [[CCDirector sharedDirector] winSize];  


3、地图格子数:

gameWorld.mapSize (10,10)     

 
4、地图格子大小:

gameWorld.tileSize    (20,20)

 
5、整个地图大小:

     gameWorld.mapSize * gameWorld.tileSize;


     当然这里所说的是地图格子是个正方形,非正方形也容易啦。
6、anchor属性

     1) 添加一个精灵,这个精灵是个像素为1*1的红色图片,设置坐标为20,20,即在地图的第一个格子的右上角,设置anchorPoint为(0.5, 0.5)
     2) 再添加一个精灵,这个精灵是个像素为20*20的蓝色图片,设置坐标为20,20,即在地图的第一个格子的右上角,同样设置anchorPoint为(0.5, 0.5)

         运行效果是矩形精灵的中心和在点精灵的位置,即矩形精灵的锚点为第一个格子的右上角(20,20)坐标 处
     去掉两个精灵的anchorPoint属性

          运行效果和上面相同

     设置rectSprite的anchorPoint为ccp(0,0)

          运行效果是矩形精灵的左下角与点精灵重合。
     设置rectSprite的anchorPoint为ccp(1,1)

          运行效果是矩形精灵的右上角与点精灵重合。
     同理设置ccp(0.5, 1) , ccp(1, 0.5)等

     由上面可以得出:
         1)anchorPoint属性默认为ccp(0.5, 0.5)

         2)当设置(0,0)时是以左下角为锚点

         3)当设置(1, 1)时是以右上角角为锚点

         4)由此可以自己推论到底该把锚点设置在哪里

    Cocos2D使用的是OpenGL坐标系

    OpenGL坐标系:原点在左下角, X轴向右,Y轴向上

    IPhone屏幕坐标系:原点在左上角,X轴向右,Y轴向下
   很简单的判断方法:由于Cocos2D的坐标系的原点在左下角。所以精灵内部坐标原点也是左下角,即当anchorPoint为(0, 0)时即以左下角为锚点,为(1,1)时就以右上角为锚点,当然(0.5, 0.5)就是以精灵中心为锚点了。由此可以推算出-2,-3....    2, 3....   等值时精灵锚点坐标。


7、坐标转换


-(id) init  

{  

    // always call "super" init  

    // Apple recommends to re-assign "self" with the "super" return value  

    if( (self=[super init])) {  

        CCTMXTiledMap *gameWorld = [CCTMXTiledMap tiledMapWithTMXFile:@"PositionText.tmx"];  

        [self addChild:gameWorld];  

        CGSize winSize = [[CCDirector sharedDirector] winSize];  

        CCLOG(@"gameWorld.mapSize.width:%.2f  gameWorld.mapSize.height:%.2f",gameWorld.mapSize.width, gameWorld.mapSize.height);  

        CCLOG(@"gameWorld.tileSize.width: %.2f  gameWorld.tileSize.height:%.2f", gameWorld.tileSize.width, gameWorld.tileSize.height);  

        CCLOG(@"winSize.width:%.2f  winSize.height:%.2f", winSize.width, winSize.height);  

          

        CCSprite *pointSprite = [CCSprite spriteWithFile:@"point.png"];  

        [gameWorld addChild:pointSprite z:2 tag:1];  

        pointSprite.position = ccp(20,20);  

        //pointSprite.anchorPoint = ccp(0.5, 0.5);  

          

          

        CCSprite *rectSprite = [CCSprite spriteWithFile:@"myrect.png"];  

        [gameWorld addChild:rectSprite z:1 tag:1];  

        rectSprite.position = ccp(40,40);  

        rectSprite.anchorPoint = ccp(2, 2);   

          

        [self setIsTouchEnabled:YES];  

    }  

    return self;  

}  

  

- (void) registerWithTouchDispatcher {  

    [[CCTouchDispatcher sharedDispatcher] addTargetedDelegate:self priority:INT_MIN + 1 swallowsTouches:YES];  

}  

  

- (BOOL) ccTouchBegan:(UITouch *)touch withEvent:(UIEvent *)event {  

    CGPoint point = [touch locationInView: [touch view]];  

    CCLOG(@"Screen coordX: %.2f coordY: %.2f", point.x, point.y);  

      

    point = [[CCDirector sharedDirector] convertToGL: point];  

    CCLOG(@"OpenGL coordX: %.2f coordY: %.2f", point.x, point.y);  

  

    point = [self convertToNodeSpace: point];  

    CCLOG(@"CCNode1 coordX: %.2f coordY: %.2f", point.x, point.y);  

  

    point = [self convertTouchToNodeSpace: touch];  

    CCLOG(@"CCNode2 coordX: %.2f coordY: %.2f", point.x, point.y);  

          

        point = [[CCDirector sharedDirector] convertToUI:point];  

        CCLOG(@"UIView coordX: %.2f coordY: %.2f", point.x, point.y);  

         

        point = [rectSprite convertTouchToNodeSpaceAR:touch];  

        CCLOG(@"TouchAR coordX: %.2f coordY: %.2f", point.x, point.y);  

        return YES; CCNode  

}  

  

- (void) ccTouchMoved:(UITouch *)touch withEvent:(UIEvent*)event {  

      

}  

  

- (void) ccTouchEnded:(UITouch *)touch withEvent:(UIEvent*)event {  

      

}  


     上面的代码添加了UIView的事件处理。由于屏幕和Cocos2D采用不同的坐标系,所以我们需要进行坐标转换。

     1)首先获取屏幕坐标

     2)将屏幕坐标转换为OpenGL的坐标

     3)将OpenGL的坐标转换为Cocos2D的坐标。

     从运行结果可以看出Node1和Node2打印出的坐标相同。因为Cocos2D给我们写了covertTouchToNodeSpace方法,可以看看它的源码:


- (CGPoint)convertTouchToNodeSpace:(UITouch *)touch  

{  

    CGPoint point = [touch locationInView: [touch view]];  

    point = [[CCDirector sharedDirector] convertToGL: point];  

    return [self convertToNodeSpace:point];  

} 


     至于为什么OpenGL和Node1输出既然相同,为什么还要使用convertToNodeSpace,由于能力有限,希望大牛们能给告诉我答案。
    UIView输出的是将Cocos2D坐标转换为屏幕即quartz坐标。
   4) convertTouchToNodeSpaceAR是将触摸点转换为相对于rectSprite的坐标


8、判断触摸点是否在制定的精灵上


- (BOOL) ccTouchBegan:(UITouch *)touch withEvent:(UIEvent *)event {  

    CGPoint point = [touch locationInView: [touch view]];  

    CCLOG(@"Screen coordX: %.2f coordY: %.2f", point.x, point.y);  

      

    point = [[CCDirector sharedDirector] convertToGL: point];  

    CCLOG(@"OpenGL coordX: %.2f coordY: %.2f", point.x, point.y);  

  

    point = [self convertToNodeSpace: point];  

    CCLOG(@"CCNode1 coordX: %.2f coordY: %.2f", point.x, point.y);  

  

    point = [self convertTouchToNodeSpace: touch];  

    CCLOG(@"CCNode2 coordX: %.2f coordY: %.2f", point.x, point.y);  

      

    //point = [[CCDirector sharedDirector] convertToUI:point];  

    //CCLOG(@"UIView coordX: %.2f coordY: %.2f", point.x, point.y);  

    CCLOG(@"%d", rectSprite.textureRect.size.width);  

      

    CGRect rect = [rectSprite textureRect];  

    rect = CGRectMake(0, 0, rect.size.width, rect.size.height);  

    CCLOG(@"orgX: %.2f  orgY: %.2f  width:%.2f  height: %.2f",rect.origin.x, rect.origin.y, rect.size.width, rect.size.height);  

      

    point = [rectSprite convertTouchToNodeSpaceAR:touch];  

    CCLOG(@"TouchAR coordX: %.2f coordY: %.2f", point.x, point.y);  

    if(CGRectContainsPoint(rect, point)) {  

        CCLOG(@"You touched in the rectSprite");  

    }  

    return YES;   

}  


9、获取触摸的是哪个tile,并改变该tile.

CCSprite *rectSprite;  

CCTMXTiledMap *gameWorld;  

int speed = 10;  

-(id) init  

{  

    // always call "super" init  

    // Apple recommends to re-assign "self" with the "super" return value  

    if( (self=[super init])) {  

        gameWorld = [CCTMXTiledMap tiledMapWithTMXFile:@"PositionText.tmx"];  

        [self addChild:gameWorld];  

        CGSize winSize = [[CCDirector sharedDirector] winSize];  

        CCLOG(@"gameWorld.mapSize.width:%.2f  gameWorld.mapSize.height:%.2f",gameWorld.mapSize.width, gameWorld.mapSize.height);  

        CCLOG(@"gameWorld.tileSize.width: %.2f  gameWorld.tileSize.height:%.2f", gameWorld.tileSize.width, gameWorld.tileSize.height);  

        CCLOG(@"winSize.width:%.2f  winSize.height:%.2f", winSize.width, winSize.height);  

          

        CCSprite *pointSprite = [CCSprite spriteWithFile:@"point.png"];  

        [gameWorld addChild:pointSprite z:2 tag:1];  

        pointSprite.position = ccp(20,20);  

        pointSprite.anchorPoint = ccp(0.5, 0.5);  

          

          

        rectSprite = [CCSprite spriteWithFile:@"myrect.png"];  

        [gameWorld addChild:rectSprite z:0 tag: 3];  

        rectSprite.position = ccp(40, 40);  

        rectSprite.anchorPoint = ccp(0, 0);  

                  

        [self setIsTouchEnabled:YES];  

    }  

    return self;  

}  

  

- (void) registerWithTouchDispatcher {  

    [[CCTouchDispatcher sharedDispatcher] addTargetedDelegate:self priority:INT_MIN + 1 swallowsTouches:YES];  

}  

  

- (BOOL) ccTouchBegan:(UITouch *)touch withEvent:(UIEvent *)event {  

    CGPoint point = [touch locationInView: [touch view]];  

    point = [self convertTouchToNodeSpace: touch];  

    CCLOG(@"CCNode2 coordX: %.2f coordY: %.2f", point.x, point.y);  

  

    CGPoint tilePos = [self tilePosition:point];  

    if(tilePos.x == -1 || tilePos.y == -1) return NO;  

    CCTMXLayer *ly = [gameWorld layerNamed:@"Layer 0"];  

    if([ly tileGIDAt:tilePos] != 3) {  

        [ly setTileGID:0 at: tilePos];  

    }  

    return YES;   

}  

  

- (void) ccTouchMoved:(UITouch *)touch withEvent:(UIEvent*)event {  

      

}  

  

- (void) ccTouchEnded:(UITouch *)touch withEvent:(UIEvent*)event {  

      

}  

  

  

- (CGPoint) tilePosition:(CGPoint)pos {  

    CGPoint point;  

    CCTMXLayer *ly = [gameWorld layerNamed:@"Layer 0"];  

    if(ly== nil) {  

        CCLOG(@"Error: Layer not found!");  

        return ccp(-1, -1);  

    }  

    CGSize layerSize = [ly layerSize];  

    CGSize tileSize = [gameWorld tileSize];  

    int x = pos.x / tileSize.width;  

    int y = layerSize.height - pos.y / tileSize.height;  

    if((x >= 0) && (x < layerSize.width) && (y >= 0) && (y < layerSize.height)) {  

        point = ccp(x, y);  

    } else {  

        point = ccp(-1, -1);  

    }  

    if(point.x < 0) return ccp(-1, -1);  

    if(point.y < 0) return ccp(-1, -1);  

    if(point.x >= layerSize.width) return ccp(-1, -1);  

    if(point.y >= layerSize.height) return ccp(-1, -1);  

    CCLOG(@"%d, %d", x, y);  

    return point;  

}  

声明:本文内容来源于网络,版权归原作者所有,内容由互联网用户自发贡献自行上传,本网站不拥有所有权,未作人工编辑处理,也不承担相关法律责任。如果您发现有涉嫌版权的内容,欢迎发送邮件至:notice#yiidian.com(发邮件时,请将#更换为@)进行举报,并提供相关证据,一经查实,本站将立刻删除涉嫌侵权内容。