圆角改变 UIView 大小答案

【问题标题】：Rounded corners changes UIView size圆角改变 UIView 大小
【发布时间】：2017-02-27 16:03:55
【问题描述】：

在自定义 tableView 单元格中，我想创建顶部带有圆角的 UIView。这是我设置 UIView 约束的代码部分

headerView.leadingAnchor.constraint(equalTo: self.leadingAnchor, constant: 8).isActive = true
headerView.topAnchor.constraint(equalTo: self.topAnchor, constant: 4).isActive = true
headerView.trailingAnchor.constraint(equalTo: self.trailingAnchor, constant: -8).isActive = true
headerView.heightAnchor.constraint(equalToConstant: 40).isActive = true

下面这部分设置圆角视图我做了以下：

self.layoutIfNeeded()
let rectShape = CAShapeLayer()
rectShape.bounds = headerView.layer.frame
rectShape.position = headerView.center
rectShape.path = UIBezierPath(roundedRect: headerView.layer.bounds, byRoundingCorners: [ .topLeft, .topRight], cornerRadii: CGSize(width: 10, height: 10)).cgPath
headerView.layer.backgroundColor = UIColor.green.cgColor
headerView.layer.mask = rectShape

问题是当这段代码用于设置圆角时，视图的大小会发生变化。这是输出

没有这部分代码的结果如下：

我的问题是为什么视图大小会发生变化？我做错了什么？

【问题讨论】：

我不确定，但我认为这可能是因为您正在更改视图的layer，从而影响自动布局约束。如果您只想绕过视图的角落，则无需使用CAShapeLayer
我只想在顶部有圆角，所以这就是我使用 CAShapeLayer 的原因

标签： ios swift uiview autolayout constraints

【解决方案1】：

这是因为一旦 Header View 的约束被调整大小，您的 CAShapeLayer 就不会自动调整大小。每当调整视图大小时，您都需要更新路径：

  let headerView: UIView!

  override func awakeFromNib() {
    super.awakeFromNib()

    headerView = UIView(frame: bounds)
    headerView.frame = bounds

    headerView.leadingAnchor.constraint(equalTo: self.leadingAnchor, constant: 8).isActive = true
    headerView.topAnchor.constraint(equalTo: self.topAnchor, constant: 4).isActive = true
    headerView.trailingAnchor.constraint(equalTo: self.trailingAnchor, constant: -8).isActive = true
    headerView.heightAnchor.constraint(equalToConstant: 40).isActive = true


    let rectShape = CAShapeLayer()
    rectShape.bounds = headerView.layer.frame
    rectShape.position = headerView.center

    headerView.layer.backgroundColor = UIColor.green.cgColor
    headerView.layer.mask = rectShape
  }

  override func layoutSubviews() {
    super.layoutSubviews()

    rectShape.path = UIBezierPath(roundedRect: headerView.layer.bounds, byRoundingCorners: [ .topLeft, .topRight], cornerRadii: CGSize(width: 10, height: 10)).cgPath
  }

我以 awakeFromNib 为例。您的视图设置在您的自定义 UITableViewCell 类中可能有所不同。

【讨论】：

谢谢！这是正确的答案。只是我想补充一点，rectShape 的声明必须在 awakeFromNib 之外，否则会在 layoutSubviews 方法中出错

【解决方案2】：

很可能，在视图调整大小以适应表格之前，您正在获取 headerView 边界。

如果这是在子类 UIView 中，你应该可能

override func layoutSubviews() {
    // update path and mask here
}

【讨论】：