可重复使用的.xib + cocoa class 组件,如何在故事板中自动调整超级视图的大小和样式?

Reusable .xib + cocoa class components, how to auto size and style superview in storyboard?

我在 this guide

之后使用 .xib 和 cocoa class 的组合实现了可重复使用的按钮组件

可以,但是有问题。为了在我的一个主视图情节提要中使用它,我必须首先在普通视图中拖动(在问题标题中称为超级视图),然后应用我的 Button class,使其成为一个按钮。

这是有效的,但是初始视图的高度和宽度以及它的白色背景仍然存在,所以我在使用我的组件时必须总是手动重写它们,这本身导致可重用性很差。

理想情况下,我想拖入一个视图,将其设置为 Button class 就是这样,该视图应立即采用按钮的高度和宽度并具有 transparent 背景。这样的事情可以实现吗?

为了阐明这个问题的更多背景,这里有一些我的实现的有用部分

1.作为 .xib 视图制作的可重用组件及其自身 cocoa class

2。 Button.swift

的内容
import UIKit

@IBDesignable class Button: UIView {

    @IBOutlet var contentView: UIView!
    @IBOutlet weak var label: UILabel!

  @IBInspectable var buttonLabel: String? {
    get {
      return label.text
    }
    set(buttonLabel) {
      label.text = buttonLabel
    }
  }

  override init(frame: CGRect) {
    super.init(frame: frame)
    componentInit()
  }

  required init?(coder: NSCoder) {
    super.init(coder: coder)
    componentInit()
  }

  private func componentInit() {
    let bundle = Bundle(for: Button.self)
    bundle.loadNibNamed("Button", owner: self, options: nil)
    addSubview(contentView)
    contentView.frame = self.bounds
    contentView.autoresizingMask = [.flexibleHeight, .flexibleWidth]
  }

}

3。示例用法(在我的一个主视图故事板中)展示了如何将普通视图变成按钮,但在高度、宽度和背景颜色方面存在问题

P.S ^ 如果很难说出上面的 gif 中发生了什么,我基本上将 UIView 拖到故事板中并为其赋予 [=] 的自定义 class 属性13=],这会将视图变成一个按钮。

编辑:为了更清楚,我的问题是:我可以将宽度、高度和反式parent颜色应用到我的 XIB 的 parent /超级视野?这里的最终目标是将视图拖到故事板上,给它自定义 Button 的 class 就是这样,它应该适当调整大小并具有 transparent 背景,而不是目前情况如何(视图未按按钮调整大小且背景为白色)

您必须将您的子视图正确固定在 Button 以及 Main.storyboard 中。然后您的自定义视图将自动调整大小。清晰的颜色正在起作用。

import UIKit

@IBDesignable
class Button: UIView {

    @IBOutlet var contentView: UIView!
    @IBOutlet weak var label: UILabel!

    @IBInspectable
    var backColor: UIColor = .clear {
        didSet {
            backgroundColor = backColor
            contentView.backgroundColor = backColor
        }
    }

    override var backgroundColor: UIColor? {
        get {
            return backgroundColor
        } set {

        }
    }

    @IBInspectable
    var buttonLabel: String? {
        get {
            return label.text
        }
        set(buttonLabel) {
            label.text = buttonLabel
        }
    }

    override init(frame: CGRect) {
        super.init(frame: frame)
        componentInit()
    }

    required init?(coder: NSCoder) {
        super.init(coder: coder)
        componentInit()
    }

    private func componentInit() {
        let bundle = Bundle(for: Button.self)
        bundle.loadNibNamed("Button", owner: self, options: nil)
        addSubview(contentView)
        contentView.frame = bounds
        backgroundColor = backColor
        contentView.backgroundColor = backColor
        contentView.autoresizingMask = [.flexibleHeight, .flexibleWidth]
        // for static height
        contentView.heightAnchor.constraint(equalToConstant: 70).isActive = true
    }

}


为确保您的 CustomView 能够正确调整自身大小,您可以使用底部约束 >= 0。测试后重置为等于。