iOS SDK:Corner Radius显示不正确

时间:2016-08-01 12:32:01

标签: ios swift uiview uibutton

我已经在Sketch中设计了屏幕:

enter image description here

有两个按钮。现在我在Xcode中设计这样的按钮,我就是这样设置UIButton的角半径:

layer.cornerRadius = 30
clipsToBounds = true

但结果我有一些奇怪的事情:

enter image description here

如果按钮的左右两侧,您可以在中心看到一些角落。我该怎么办?

4 个答案:

答案 0 :(得分:5)

要在此类按钮上生成圆角,如果将cornerRadius值设置为30,则假设按钮的高度设置为60

在所有设备上可能不是这样,具体取决于您处理布局的方式。看到您的图像,看起来按钮的高度略低于您设计的按钮。

两个选项:

  1. 使用自动布局并在按钮上添加“固定高度”约束,值为60,因此您的按钮的高度始终为60磅。
  2. 实施UIButton子类,并在layoutSubviews方法中,将cornerRadius设置为按钮bounds的一半高度。这样,只要系统重新绘制按钮,角半径就会适当更新。

答案 1 :(得分:1)

创建一个自定义UIButton类并将所有所需按钮设置为该类,这样您就不需要在每个UIViewController类中再添加任何代码。

自定义UIButton类应如下所示:

import UIKit

class RoundCornerButton: UIButton {

   override func drawRect(rect: CGRect) {
       // Drawing code
       self.clipsToBounds = true
       self.layer.cornerRadius = self.frame.size.width / 2
   }

}

答案 2 :(得分:0)

现在,您的按钮图层的大小与草图不同 在layoutSubviews之后,将圆角半径设置为图层高度的一半。

override func layoutSubviews() {
  super.layoutSubviews()
  layer.cornerRadius = layer.bounds.height / 2.0
}

答案 3 :(得分:0)

如果要多次使用,不是在每个控制器中编写代码,而是可以使用下面的代码进行扩展以制作圆形按钮,视图。您可以在其中传递cornerRadius,borderWidth和UIColor。

import UIKit

extension UIView
{
    func makeCircular(cornerRadius: CGFloat, borderWidth: CGFloat, borderColor: UIColor)
    {
        self.layer.cornerRadius = cornerRadius * self.bounds.size.width
        self.layer.borderColor = borderColor.CGColor as CGColorRef
        self.layer.borderWidth = borderWidth
        self.clipsToBounds = true
    }
}

您可以根据需要简单地传递值。

用法:

    snapButton.makeCircular(0.5, borderWidth: 1.0, borderColor: UIColor.clearColor())