如何使用SpriteKit制作聚光灯效果?

时间:2017-12-01 03:06:58

标签: ios sprite-kit

在我提出这个问题之前,我仔细检查过以下问题和例子:

  1. SKCropNode not working on device while working on simulator

  2. Swift 3: cut a hole in a SKSpriteNode

  3. 以上效果适用于所有模拟器,但它并不适用于真实设备。

    ObjetiveC中的我的代码:

    SKSpriteNode* mask = [SKSpriteNode spriteNodeWithColor:[UIColor blackColor] size:size];
    mask.position = CGPointMake(size.width/2, size.height/2);
    mask.name = @"Mask";
    mask.alpha = 0.5;
    mask.zPosition = 3;
    
    SKSpriteNode* node = [SKSpriteNode spriteNodeWithColor:[UIColor whiteColor] size:size];
    node.position = CGPointMake(size.width/2, size.height/2);
    node.name = @"circleMask";
    node.zPosition = 1;
    node.alpha = 1;
    SKShapeNode* circleNode = [SKShapeNode shapeNodeWithCircleOfRadius:100/2+20];
    circleNode.fillColor = [UIColor whiteColor];
    circleNode.lineWidth = 0;
    circleNode.alpha = 1;
    circleNode.position = CGPointMake(80, -200);
    circleNode.name = @"circleNode";
    circleNode.zPosition = 1;
    circleNode.blendMode = SKBlendModeSubtract;
    [node addChild:circleNode];
    
    SKCropNode* cropNode = [[SKCropNode alloc] init];
    cropNode.name = @"cropNode";
    cropNode.position = CGPointZero;
    cropNode.zPosition = 2;
    [cropNode setMaskNode: node];
    [cropNode addChild:mask];
    [scene addChild:cropNode];
    

    我想知道是否有人成功实施了上述类似方法的功能,如果是,请澄清一下,如果没有,你能发布你的解决方案吗?非常感谢。

    我附加了一张图片,以显示在Simulator和iPhone 6上运行的相同代码: Picture to show the issue

    我的计划:

    我不是使用SKCropNode,而是以编程方式创建一个在正确位置有一个洞的UIImage,并将其渲染为SKSpriteNode的纹理。我通过使用创建的UIImage初始化SKSpriteNode来实现该功能:

    -(instancetype)init{
        CGRect rect = CGRectMake(0, 0, self.size.width, self.size.height);
        CGRect spotLightRect = CGRectMake(100,100,200,200); // adjust this as desired!
        UIGraphicsBeginImageContextWithOptions(rect.size, NO, 0);
        CGContextRef c = UIGraphicsGetCurrentContext();
        UIColor*bColor = [UIColor colorWithRed:0 green:0.0 blue:0 alpha:0.5];
        CGContextSetFillColorWithColor(c, bColor.CGColor);
        CGContextFillRect(c, rect); //the mask
        UIColor*aColor = [UIColor colorWithRed:0 green:0.0 blue:0 alpha:1];
        CGContextSetFillColorWithColor(c, aColor.CGColor);
        CGContextSetBlendMode(c, kCGBlendModeClear);
        CGContextFillEllipseInRect(c, spotLightRect); //the hole
        UIImage* image = UIGraphicsGetImageFromCurrentImageContext();
        UIGraphicsEndImageContext();
        SKTexture* texture = [SKTexture textureWithImage:image];
        self = [super initWithTexture:texture];
        return self;
    }
    

1 个答案:

答案 0 :(得分:1)

你的职位和数学有问题,我打算将其分解

离开:

SKSpriteNode* mask = [SKSpriteNode spriteNodeWithColor:[UIColor blackColor] size:size];

删除:

mask.position = CGPointMake(size.width/2, size.height/2);

假:

mask.name = @"Mask";
mask.alpha = 0.5;

删除:

mask.zPosition = 3;

假:

SKSpriteNode* node = [SKSpriteNode spriteNodeWithColor:[UIColor whiteColor] size:size];

删除:

node.position = CGPointMake(size.width/2, size.height/2);

假:

node.name = @"circleMask";

删除:

node.zPosition = 1;

假:

node.alpha = 1;
SKShapeNode* circleNode = [SKShapeNode shapeNodeWithCircleOfRadius:100/2 + 20];
circleNode.fillColor = [UIColor whiteColor];
circleNode.lineWidth = 0;
circleNode.alpha = 1;
circleNode.position = CGPointMake(80, -200);
circleNode.name = @"circleNode";

删除:

circleNode.zPosition = 1;

假:

circleNode.blendMode = SKBlendModeSubtract;
[node addChild:circleNode];

SKCropNode* cropNode = [[SKCropNode alloc] init];
cropNode.name = @"cropNode";
cropNode.position = CGPointZero;
cropNode.zPosition = 2;
[cropNode setMaskNode: node];
[cropNode addChild:mask];
[scene addChild:cropNode];

最终结果:

SKSpriteNode* mask = [SKSpriteNode spriteNodeWithColor:[UIColor blackColor] size:size];
mask.name = @"Mask";
mask.alpha = 0.5;

SKSpriteNode* node = [SKSpriteNode spriteNodeWithColor:[UIColor whiteColor] size:size];
node.name = @"circleMask";
node.alpha = 1;
SKShapeNode* circleNode = [SKShapeNode shapeNodeWithCircleOfRadius:100/2+20];
circleNode.fillColor = [UIColor whiteColor];
circleNode.lineWidth = 0;
circleNode.alpha = 1;
circleNode.position = CGPointMake(80, -200);
circleNode.name = @"circleNode";
circleNode.blendMode = SKBlendModeSubtract;
[node addChild:circleNode];

SKCropNode* cropNode = [[SKCropNode alloc] init];
cropNode.name = @"cropNode";
cropNode.position = CGPointZero;
cropNode.zPosition = 2;
[cropNode setMaskNode: node];
[cropNode addChild:mask];
[scene addChild:cropNode];

你现在应该有一个黑洞,有一个80,-200

的洞