在视图控制器视图中渲染/显示可重用视图

Question

是否可以设计可重用的视图作为UIView的子类，然后将UIView的实例拖到故事板中视图控制器的视图上，将其类型更改为可重用视图，然后查看它？

编辑：

这是我的BaseView：

这是我使用它的视图控制器视图：

我必须在BaseView中执行此操作：

func customInit() {
    view = loadViewFromNib()
    view.frame = bounds
    view.autoresizingMask = [.FlexibleWidth, .FlexibleHeight]
    insertSubview(view, atIndex: 0)
}

因为使用addSubview它会显示在所有内容上，所以它似乎是最后添加的。但我不知道为什么。

Answer 1

第一个概念

这是一个很好的例子，用于创建没有 xib文件的独立可设计视图。

我不能让你太具体了，因为你只问了一个随机样本，看起来非常像这样。

RandomView.swift

import UIKit;

//

@IBDesignable

@objc class RandomView: UIView {

    @IBInspectable var borderRadius: CGFloat = 0
    @IBInspectable var borderWidth: CGFloat = 0
    @IBInspectable var borderColour: UIColor? = nil

    override func didMoveToSuperview() {
        super.didMoveToSuperview()

        if self.superview != nil {
            // build up layout
            self.borderColour = UIColor.redColor()
        } else {
            // /dismiss it
            self.borderColour = nil
        }
    }

    override func drawRect(rect: CGRect) {
        super.drawRect(rect)
        // draw the layout

        self.layer.borderWidth = self.borderWidth
        self.layer.cornerRadius = self.borderRadius

        if let color: UIColor = borderColour {
            self.layer.borderColor = color.CGColor
        } else {
            self.layer.borderColor = nil
        }
    }

}

然后

您可以将新UIView添加到主视图中，对于该特定类，您可以将自定义类明确设置为IB：

IB更新属性面板，现在您可以更改要放入视图的每个实例的边框宽度/半径/颜色，并且更改会立即生效：

第二个概念

这个概念也需要创建xib文件，所以实际上我们将有两个文件，而xib中你可以像往常一样构建自定义界面。

RandomView.xib

这就是它的外观，将文件的所有者设置为RandomView可能很重要，但其他一切只是常规业务，我添加了只有一个UILabel到自定义视图的中间。

RandomView.swift

import UIKit;

//

@IBDesignable

@objc class RandomView: UIView {

    @IBInspectable var title: NSString? {
        set (newValue) {
            if self.customLabel != nil {
                self.customLabel!.text = newValue as? String
            }
        }
        get {
            if self.customLabel != nil {
                return self.customLabel!.text
            } else {
                return nil
            }
        }
    }
    @IBOutlet var customLabel: UILabel? = nil

    var view: UIView!

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

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

    func customInit() {
        view = loadViewFromNib()
        view.frame = bounds
        view.autoresizingMask = [UIViewAutoresizing.FlexibleWidth, UIViewAutoresizing.FlexibleHeight] // quick soliution
        addSubview(view)
    }

    func loadViewFromNib() -> UIView {
        let bundle = NSBundle(forClass: self.dynamicType)
        let nib = UINib(nibName: "RandomView", bundle: bundle) // get xib name correctly!
        let view = nib.instantiateWithOwner(self, options: nil)[0] as! UIView
        return view
    }

}

现在您可以将此新视图放入任何其他界面，例如：

我的视图看起来像这样，在视图中间有一个UILabel（使用xib中的自动布局和约束），所以实际上创建了一个有点＆＃34; IB中可设计视图的预览＆＃34; ：

注意：显然，您不需要制作可检查的属性，您可以对所有内容进行硬编码，甚至可以添加额外的子视图或您实际需要的任何接口，但基本概念就是这么简单。