如何在动画时更改 CALayer 的颜色

Posted 2023-03-12

【中文标题】如何在动画时更改 CALayer 的颜色

【英文标题】：How to change color of CALayer while animating

【发布时间】：2017-02-02 16:34:53

【问题描述】：

我有一个圆弧，并改变颜色三遍。我在 SO 上使用了一个示例来帮助我入门：Change CALayer color while animating

这个例子有效，但是颜色是红色，然后是绿色，然后是蓝色。我希望它们是绿色，橙色，然后是红色。我试图弄清楚他是如何在代码中改变颜色的，这让我很困惑：

for (NSUInteger i = 0; i < 3; i++)
        
            CAShapeLayer* strokePart = [[CAShapeLayer alloc] init];
            strokePart.fillColor = [[UIColor clearColor] CGColor];
            strokePart.frame = tutorialCircle.bounds;
            strokePart.path = tutorialCircle.path;
            strokePart.lineCap = tutorialCircle.lineCap;
            strokePart.lineWidth = tutorialCircle.lineWidth;

            // These could come from an array or whatever, this is just easy...
            strokePart.strokeColor = [[UIColor colorWithHue: i * portion saturation:1 brightness:1 alpha:1] CGColor];

所以我相信这条线正在改变颜色：

strokePart.strokeColor = [[UIColor colorWithHue: i * portion saturation:1 brightness:1 alpha:1] CGColor];

我的目标是将这些颜色调整为绿橙红，而不是红绿和蓝。

谢谢

编辑：

这是part的值：

const double portion = 1.0 / ((double)3);

【问题讨论】：

portion的值是多少？

它正好等于 1/3 所以 const double part = 1.0 / ((double)3);

它等于 1/3 或 0.333333，对吧？

是的，我的错我刚刚发现

【参考方案1】：

HUE-Color 系统以 360 度角定义颜色，其中 0 为红色，108 (360*0,3) 为绿色和蓝色。这就是颜色的生成方式：

strokePart.strokeColor = [[UIColor colorWithHue: 0 saturation:1 brightness:1 alpha:1] CGColor]; // RED

strokePart.strokeColor = [[UIColor colorWithHue: 0.3 saturation:1 brightness:1 alpha:1] CGColor]; // GREEN

strokePart.strokeColor = [[UIColor colorWithHue: 0.6 saturation:1 brightness:1 alpha:1] CGColor]; // BLUE

如果你想改变颜色，你可以将部分移动一些其他值：

strokePart.strokeColor = [[UIColor colorWithHue: 0.3 + portion saturation:1 brightness:1 alpha:1] CGColor];

或者你可以定义一个数组，用你想要的颜色：

NSArray* colors = @[ UIColor.green, UIColor.orange, UIColor.red ];
for (id color in colors)
    
        CAShapeLayer* strokePart = [[CAShapeLayer alloc] init];
        strokePart.fillColor = [[UIColor clearColor] CGColor];
        strokePart.frame = tutorialCircle.bounds;
        strokePart.path = tutorialCircle.path;
        strokePart.lineCap = tutorialCircle.lineCap;
        strokePart.lineWidth = tutorialCircle.lineWidth;

        // These could come from an array or whatever, this is just easy...
        strokePart.strokeColor = [color CGColor];

【讨论】：

是的，这更干净。谢谢！

【参考方案2】：

啊，我刚刚想通了。答案如下：

if (i == 0) 
               strokePart.strokeColor = [UIColor greenColor].CGColor;
            

            else if (i == 1) 
                strokePart.strokeColor = [UIColor orangeColor].CGColor;
            

            else if (i == 2) 
                strokePart.strokeColor = [UIColor redColor].CGColor;
            

【讨论】：

干得好！但是如果你想要更多的代码改进，比如更少的条件和更灵活的查看我的答案。 :) 提供