CAGradientLayer 没有正确绘制渐变
CAGradientLayer not draw the gradient correctly
我用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
,我该如何解决?
对于 Umair 的回应,一开始我觉得这没有意义,因为 whiteColor
或 blackColor
也被 colorWithRed:green:blue:alpha
获取,但后来我在文档中读到了:
When rendered, the colors are mapped to the output color space before being interpolated.
也许真的是这样:
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];
CAGradientLayer 不能沿着圆弧绘制渐变。另一方面,遮罩层的边框比渐变层的边框太小,看不清颜色
@J.Hunter 的 is correct in that CAGradientLayer
s cannot draw along an arc. This means that your drawn gradients will be limited to radial and linear. You are specifically looking to create an angled 渐变,我过去也尝试过这样做。
不幸的是,CAGradientLayer
受限于这些限制,我发现创建遮罩斜角渐变的最佳方法是使用包含斜角渐变的 UIImage
遮罩。这不会像绘制自己的渐变那样动态,但它似乎是目前最好的(可能是唯一的)选择。
我用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
,我该如何解决?
对于 Umair 的回应,一开始我觉得这没有意义,因为 whiteColor
或 blackColor
也被 colorWithRed:green:blue:alpha
获取,但后来我在文档中读到了:
When rendered, the colors are mapped to the output color space before being interpolated.
也许真的是这样:
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];
CAGradientLayer 不能沿着圆弧绘制渐变。另一方面,遮罩层的边框比渐变层的边框太小,看不清颜色
@J.Hunter 的 CAGradientLayer
s cannot draw along an arc. This means that your drawn gradients will be limited to radial and linear. You are specifically looking to create an angled 渐变,我过去也尝试过这样做。
不幸的是,CAGradientLayer
受限于这些限制,我发现创建遮罩斜角渐变的最佳方法是使用包含斜角渐变的 UIImage
遮罩。这不会像绘制自己的渐变那样动态,但它似乎是目前最好的(可能是唯一的)选择。