在UIView上部分设置渐变，一半颜色是渐变，一半是单色

Question

试图

显示进度条使其自定义，需要UIView将其帧设置为进度的百分比。假设框架宽度的 20% 并制作渐变，但剩余的 80% 应该是白色和文本定义百分比。

面临的问题是无法显示文本集 UILabel 而不是 UIView，但文本不显示。请指导。以下是我尝试过的。

let view: UILabel = UILabel(frame: CGRectMake(0.0, self.scrollMainView.frame.size.height-50, self.view.frame.size.width/5, 50))
    let gradient: CAGradientLayer = CAGradientLayer()
    gradient.frame = view.bounds
    gradient.locations = [0.0 , 1.0]
    gradient.startPoint = CGPoint(x: 0.0, y: 0.5)
    gradient.endPoint = CGPoint(x: 1.0, y: 0.5)
    let color0 = UIColor(red:71.0/255, green:198.0/255, blue:134.0/255, alpha:1.0).CGColor
    let color1 = UIColor(red:25.0/255, green:190.0/255, blue: 205.0/255, alpha:1.0).CGColor
   // let color2 = UIColor(red:0.0/255, green:0.0/255, blue: 0.0/255, alpha:1.0).CGColor
    gradient.colors = [color1, color0]
    view.layer.insertSublayer(gradient, atIndex: 0)
    self.scrollMainView.addSubview(view)
    view.text = "20%"
    view.textColor = UIColor.blackColor()
    view.layer.shadowColor = UIColor.blackColor().CGColor
    view.layer.shadowOpacity = 1
    view.layer.shadowOffset = CGSizeZero
    view.layer.shadowRadius = 2

Answer 1

我无法从您的问题中准确理解您的问题，但我只会根据问题标题回答。要获得一半颜色渐变和一半单色，您必须使用三种颜色渐变并相应地设置它们的位置：

gradient.colors = [color1,color1, color0]
gradient.locations = [0.0, 0.5, 1.0]

这样，您将绘制从 color1 到 color1（实际上是单色）的渐变，并用它填充 50% 的帧区域，以及从 color1 到 color0 的渐变，这将填充帧的另一半。

Answer 2

我回答为什么你看不到文本。

忘记一秒钟的图层，考虑子视图。如果将子视图添加到 UILabel 会发生什么情况？当然，它将位于标签内容的顶部。

因此，这同样适用于图层。UILabel 在其主图层上绘制其文本，您添加到主图层的任何子图层都位于其顶部。

我的建议是使用带有CAGradientLayer子层和UILabel子视图的UIView。

或者更好的是，对UIView进行子类化，以便使用CAGradientLayer作为支持层（通过class func layerClass() -> AnyClass方法），只需添加UILabel作为子视图。

下面是一个示例：

class CustomView : UIView {
    lazy var label : UILabel = {
        let l = UILabel(frame: self.bounds)
        l.text = "20%"
        l.textColor = UIColor.blackColor()
        l.backgroundColor = UIColor.clearColor()
        return l
    }()
    override class func layerClass() -> AnyClass {
        return CAGradientLayer.self
    }
    override init(frame: CGRect) {
        super.init(frame: frame)
        commonInit()
    }
    required init?(coder aDecoder: NSCoder) {
        super.init(coder: aDecoder)
        commonInit()
    }
    private func commonInit() {
        let gradient: CAGradientLayer = self.layer as! CAGradientLayer
        gradient.locations = [0.0 , 1.0]
        gradient.startPoint = CGPoint(x: 0.0, y: 0.5)
        gradient.endPoint = CGPoint(x: 1.0, y: 0.5)
        let color0 = UIColor(red:71.0/255, green:198.0/255, blue:134.0/255, alpha:1.0).CGColor
        let color1 = UIColor(red:25.0/255, green:190.0/255, blue: 205.0/255, alpha:1.0).CGColor
        gradient.colors = [color1, color0]
        label.frame = bounds
        label.autoresizingMask = [.FlexibleWidth, .FlexibleHeight]
        self.addSubview(label)
    }
}