如何用渐变颜色的控制点填充贝塞尔路径

Posted 2023-02-23

【中文标题】如何用渐变颜色的控制点填充贝塞尔路径

【英文标题】：How to fill a bezier path with control points with gradient color

【发布时间】：2018-06-25 08:24:24

【问题描述】：

我需要用渐变颜色填充我的贝塞尔路径。但是效果不是我预期的，我知道这是绘制方向造成的。

如何实现第二张图的效果？

【问题讨论】：

到目前为止您尝试过什么？你的代码是什么样的？

【参考方案1】：

我的贝塞尔路径代码

        CGFloat deltaX = lineChartPoint.x - previousLineChartPoint.x;
        CGFloat controlPointX = previousLineChartPoint.x + (deltaX / 2);

        CGPoint controlPoint1 = CGPointMake(controlPointX, previousLineChartPoint.y);
        CGPoint controlPoint2 = CGPointMake(controlPointX, lineChartPoint.y);

        [bezierPath addCurveToPoint:CGPointMake(lineChartPoint.x, lineChartPoint.y) controlPoint1:controlPoint1 controlPoint2:controlPoint2];

我的渐变图层代码

self.gradientLayer = [CAGradientLayer layer];
    self.gradientLayer.frame = CGRectMake(kVPadding, 0, CGRectGetWidth(self.bounds) - 2 * kVPadding, CGRectGetHeight(self.bounds));
    self.gradientLayer.colors = @[(__bridge id)[UIColor colorWithHex:0x8362FC alpha:0.9].CGColor,(__bridge id)[UIColor colorWithHex:0x517DF7 alpha:0.1].CGColor];
    self.gradientLayer.locations=@[@0.0,@1.0];
    self.gradientLayer.startPoint = CGPointMake(0.0,0.0);
    self.gradientLayer.endPoint = CGPointMake(0.0,1);
    [self.layer addSublayer:self.gradientLayer];

    self.gradientShapeLayer = [[CAShapeLayer alloc] init];
    self.gradientLayer.mask = self.gradientShapeLayer;
    self.gradientShapeLayer.path = bezierPath.CGPath;

@Dragonthoughts