Touch area double sized on newer device

Question

I am developing a universal puzzle game, in which I have used separate image for iPhone4 and for iPhone3, iPhone4 image is double in size of iPhone3 image. My issue is for iPhone4, touch area of image for iPhone4 image is taking double size. Suppose I have an image size for iPhone4 of 20x40 and for iPhone3 of 10x20, the touch area for iPhone4 image is 40x80. I don't know how it's happening I worked out in my code but I didn't get any solution of this issue. Touching is working fine in iPhone3, touching within the sprite rectangle.

Can you help me to solve this issue? Or tell me what I am forgetting to code for iPhone4 touching so that it takes touch within sprite rectangle?

Below is my code: `

    -(void)ccTouchesBegan:(NSSet *)touches withEvent:(UIEvent *)event

    {
     UITouch *touch = [touches anyObject];
     touchLocation = [touch locationInView: [touch view]];
     touchLocation = [[CCDirector sharedDirector] convertToGL:touchLocation];
     touchLocation = [self convertTouchToNodeSpace:touch];
     NSLog(@"touch location x = %f , y =%f",touchLocation.x,touchLocation.y);
     CCSprite * sp= [CCSprite spriteWithFile:@"1.png"];
    sp.position = ccp(touchLocation.x ,touchLocation.y);
    // [self addChild:sp z:100];
    CGRect myrec = [invisible[0] boundingBox];

    if (CGRectContainsPoint(myrec, touchLocation) ) {
    NSLog(@"oneeeeeeee");
    }


     [self selectSpriteForTouch:touchLocation];      
     // return TRUE;    
   }


     - (void)panForTranslation:(CGPoint)translation
    {    
     if (selSprite) {


    CGPoint newPos = ccpAdd(selSprite.position, translation);
    selSprite.position = newPos;

      } 
   }


     - (void)ccTouchesMoved:(NSSet *)touches withEvent:(UIEvent *)event {   
    UITouch *touch = [touches anyObject];
    Location = [touch locationInView: [touch view]];
     Location = [[CCDirector sharedDirector] convertToGL:Location];
    Location = [self convertTouchToNodeSpace:touch];
    NSLog(@"touch moved location x = %f , y =%f",Location.x,Location.y);

      //touchLocation = [self convertTouchToNodeSpace:touch];

   CGPoint oldTouchLocation = [touch previousLocationInView:touch.view];
   oldTouchLocation = [[CCDirector sharedDirector] convertToGL:oldTouchLocation];
   oldTouchLocation = [self convertToNodeSpace:oldTouchLocation];
   CGPoint translation = ccpSub(Location, oldTouchLocation); 

   if (CGRectContainsPoint(selspriterect,Location)) {
    [self panForTranslation:translation];
   }

     if ([[UIScreen mainScreen] respondsToSelector:@selector(scale)]) 
    {
    NSLog(@"respond to selector");

    CGFloat scale = [[UIScreen mainScreen] scale];

    if (scale > 1.0) 
    {
        NSLog(@"iphone 4s");
        CGPoint mypoint = CGPointMake(80, 357);
        CGPoint mypoint1 = CGPointMake(237, 360);
        CGPoint mypoint2 = CGPointMake(79, 255);
        CGPoint mypoint3 = CGPointMake(237, 247);
        CGPoint mypoint4 = CGPointMake(78, 153);
        CGPoint mypoint5 = CGPointMake(239, 140);


        CCSprite *disablesprite=nil;
        switch (selSprite.tag) {
            case 0:
                if (CGRectContainsPoint( [dest[0] boundingBox] , mypoint ) ) {
                    NSLog(@"oneeeeee collided");
                    dest[0].position =  ccp(192,380);
                    // selSprite = disablesprite;
                }
                break;
            case 1:
                if (CGRectContainsPoint( [dest[1] boundingBox] , mypoint1 ) ) {
                    NSLog(@"two collided");
                    dest[1].position =  ccp(258,379);

                }
                break;
            case 2:
                if (CGRectContainsPoint( [dest[2] boundingBox] , mypoint2 ) ) {
                    NSLog(@"three collided");
                    dest[2].position =  ccp(173,281);
                }
                break;
            case 3:
                if (CGRectContainsPoint( [dest[3] boundingBox] , mypoint3 ) ) {
                    NSLog(@"four collided");
                    dest[3].position = ccp(258,281);

                }
                break;
            case 4:
                if (CGRectContainsPoint( [dest[4] boundingBox] , mypoint4 ) ) {
                    NSLog(@"five collided");
                    dest[4].position =   ccp(166,181);
                }
                break;
            case 5:
                if (CGRectContainsPoint( [dest[5] boundingBox] , mypoint5 ) ) {
                    NSLog(@"six collided");
                    dest[5].position =  ccp(258,176);

                }
                break;
            default:
                break;
        }

    }
    else {

    CGPoint mypoint = CGPointMake(106, 329);
    CGPoint mypoint1 = CGPointMake(208, 329);
    CGPoint mypoint2 = CGPointMake(97, 220);
    CGPoint mypoint3 = CGPointMake(217, 220);
    CGPoint mypoint4 = CGPointMake(92, 124);
    CGPoint mypoint5 = CGPointMake(212, 124);




    CCSprite *disablesprite=nil;
    switch (selSprite.tag) {
    case 0:
        if (CGRectContainsPoint( [dest[0] boundingBox] , mypoint ) ) {
            NSLog(@"oneeeeee collided");
            dest[0].position =  ccp(125,320);
            // selSprite = disablesprite;
        }
        break;
    case 1:
        if (CGRectContainsPoint( [dest[1] boundingBox] , mypoint1 ) ) {
            NSLog(@"two collided");
            dest[1].position =  ccp(200,312);

        }
        break;
    case 2:
        if (CGRectContainsPoint( [dest[2] boundingBox] , mypoint2 ) ) {
            NSLog(@"three collided");
            dest[2].position =  ccp(117,209);
        }
        break;
    case 3:
        if (CGRectContainsPoint( [dest[3] boundingBox] , mypoint3 ) ) {
            NSLog(@"four collided");
            dest[3].position =  ccp(200,208);

        }
        break;
    case 4:
        if (CGRectContainsPoint( [dest[4] boundingBox] , mypoint4 ) ) {
            NSLog(@"five collided");
            dest[4].position =  ccp(113,127);
        }
        break;
    case 5:
        if (CGRectContainsPoint( [dest[5] boundingBox] , mypoint5 ) ) {
            NSLog(@"six collided");
            dest[5].position =  ccp(207,126);

        }
        break;
    default:
        break;
  }
    }
      }

   } 


    -(void)ccTouchesEnded:(NSSet *)touches withEvent:(UIEvent *)event{
      CGPoint mypoint = CGPointMake(106, 329);
      CGPoint mypoint1 = CGPointMake(208, 329);
      CGPoint mypoint2 = CGPointMake(97, 220);
       CGPoint mypoint3 = CGPointMake(217, 220);
     CGPoint mypoint4 = CGPointMake(92, 124);
     CGPoint mypoint5 = CGPointMake(212, 124);
     switch (selSprite.tag) {
      case 0:
        if (CGRectContainsPoint( [dest[0] boundingBox] , mypoint ) ) {
            NSLog(@"oneeeeee collided");
            if (corsprite == TRUE) {
                correctplace++;
                corsprite = FALSE;
            }
        }else {
            selSprite.position = ccp(110,50);
        }
        break;
    case 1:
        if (CGRectContainsPoint( [dest[1] boundingBox] , mypoint1 ) ) {
            NSLog(@"two collided");
            if (corsprite2 == TRUE) {
                correctplace++;
                corsprite2 = FALSE;
            }
        }else {
            selSprite.position = ccp(110, 65);
        }
        break;
    case 2:
        if (CGRectContainsPoint( [dest[2] boundingBox] , mypoint2 ) ) {
            NSLog(@"three collided");
            if (corsprite3 == TRUE) {
                correctplace++;
                corsprite3 = FALSE;
            }
        }else {
            selSprite.position =ccp(130, 10);
        }
        break;
    case 3:
        if (CGRectContainsPoint( [dest[3] boundingBox] , mypoint3 ) ) {
            NSLog(@"four collided");
            if (corsprite4 == TRUE) {
                correctplace++;
                corsprite4 = FALSE;
            }
        }else {
            selSprite.position = ccp(215, 10);
        }
        break;
    case 4:
        if (CGRectContainsPoint( [dest[4] boundingBox] , mypoint4 ) ) {
            NSLog(@"five collided");
            if (corsprite5 == TRUE) {
                correctplace++;
                corsprite5 = FALSE;
            }
        }else {
            selSprite.position = ccp(220,70);
        }
        break;
    case 5:
        if (CGRectContainsPoint( [dest[5] boundingBox] , mypoint5 ) ) {
            NSLog(@"six collided");
            if (corsprite6 == TRUE) {
                correctplace++;
                corsprite6 = FALSE;
            }           
        }else {
            selSprite.position = ccp(220,70);
        }
        break;
    default:
        break;
   }

`

Answer 1

On iOS there are two different units of measurement. Points and Pixels. On older devices a point is equal to a pixel. On new devices, there are two pixels for each point, both vertically and horizontally (so totally 4 pixels per point). An iPhone 3 has 480x320 pixels and 480x320 points. Whereas an iPhone 4 has 960x640 pixels and 480x320 points! The important bit here is that the number of points remain the same for old and new devices.

So I'm assuming you're working with pixel sizes instead of point sizes here. When you define a rectangle to be 20x40 on a new device, then this is in points, not pixels. Which in turn results in a 40x80 pixel rectangle, which is of course double the size of your image. Your image of size 20x40 is actually 10x20 points in size (on an iPhone 4).

I don't know how you retrieve your rectangle sizes. If they are hard-coded, just always use the one for the low-res device. If you're measuring them at runtime, always use methods like contentSize instead of contentSizeInPixels.

Summary: Work with points instead of pixels, as points remain the same across iPhone 1 - 4.