圆形CALayer周围较暗的边框

Question

我正在创建一个自定义视图来显示单一颜色，它用于图像中的颜色选择器，因此颜色可能会很快变化。为了防止颜色在光标移动时闪烁，我已经做好了，所以颜色变化的动画超过了0.2秒。

我正在使用CALayer这样做。目前它的功能几乎与预期的一样，但是，我想要一个围绕图层的轮廓，其内容颜色略深，类似于OS X Yosemite close＆amp;调整窗口按钮的大小。

我目前正在使用的方法确实有效，但是，有时边框颜色动画似乎不遵循主色彩动画，有时它会经过较浅的颜色。我以为我可以用过滤器做到这一点，但我绝对难以理解如何做到这一点，我无法在网上找到太多的文档。我对CoreAnimation的经验很少，所以我不确定这是否是最好的方法，或者它是否显得非常明显。

- (id)initWithFrame:(NSRect)frame{
    self = [super initWithFrame:frame];
    if (self) {
        _pickerColour = [NSColor whiteColor];
        strokeColour = [NSColor whiteColor];

        [self setWantsLayer: true];

        innerLayer = [CALayer layer];
        [innerLayer setCornerRadius: frame.size.width / 2];
        [innerLayer setBorderWidth: 4];
        [innerLayer setFrame: CGRectMake(frame.origin.x - frame.size.width / 2, frame.origin.y - frame.size.width / 2, frame.size.width - 2, frame.size.height - 2)];

        [self.layer addSublayer:innerLayer];
    }

    return self;
}

- (void) setPickerColour:(NSColor *)pickerColour{
    CABasicAnimation *backgroundAnimation = [CABasicAnimation animationWithKeyPath:@"backgroundColor"];
    backgroundAnimation.fillMode = kCAFillModeForwards;
    backgroundAnimation.removedOnCompletion = NO;
    backgroundAnimation.fromValue = (id)self.pickerColour.CGColor;
    backgroundAnimation.toValue = (id)pickerColour.CGColor;
    backgroundAnimation.duration = 0.1f;
    [innerLayer addAnimation:backgroundAnimation forKey:@"backgroundColor"];

    CGFloat h,s,b,a;
    [[self.pickerColour colorUsingColorSpaceName: NSCalibratedRGBColorSpace] getHue:&h saturation:&s brightness:&b alpha:&a];
    NSColor *newStrokeColour = [NSColor colorWithHue:h saturation:MIN(s, 1.0) brightness: MAX(b / 1.2, 0.0) alpha:a];

    CABasicAnimation *borderAnimation = [CABasicAnimation animationWithKeyPath:@"borderColor"];
    borderAnimation.fillMode = kCAFillModeForwards;
    borderAnimation.removedOnCompletion = NO;
    borderAnimation.fromValue = (id)strokeColour.CGColor;
    borderAnimation.toValue = (id)newStrokeColour.CGColor;
    borderAnimation.duration = 0.1f;
    [innerLayer addAnimation:borderAnimation forKey:@"borderColor"];

    strokeColour = newStrokeColour;
    _pickerColour = pickerColour;
}

- (NSColor *) pickerColour{
    return _pickerColour;
}

Answer 1

使用CAKeyframeAnimation代替CABasicAnimation，您可以提供values和keyTimes数组，这些数组包含通过颜色空间的路径的分段表示。您可以使用您正在使用的相同NSColor便捷方法，但是您可以指定足够数量的颜色来跟随HSV空间中的所需弧线，而不是通过RGB空间的默认线性轨迹。 / p>