将 50 的 layer.cornerRadius 应用于按钮时出现奇怪的结果答案

【问题标题】：Strange result when applying a layer.cornerRadius of 50 to a button将 50 的 layer.cornerRadius 应用于按钮时出现奇怪的结果
【发布时间】：2016-06-24 05:47:43
【问题描述】：

我的目标是创建一个带有完全圆角的按钮（每边半圆）。它应该看起来像这样：

在用户定义的运行时属性中，我将 layer.cornerRadius 设置为 KeyPath，将 50 设置为 Value（也尝试了 49）。此外，我已将“剪辑子视图”选项设置为是（如在此答案中：UIlabel layer.cornerRadius not working in iOS 7.1）但是，编译结果在我的 iPhone 5c (iOS 9.2.1) 上看起来像这样：

（图片是用 Photoshop 制作的，但看起来就是这样）

角是圆形的，但显然缺少一个锚点。有关如何获得所需结果的任何建议？

【问题讨论】：

确保您的按钮类型为.Custom，并且高度正好为cornerRadius * 2。您可能希望按钮具有高度限制。如果cornerRadius 是50，那么你的按钮应该有高度100。
@Sulthan 非常感谢，这解决了问题——我想我已经习惯了用 css 做这些事情的方式。有没有办法使用百分比而不是固定数字？如果我的身高发生变化，我希望采用更动态的方法。
有多种方法可以做到这一点。您可以将 cornerRadius 设置移动到代码中，但您必须注意布局更改并在必要时更新值。您还可以创建一个自定义的UIButton 子类来执行此操作（并更改layoutSubviews 中的cornerRadius 值）。在大多数情况下，您不希望按钮高度发生变化，因此在 storyboard/xib 中显式设置它是没有问题的。

标签： swift cocoa-touch uibutton storyboard

【解决方案1】：

cornerRadius 值不会根据按钮高度自动更新，因此，当从 storyboard/xib 指定它时，您必须确保该值正好是按钮高度的一半。

通常通过将按钮高度设置为常数（使用高度约束）并将cornerRadius 设置为该常数的一半（例如，对于高度100，您希望cornerRadius 具有值50）来实现。

如果您想要自动更新解决方案，最简单的解决方案是继承 UIButton 并覆盖 layoutSubviews：

override func layoutSubviews() {
   super.layoutSubviews()

   self.layer.cornerRadius = self.frame.size.height / 2.0
}

然后在 xib/storyboard 中，您可以将按钮的类更改为您的自定义类。

【讨论】：

【解决方案2】：

如果您想采用动态方法而不是使用固定值，请尝试此方法。

  let button = UIButton()
  button.layer.cornerRadius = button.frame.size.height/2-1

【讨论】：

【解决方案3】：

对我来说，下面的工作比其他任何事情都好为圆形按钮和 UIButton 子类创建一个类。

class RoundedButton: UIButton {

 //add your title color and background color outside the below override method
 
 override func draw(_ rect: CGRect) {
    layer.cornerRadius = frame.height / 2.0
    clipsToBounds = true
 }   
}

【讨论】：