【问题标题】:CAGradientLayer not draw the gradient correctlyCAGradientLayer 没有正确绘制渐变
【发布时间】:2016-06-11 07:48:23
【问题描述】:

我用CAShapeLayer画了一个圆,设置为CAGradientLayer的mask,代码如下:

CAShapeLayer *circleShapeLayer = [CAShapelayer new];
// draw circle path code here...

CAGradientLayer *gradientLayer = [CAGradientLayer layer];
gradientLayer.colors = @[(__bridge id)[UIColor whiteColor].CGColor,
                         (__bridge id)[UIColor clearColor].CGColor];
// self here means a UIView
gradientLayer.mask = circleShapeLayer;
gradientLayer.frame = self.bounds;
[self.layer addSublayer:gradientLayer];

当我运行应用程序时,它会显示一个渐变圆圈,但是渐变很奇怪。

我想要的是一个圆圈,起点是白色,终点是透明色,应该是这样的:

但是模拟器屏幕中圆圈的颜色是:

颜色是对称的。

我认为问题是我没有正确设置gradientLayer.colors,我该如何解决?

【问题讨论】:

标签: ios objective-c cagradientlayer


【解决方案1】:

CAGradientLayer 不能沿弧线绘制渐变。另一方面,遮罩层的边框比渐变层的边框太小,看不到清晰的颜色

【讨论】:

    【解决方案2】:

    对于 Umair 的回复,起初我觉得这没有意义,因为即使 whiteColorblackColor 也被 colorWithRed:green:blue:alpha 获取,但后来我在文档中读到了这一点:

    渲染时,颜色在被插值之前被映射到输出颜色空间。

    所以也许真的是这样:

    gradientLayer.colors = @[(__bridge id)[UIColor colorWithRed:1.0f green:1.0f blue:1.0f alpha:1.0f].CGColor,
                             (__bridge id)[UIColor colorWithRed:1.0f green:1.0f blue:1.0f alpha:0.0f].CGColor];
    

    【讨论】:

      【解决方案3】:

      @J.Hunter 的answer 是正确的,因为CAGradientLayers 不能沿着弧线绘制。这意味着您绘制的渐变将被限制为 radiallinear。您特别希望创建一个 angled 渐变,我过去也尝试过这样做。

      不幸的是,CAGradientLayer 受到这些限制,而我发现创建带角度渐变的最佳方法是使用包含角度渐变的UIImage 进行屏蔽。这不会像绘制自己的渐变那样动态,但它似乎是目前最好的(可能是唯一的)选择。

      【讨论】:

        猜你喜欢
        • 1970-01-01
        • 1970-01-01
        • 2016-12-13
        • 1970-01-01
        • 2018-03-21
        • 2020-08-25
        • 1970-01-01
        • 1970-01-01
        • 1970-01-01
        相关资源
        最近更新 更多