Custom view (xib) not visible on storyboard

Question

I have a custom view xib where I have multiple TableViews. I am loading this inside a ViewController as a nested view:

ViewController
   |_ View
       |_ View (This is where I load my Custom View)

When I run my app, I can see the empty tables on screen, so my xib is loading correctly.
So far so good.

My problem is, I am unable to see my tables in the storyboard. So I am not able to ctrl+drag and proceed further.

How can I see my custom view inside the storyboard view?

Answer 1

For example, we have TopView (my CustomView):

1. TopView.xib, set TopView class in File's Owner

   

2. TopView.swift

Note: Don't forget the @IBDesignable tag.

import UIKit
@IBDesignable
class TopView: UIView {

    //MARK:- IB Outlets
    var contentView:UIView?

    //MARK:- Lifecycle
    override func awakeFromNib() {
        super.awakeFromNib()
    }

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

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

    override func prepareForInterfaceBuilder() {
        super.prepareForInterfaceBuilder()
        setupThisView()
        contentView?.prepareForInterfaceBuilder()
    }

    //MARK:- Lifecycle methods
    private func setupThisView(){
        guard let view = loadViewFromNib() else { return }
        view.frame = bounds
        view.autoresizingMask = [.flexibleWidth, .flexibleHeight]
        addSubview(view)
        contentView = view
    }

    func loadViewFromNib() -> UIView? {
        let nibName = String(describing: TopView.self)
        let bundle = Bundle(for: type(of: self))
        let nib = UINib(nibName: nibName, bundle: bundle)
        return nib.instantiate(withOwner: self,options: nil).first as? UIView
    }
}

3.Add UIView in Storyboard and set the class of the view as TopView

If the TopView has not yet appeared in Storyboard then (this happens usually):

1. Enable Editor -> Automatically Refresh Views
2. Click on Editor -> Refresh All Views

Still?

1. Clean the project: ⌘ + K
2. Build the project ⌘ + B

Result in Storyboard: