`CAGradientLayer` 根据局部坐标空间定义起点和终点

Question

CAGradientLayer 有两个属性 startPoint 和 endPoint。这些属性是根据单位坐标空间定义的。结果是，如果我有两个具有相同起点和终点且边界不同的渐变层，这两个渐变将是不同的。

CAGradientLayer 层的startPoint 和endPoint 如何不根据单位坐标空间而是根据标准点坐标来定义，以便渐变的角度/大小不受边界的影响层？

理想的结果是渐变层可以调整为任何大小或形状，并且渐变保持在原位，尽管裁剪不同。

---

资格： 我知道这似乎是坐标空间之间的一个绝对微不足道的转换，但显然，是的，我实际上就是那么愚蠢，或者CAGradientLayers 的工作方式可能存在一些问题或非常违反直觉。我没有提供我期望的正确方法的示例，因为（假设我只是愚蠢）它只会误导。

---

编辑：

这是我对 CALayer 的实现，它添加了一个子 CAGradientLayer 并配置它的起点和终点。它不会产生预期的结果。

@interface MyLayer ()
@property (nonatomic, strong) CAGradientLayer *gradientLayer;
@end

@implementation MyLayer

- (instancetype)init {
    if (self = [super init]) {
        self.gradientLayer = [CAGradientLayer new];
        [self addSublayer:self.gradientLayer];
        self.gradientLayer.colors = @[ (id)[UIColor redColor].CGColor,  (id)[UIColor orangeColor].CGColor, (id)[UIColor greenColor].CGColor, (id)[UIColor blueColor].CGColor];;
        self.gradientLayer.locations = @[ @0, @.333, @.666, @1 ];
    }
    return self;
}

- (void)layoutSublayers {
    [super layoutSublayers];
    self.gradientLayer.frame = self.bounds;
    self.gradientLayer.startPoint = CGPointMake(0, 0);
    self.gradientLayer.endPoint = CGPointMake(100 / self.bounds.size.width, 40 / self.bounds.size.height);
}

@end

我有一个 .xib 文件，其中包含许多不同大小的 MyLayer。层的梯度都是不同的。

Answer 1

否则您无法定义 startPoint 和 endPoint。你有两个选择：

• 根据视图高度计算这些值（50 像素，100 像素视图高度 = 0.5，100 像素视图高度 = 0.25）

• 以所需的最大固定大小创建渐变（例如：高度为 568），并将其添加为另一个视图的子视图，该视图将根据您的需要调整大小，启用 clipsToBounds。这样，您就可以实现您想要的（让渐变始终从顶部开始并剪切底部，保持渐变居中并剪切顶部和底部等）

Answer 2

如何不根据单位坐标空间而是根据标准点坐标来定义 CAGradientLayer 图层的起点和终点，以使渐变的角度/大小不受图层边界的影响？

不能。但是你可以很容易地想到一个不同的策略。例如：

• 以不同的方式绘制渐变（使用 Quartz 而不是依靠 CAGradientLayer 为您绘制）。

• 使用蒙版使图层显示为一定的大小和形状，您可以通过更改蒙版来更改该大小和形状，但实际上图层本身就是一个大始终具有相同渐变的恒定大小的图层。

• 检测到梯度层改变了边界，改变梯度startPoint和endPoint匹配。这是一个视图的工作示例，其图层是渐变图层并执行此操作 - 但您必须记住每次边界更改时都重新绘制图层！

  override func drawLayer(layer: CALayer!, inContext ctx: CGContext!) {
      let grad = layer as! CAGradientLayer
      grad.colors = [UIColor.whiteColor().CGColor, UIColor.redColor().CGColor]
      let maxx:CGFloat = 500.0 // or whatever
      let maxy:CGFloat = 500.0 // or whatever
      grad.startPoint = CGPointMake(0,0) // or whatever!
      grad.endPoint = CGPointMake(maxx/self.bounds.width, maxy/self.bounds.height)
  }