Strange thing happens with SKSpriteNode with transparent borders

Question

Ok, I have this code:

        SKSpriteNode *flagTile = [((BGSKView *) self.skView).tileSprites[@"flag"] copy];
        flagTile.anchorPoint = CGPointZero;
        flagTile.size = touchedNode.size;
        flagTile.name = @"flag";

        [touchedNode addChild:flagTile];

When user taps a field (an SKSpriteNode) it adds one more sprite to its children - flag node. touchedNode texture size is 80x80, flag texture is 80x80... they are totally equal, the main difference is that the flag texture has transparent borders.

Here:

enter image description here

But strange thing happens: flag node is always has its real (lets call it "tappable") area smaller than the touchedNode and its position is kind a weird thing.

Like so:

enter image description here

The structure of my all layers are like this: compoundNode contains two layers - A and B. When resize of the whole tree is needed xScale and yScale is set (compoundNode). No other manipulations with sizes.

What am I doing wrong?

What I really need is to have my flagTile tappable area to be the size of touchedNode. And one more: if I replace:

SKSpriteNode *flagTile = [((BGSKView *) self.skView).tileSprites[@"flag"] copy];

with this one:

SKSpriteNode *flagTile = [SKSpriteNode spriteWithColor:[UIColor clearColor] size:touchedNode.size];

it works great.

I have tried even changing the texture property after created clearColor sprite - nothing works.

Thanks.

sangony sangony · Accepted Answer · 2014-04-14T23:26:08

The command SKSpriteNode *flagTile = [((BGSKView *) self.skView).tileSprites[@"flag"] copy]; is creating your sprite but is ignoring the invisible parts around the flag. When I open your flag image in my image editor (Adobe Fireworks) and select your flag, only the actual flag rect gets selected (look at the image I posted).

The only workaround I can think of is for you to add a white (or any color you want) square behind the flag with a size of 80,80. Then set the alpha of the square to 1 point above completely transparent. I think this should allow for the entire 80 by 80 image to be touchable.

enter image description here

Strange thing happens with SKSpriteNode with transparent borders

2 Answers