【Swift】@IBInspectableと@IBDesignable

はじめに

今回はIBDesignableとIBInspectableについて解説してみたいと思います！

IBInspectable

これを使うとストーリーボードのInterfaceBuilderで設定できるようになります。
前回のプロジェクトを使って解説します。

このように、placeHolderに対して@IBInspectableを使います。

    @IBInspectable
    var placeHolder: String = "" {
        willSet {
            self.placeHolderLabel.text = newValue
            self.placeHolderLabel.sizeToFit()
        }
    }

すると、ストーリーボードのInterfaceBuilderで変更可能になります。

ただし、コードでplaceHolderを指定した場合はそちらが優先されます。

final class ViewController: UIViewController {

    @IBOutlet private weak var textView: PlaceTextView!

    override func viewDidLoad() {
        super.viewDidLoad()

        textView.placeHolder = "カキクケコ"

    }

}

IBDesignable

IBInspectableを指定し、リアルタイムで見た目の変更をストーリーボードで見れるようにしてくれます。
つまり、ビルドしなくても確認できるようにするためのものです。

ストーリーボードで適当にUIViewを配置してください。

そして、ViewControllerで以下のように書いてみます。

final class DesignableView: UIView {

    @IBInspectable
    var cornerRadius: CGFloat {
        get {
            return layer.cornerRadius
        }
        set {
            layer.cornerRadius = newValue
        }
    }

}

先ほど配置したViewにこのDesignableViewを継承させます。

先ほどの@IBInspectableのおかげでストーリーボードから変更できるようになっているので、適当に値を変えます。

ただし、この時点では@IBDesignableをまだ使っていないのでリアルタイムでは変更されません。

@IBDesignableをつけてあげます。

@IBDesignable
final class DesignableView: UIView {

    @IBInspectable
    var cornerRadius: CGFloat {
        get {
            return layer.cornerRadius
        }
        set {
            layer.cornerRadius = newValue
        }
    }

}

すると、このようにリアルタイムで変更が見られるようになると思います！

おわりに

@IBInspectableと@IBDesignableは便利ですね！積極的に使っていきたいです！