Question

有没有办法在SpriteKit中创建一个渐变填充框？我已经尝试用它填充一个形状节点，但它注意到只有纯色适用于skshapenode。

Answer 1

这是一个解决方案。（注意，我正在使用Rubymotion，一个用于Objective C / iOS的ruby绑定，但逻辑完全相同。如果有人想编辑它并将目标c等效，请继续

  size = CGSizeMake(50,50)
  scale = options[:scale] || UIScreen.mainScreen.scale
  opaque = options.fetch(:opaque, false)

  UIGraphicsBeginImageContextWithOptions(size, opaque, scale)
  context = UIGraphicsGetCurrentContext()

  gradient = CAGradientLayer.layer
  gradient.frame = CGRectMake(0,0,50,50)
  gradient.colors = [SKColor.blackColor.CGColor,SKColor.whiteColor.CGColor]
  gradient.renderInContext(context)

  image = UIGraphicsGetImageFromCurrentImageContext()
  UIGraphicsEndImageContext()

  texture = SKTexture.textureWithCGImage(image.CGImage)
  node = SKSpriteNode.alloc.initWithTexture(texture)

Answer 2

我认为当前的SKShapeNode不可能实现这一点，目前它几乎无法处理其基本功能。如果您不想使用预先存在的精灵渐变图像，那么一种好的方法是创建一个SKTexture，将CIFilter（在这种情况下可能为CILinearGradient）应用于基本框图像，然后从SKSpriteNode创建SKTexture。

Answer 3

好的，这是我现在正在使用的东西。我基于AwDogsGo2Heaven的解决方案，但适用于Mac。一个完全兼容的解决方案将是甜蜜的。我不太确定如何创建上下文。但似乎工作。我也不确定规模。在视网膜mac和非视网膜上运行并且看不到任何问题但是使用比例2创建上下文因此对于非视网膜mac可能是过度杀伤。我把它放在SKTexture的一个类别中。

要使用它，只需拨打+(SKTexture*)gradientWithSize:(const CGSize)SIZE colors:(NSArray*)colors。

修改：在此处更新了代码和更多讨论：Gradient texture has wrong scale on retina Mac

Answer 4

马特的答案是正确的，但我还是无法添加渐变。这是我的尝试，如果有人知道如何使它工作，请更新线程。

以下是Core Image Ref

CIFilter *gradientFilter = [CIFilter filterWithName:@"CILinearGradient"];
//[gradientFilter setDefaults];
CIColor *startColor = [CIColor colorWithRed:1.0 green:1.0 blue:1.0 alpha:1.0];
CIColor *endColor = [CIColor colorWithRed:0 green:0 blue:0 alpha:1.0];
CIVector *startVector = [CIVector vectorWithX:0 Y:0];
CIVector *endVector = [CIVector vectorWithX:0.21 Y:0.31];
[gradientFilter setValue:startVector forKey:@"inputPoint0"];
[gradientFilter setValue:endVector forKey:@"inputPoint1"];
[gradientFilter setValue:startColor forKey:@"inputColor0"];
[gradientFilter setValue:endColor forKey:@"inputColor1"];

SKEffectNode *effectNode = [SKEffectNode node];
effectNode.filter = gradientFilter;
effectNode.shouldEnableEffects = YES;

[self addChild:effectNode];
//effectNode.position = CGPointMake(200, 200);

测试过滤器的另一个好方法是从WWDC 2013下载演示应用 CIFunHouse 。

如何在Spritekit中创建渐变？

4 个答案: