Swift：向按钮添加渐变图层。层长度错误

Question

let gradient: CAGradientLayer = CAGradientLayer()
let colorTop = UIColor(red: 112.0/255.0, green: 219.0/255.0, blue: 155.0/255.0, alpha: 1.0).CGColor
let colorBottom = UIColor(red: 86.0/255.0, green: 197.0/255.0, blue: 238.0/255.0, alpha: 1.0).CGColor

gradient.colors = [colorTop, colorBottom]
gradient.startPoint = CGPoint(x: 0.0, y: 0.5)
gradient.endPoint = CGPoint(x: 1.0, y: 0.5)
gradient.frame = loginButton.bounds
gradient.cornerRadius = 5
loginButton.layer.addSublayer(gradient)

生成的渐变超出了按钮的框架。为什么会这样？

Answer 1

您可能正在viewDidLoad（）或viewWillAppear（）中设置渐变图层。那时控制器没有计算视图大小。当你添加这个子层按钮大小还没有计算，所以子层大小是错误的。所以你应该解决下一件事：

1. 首先，你应该在viewDidAppear（）处添加渐变，此时计算所有视图的大小。
2. 其次，您应该使用layer.insertSublayer（layer，atIndex：index）而不是addSublayer（layer）。因为在你的情况下，子层将隐藏按钮本机层（标题，背景......）
3. 您应该在viewDidLayoutSubviews（）中重新计算子图层大小。因为当你的按钮改变它的大小时（例如旋转），子图层不会改变它的框架，所以你应该自己改变它。

Answer 2

将clipsToBounds和cornerRadius添加到loginbutton。这应该可以解决问题。

loginButton.clipsToBounds = true
loginButton.layer.cornerRadius = 5;

Answer 3

您的登录按钮的框架是否正确？我复制时似乎正确

        let loginButton = UIButton(frame: CGRect(x: 10, y: 50, width: 300, height: 30))
        self.view.addSubview(loginButton)

        let gradient:CAGradientLayer = CAGradientLayer()
        let colorTop = UIColor(red: 112.0/255.0, green: 219.0/255.0, blue: 155.0/255.0, alpha: 1.0).CGColor
        let colorBottom = UIColor(red: 86.0/255.0, green: 197.0/255.0, blue: 238.0/255.0, alpha: 1.0).CGColor

        gradient.colors = [colorTop, colorBottom]
        gradient.startPoint = CGPoint(x: 0.0, y: 0.5)
        gradient.endPoint = CGPoint(x: 1.0, y: 0.5)
        gradient.frame = loginButton.bounds
        gradient.cornerRadius = 5

        loginButton.layer.addSublayer(gradient)

它看起来像下面