iOS 不使用 CAGradientLayer 用其他颜色填充 UIBezierPath 的一半

Question

我有一个关于画一半 UIBezierPath 的问题。如何在不使用 CAGradientLayer 的情况下用绿色填充左侧部分（拇指左侧），右侧部分（拇指右侧）填充白色？

我用来创建贝塞尔路径的代码 - https://gist.github.com/robertmryan/67484c74297cede3926a3aed2fceedb9

我要实现的截图：

Answer 1

一种方法是向弯曲路径形状图层添加遮罩层。

当"thumb"位置改变时，改变遮罩的宽度，只显示形状层的"left-side"。

创建一个形状图层用作蒙版：

let maskLayer: CALayer = {
    let layer = CALayer()
    layer.backgroundColor = UIColor.black.cgColor
    return layer
}()

在viewDidLoad()中将该图层设置为曲线图层的蒙版：

pathLayer.mask = maskLayer

每当设置 "thumb" 位置时，更新遮罩的宽度：

func updateMask(at point: CGPoint) -> Void {
    var f = view.bounds
    f.size.width = point.x
    CATransaction.begin()
    CATransaction.setDisableActions(true)
    maskLayer.frame = f
    CATransaction.commit()
}

我在以下位置发布了你的要点的修改版本：https://gist.github.com/DonMag/a2154e70a3c67193a7b19bee41c8fe95

它确实只有一些变化...寻找以 // DonMag -

开头的评论

这是结果（后面有一个 imageView 以显示透明度）：

编辑

经过评论，目标是让轨道路径的 "right-side" 为白色而不是透明。

使用相同的方法，我们可以在原始形状层的顶部添加一个白色形状层，并将其遮罩以仅显示右侧。

这是一个更新的要点 - https://gist.github.com/DonMag/397dfbe4779e817531ef7a663365b2e7 - 显示了这个结果：

iOS 不使用 CAGradientLayer 用其他颜色填充 UIBezierPath 的一半

iOS Fill half of UIBezierPath with other color without CAGradientLayer

curve

slider

uiscrollview

uibezierpath

swift