0

我正在使用来自Palimondo的示例代码：这是学习如何将 CAGradientLayer 屏蔽到 CAShapeLayers 上的出色代码。输出如下：

在此处输入图像描述

现在我正在尝试创建此图像：

在此处输入图像描述

使用 PaintCode，我能够获取所有 UIBezierPath 和渐变颜色并停止并将它们放入多个数组中，并且基本上遍历每个将其添加到新的 CAShapeLayer 和 CAGradientLayer 中，如下所示：

- (void)viewDidLoad
{
    [super viewDidLoad];
    [self blackPaths];
    [self setupGradients];
    int count = 0;
    for (CAGradientLayer *gradientLayerItem in _individualGradientArrays) {

        CAShapeLayer *gradientMask = [CAShapeLayer layer];
        gradientMask.fillColor = [[UIColor clearColor] CGColor];
        gradientMask.strokeColor = [[UIColor blackColor] CGColor];
        gradientMask.lineWidth = 4;
        gradientMask.frame = CGRectMake(0, 0, _testView.bounds.size.width, _testView.bounds.size.height);
        //
        //    CGMutablePathRef t = CGPathCreateMutable();
        //    CGPathMoveToPoint(t, NULL, 0, 0);
        //    CGPathAddLineToPoint(t, NULL, _testView.bounds.size.width, _testView.bounds.size.height);

        gradientMask.path = [[_UIBezierPathsArray objectAtIndex:count]CGPath];


        CAGradientLayer *gradientLayer = [CAGradientLayer layer];
        gradientLayer.locations = gradientLayerItem.locations;
        gradientLayer.startPoint = CGPointMake(0.5,1.0);
        gradientLayer.endPoint = CGPointMake(1.0,0.5);
        gradientLayer.frame = CGRectMake(0, 0, _testView.bounds.size.width, _testView.bounds.size.height);
        //    NSMutableArray *colors = [NSMutableArray array];
        //    for (int i = 0; i < 3; i++) {
        //        [colors addObject:(id)[[UIColor colorWithHue:(0.2 * i) saturation:1 brightness:.8 alpha:1] CGColor]];
        //    }
        gradientLayer.colors = gradientLayerItem.colors;

        [gradientLayer setMask:gradientMask];
        [_testView.layer addSublayer:gradientLayer];
        count++;
    }

[_testView setNeedsDisplay];

目标是拥有 16 个单独的 CAGradientLayer，我可以使用 CoreAnimation 对其进行动画处理以创建一种“旋转”效果（我可以将 PaintCode 的输出放入 drawRect 中，它可以工作，问题是我被告知我会通过 CoreGraphics 对颜色或渐变进行动画处理比将它们放置在图层中要困难得多）。

然后，输出如下：

70年代舞会版...

经过 100 次迭代之后，在此之前，我尝试换掉[UIColor clearColor]for whiteColor（这不是示例代码所需的），然后输出：

差不多好了...

你可以看到只有几个渐变，我相信这whiteColor会干扰 CAGradientLayer。

我知道我一定错过了一些非常微妙的东西，但我似乎看不到它。

为什么在示例代码中，我们能够使用clearColor并适当地显示渐变，但使用clearColor我的 UIBezierPath 附加到我的 CAShapeLayer 时，渐变会中断？

一位朋友提到，另一种解决方案是使用 3 个渐变圆并基本上在蒙版形状上同心旋转它们，从而产生错觉，但是我不知道如何才能做到这一点。

4

1 回答 1

1

很难从这里确切地说出发生了什么。在第三张图片（基于您的代码）中，您在遮罩中的透明填充周围绘制不透明的黑色笔触，因此当您将其用作遮罩时，只有您笔触的区域才会从渐变层“可见”（这些只是笔画的提示是您可以看到笔画斜接）。当您将 clearColor 更改为 whiteColor （不透明）时，路径内部的区域也从渐变层变得可见（提示是由于笔划沿路径中间延伸，线条看起来更粗，从而“增肥”填充。笔画斜接也不再可见，因为它们已被填充遮挡。）

在遮罩层中，颜色无关紧要——重要的是 Alpha 通道（不透明度）。这就是为什么 whiteColor 与 blackColor 没有区别的原因。它们的 alpha 值为 1.0，而 clearColor 的 alpha 值为 0.0。从标题：

/* A layer whose alpha channel is used as a mask to select between the
 * layer's background and the result of compositing the layer's
 * contents with its filtered background. Defaults to nil. When used as
 * a mask the layer's `compositingFilter' and `backgroundFilters'
 * properties are ignored. When setting the mask to a new layer, the
 * new layer must have a nil superlayer, otherwise the behavior is
 * undefined. */

@property(retain) CALayer *mask;

这就是为什么您不再在第四张图像中看到描边斜接的原因——它们被遮罩仅查看 Alpha 通道并且无论色调（即白色或黑色）如何，它们都使用 Alpha 绘制的事实所隐藏1.0。

同样，目前尚不清楚您最终要在这里做什么，但是您对 whiteColor 的使用感觉就像是一条红鲱鱼。如果您的目标是看起来像第二张图像，您可能希望遮罩层没有描边和不透明填充，如下所示：

gradientMask.fillColor = [[UIColor blackColor] CGColor];
gradientMask.strokeColor = [[UIColor clearColor] CGColor];
于 2013-07-30T13:17:42.487 回答