How can i see with @designable this design on storyboard

Question

I'm using masking.

My Code:

class ViewController: UIViewController {

    @IBOutlet weak var firstImageView: UIImageView!
    @IBOutlet weak var seconImageView: UIImageView!


    let maskView = UIImageView()
    let maskView2 = UIImageView()

    override func viewDidLoad() {
        super.viewDidLoad()

        maskView.image = UIImage(named: "Up")
        maskView2.image = UIImage(named: "Down")
        firstImageView.mask = maskView
        seconImageView.mask = maskView2
    }

    override func viewDidLayoutSubviews() {
        super.viewDidLayoutSubviews()

        maskView.frame = firstImageView.bounds
        maskView2.frame = seconImageView.bounds
    }
}

UIImageView Code:

UIImageView class. I can't see this design. How can I do ? I added custom class but didn't work

@IBDesignable
class FirstImageView: UIImageView {

    var maskkView: UIImageView!

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

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

    override func layoutSubviews() {
        super.layoutSubviews()

        maskkView.image = UIImage(named: "mask")
        mask = maskkView
        maskkView.frame = bounds
    }

}

Storyboard:

Simulator:

How can i see with @designable this design on storyboard.

Answer 1

I added custom class but didn't work

I assure you that masking in layoutSubviews of an IBDesignable UIImageView does work. Example:

@IBDesignable
class MyImageView : UIImageView {
    override func layoutSubviews() {
        super.layoutSubviews()
        let lay = CAShapeLayer()
        lay.frame = self.bounds
        lay.path = UIBezierPath(ovalIn: self.bounds).cgPath
        self.layer.mask = lay
    }
}

Result:

I suspect that the problem with your code is that you are attempting to load an image from the bundle with UIImage(named:) in your IBDesignable code; my guess is that that isn't going to work. IBDesignable code is just some stuff that runs at storyboard rendering time; it cannot behave as if it were truly the running app.