使用自动布局为 UIView 应用渐变背景 [英] Applying gradient background for UIView using auto layout

问题描述

我扩展了 UIView 以添加一个 addGradientWithColor() 方法来获取渐变背景:

I extended UIView to add a addGradientWithColor() method to get the gradient background:

 extension UIView {
   func addGradientWithColor() {
     let gradient = CAGradientLayer()
     gradient.frame = self.bounds
     gradient.colors = [gradientEndColor.CGColor,  gradientStartColor.CGColor]
     gradient.startPoint = CGPointMake(1,0)
     gradient.endPoint = CGPointMake(0.2,1)
    self.layer.insertSublayer(gradient, atIndex: 0)
  } } 

我的问题是当我运行横向模式时，UIView 没有被拉伸

My issue is when I run landscape mode, the UIView is not stretched

override func viewDidLayoutSubviews() {
    super.viewDidLayoutSubviews()
    self.view.addGradientWithColor() }

我尝试调用 viewDidLayoutSubviews() 但它无法正常工作

I tried to calling viewDidLayoutSubviews() but its not working properly

这是屏幕截图:

删除 viewDidLayoutSubviews() 后

after removing viewDidLayoutSubviews()

推荐答案

您可以子类化 UIView 并覆盖添加渐变的 drawRect 方法.

You can subclass the UIView and override drawRect method where you add your gradient.

更新到 Swift 4

class GradientView: UIView {

    private let gradient : CAGradientLayer = CAGradientLayer()
    private let gradientStartColor: UIColor
    private let gradientEndColor: UIColor

    init(gradientStartColor: UIColor, gradientEndColor: UIColor) {
        self.gradientStartColor = gradientStartColor
        self.gradientEndColor = gradientEndColor
        super.init(frame: .zero)
    }

    required init?(coder aDecoder: NSCoder) { fatalError("init(coder:) has not been implemented") }

    override func layoutSublayers(of layer: CALayer) {
        super.layoutSublayers(of: layer)
        gradient.frame = self.bounds
    }

    override public func draw(_ rect: CGRect) {
        gradient.frame = self.bounds
        gradient.colors = [gradientEndColor.cgColor, gradientStartColor.cgColor]
        gradient.startPoint = CGPoint(x: 1, y: 0)
        gradient.endPoint = CGPoint(x: 0.2, y: 1)
        if gradient.superlayer == nil {
            layer.insertSublayer(gradient, at: 0)
        }
    }
}

创建 UIView 后，您只需要将约束添加到该视图.

After you create your UIView you just need to add your constraints to that view.

这篇关于使用自动布局为 UIView 应用渐变背景的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！