在SpriteKit中，SKCropNode對SKShapeNode沒有影響

Question

我一直在嘗試使用SKCropNode將掩碼應用於SKShapeNode，到目前為止還沒有成功。 認為這是一個SpriteKit錯誤 - 這是代碼片段：

SKNode* contentNode = [SKNode node];

// picture - use an image bigger than 50x50
SKSpriteNode *pictureNode = [SKSpriteNode spriteNodeWithImageNamed:@"tree"];

// triangle
SKShapeNode* triangleNode = [SKShapeNode node];
UIBezierPath* triangleNodeBezierPath = [[UIBezierPath alloc] init];
[triangleNodeBezierPath moveToPoint:CGPointMake(0.0, 0.0)];
[triangleNodeBezierPath addLineToPoint:CGPointMake(0.0, 100.0)];
[triangleNodeBezierPath addLineToPoint:CGPointMake(50.0, 100.0)];
[triangleNodeBezierPath closePath];

triangleNode.path = triangleNodeBezierPath.CGPath;
triangleNode.fillColor = [UIColor colorWithRed:1.0 green:1.0 blue:1.0 alpha:1];

// create a mask
SKSpriteNode *mask = [SKSpriteNode spriteNodeWithColor:[SKColor blackColor] size: CGSizeMake(50, 50)]; //50 by 50 is the size of the mask

// create a SKCropNode
SKCropNode *cropNode = [SKCropNode node];

[cropNode addChild: contentNode];
[cropNode setMaskNode: mask];

[self addChild: cropNode];
[contentNode addChild:pictureNode]; // pictureNode is being cropped
[contentNode addChild:triangleNode]; // triangleNode is not

cropNode.position = CGPointMake( CGRectGetMidX (self.frame), CGRectGetMidY (self.frame));

有沒有人有關於這個問題的解決方法？ 非常感謝！

Answer 1

這一天大部分時間一直困擾着我。 我曾計划創建一個類似於Tony Chamblee的優秀TCProgressTimer的計時器。 但是，由於我的應用程序使用多個進度計時器，我不想設計幾十個不同大小的精靈用於不同的分辨率。

我的解決方案是將SKShapeNode對象轉換為SKSpriteNode對象。 我最終不得不回到基礎並使用Core Graphics來完成繁重的任務。 這是一種相當混亂的做事方式，我敢肯定，但我希望快速結果動態創建類似於使用SKShapeNode時獲得的結果的對象。

我目前只對制作圓形物體感興趣，所以我這樣做：

-(SKSpriteNode *)createSpriteMatchingSKShapeNodeWithRadius:(float)radius color:(SKColor *)color {
    CALayer *drawingLayer = [CALayer layer];
    CALayer *circleLayer = [CALayer layer];
    circleLayer.frame = CGRectMake(0,0,radius*2.0f,radius*2.0f);
    circleLayer.backgroundColor = color.CGColor;
    circleLayer.cornerRadius = circleLayer.frame.size.width/2.0;
    circleLayer.masksToBounds = YES;


    [drawingLayer addSublayer:circleLayer];

    UIGraphicsBeginImageContextWithOptions(CGSizeMake(circleLayer.frame.size.width, circleLayer.frame.size.height), NO, [UIScreen mainScreen].scale);
    CGContextSetAllowsAntialiasing(UIGraphicsGetCurrentContext(), TRUE);
    CGContextSetFillColorWithColor(UIGraphicsGetCurrentContext(), [UIColor clearColor].CGColor);
    CGContextFillRect(UIGraphicsGetCurrentContext(), CGRectMake(0,0,circleLayer.frame.size.width,circleLayer.frame.size.height));
    [drawingLayer renderInContext: UIGraphicsGetCurrentContext()];

    UIImage *layerImage = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();

    SKSpriteNode *sprite = [SKSpriteNode spriteNodeWithTexture:[SKTexture textureWithImage:layerImage]];


    return sprite;
}

現在，生成的精靈可以按預期被SKCropNode屏蔽。 由於這些精靈都是在場景開始之前生成的，所以我沒有注意到性能受到影響。 但是，我想如果你動態生成多個節點，這種方法效率很低。

我很想聽聽其他用戶的解決方案。 希望有所幫助。

-DC

Answer 2

我的應用程序中有類似的任務。 我需要根據用戶輸入繪制多個不規則形狀，然后將它們用作裁剪節點的蒙版。

適合我的解決方案是：

1. 創建具有所需路徑的SKShapeNode

2. 使用SKView方法textureFromNode:crop:從中檢索SKTexture textureFromNode:crop:

3. 從該紋理創建一個SKSpriteNode。

4. 使用SKSprite節點作為掩碼。

Answer 3

你的頭銜是對的。 我還發現在CropNode的層次結構中有一個ShapeNode也會影響它上面的子節點。 我創建了一個快速實驗。 您可以創建一個新的游戲項目並親自嘗試。 通過注釋掉addChild：shapeContent線之一，您可以看到它如何影響太空飛船圖像的裁剪。

正如DoctorClod指出的那樣，當前的解決方案似乎是確保cropNode的所有子節點都是SpriteNodes。

-(void)didMoveToView:(SKView *)view {

SKSpriteNode* colorBackground = [SKSpriteNode spriteNodeWithColor:[SKColor redColor] size:CGSizeMake(800, 600)];

SKSpriteNode *spaceshipImage = [SKSpriteNode spriteNodeWithImageNamed:@"Spaceship"];

SKShapeNode* shapeContent = [SKShapeNode shapeNodeWithRect:CGRectMake(0, 0, 200, 100)];
shapeContent.fillColor = [SKColor greenColor];

SKSpriteNode *maskShape  = [SKSpriteNode spriteNodeWithColor:[SKColor blackColor] size:CGSizeMake(500, 100)];

SKCropNode *cropNode = [SKCropNode new];

[cropNode addChild:colorBackground];
[cropNode addChild:shapeContent];     // comment this one out
[cropNode addChild:spaceshipImage];
[cropNode addChild:shapeContent];     // or comment this one out

[cropNode setMaskNode:maskShape];

cropNode.position = CGPointMake(CGRectGetMidX (self.frame), CGRectGetMidY(self.frame));
[self addChild:cropNode];
}