Swift @IBDesignableでカスタムViewの表示をStoryboard上で確認する方法

Cocoa勉強会関西で教えてもらった「@IBDesignable」について掲載されていたブログがあったので試したみた。参考にしたブログが良かったが初心者にはUIViewのクラスを作成する部分が少しどうかと思いましたので作成手順について補足しておきます。中身は参考にしたブログを参照願います。

このブログ参考になりました。


参考にしたブログ

【iOS Swift入門 #190】@IBDesignableでカスタムViewの表示をStoryboard上で確認する

コード作成 → 表示確認となり、デバッグ実行を省くことが出来楽ですね。

Classファイルの追加をします。プロジェクト名「SampleView」を右クリックして「New File...」を選択します。

追加の「Class:SampleView」として「Subclass of :UIVew」を指定します。
この「UIVew」がポイントです。

Subclass がUIVewにしておくことが肝心です。

後は、参考にしたブログの通り

【iOS Swift入門 #190】@IBDesignableでカスタムViewの表示をStoryboard上で確認する

StoryboardでViewを配置する
配置したViewのClassを変更する

ViewController.swift

ViewController.swiftには何も記述はしません。defaultのままです。

import UIKit


@IBDesignable


class ViewController: UIViewController {


    override func viewDidLoad() {

        super.viewDidLoad()

        // Do any additional setup after loading the view, typically from a nib.

    }


    override func didReceiveMemoryWarning() {

        super.didReceiveMemoryWarning()

        // Dispose of any resources that can be recreated.

    }


}

SampleView.swift

import UIKit


@IBDesignable  // クラス名の前に追記


class SampleView: UIView {


    /*

    // Only override drawRect: if you perform custom drawing.

    // An empty implementation adversely affects performance during animation.

    override func drawRect(rect: CGRect) {

        // Drawing code

    }

    */

    

    let label = UILabel()

    

    // ラベルの位置・サイズのセット

    override func layoutSubviews() {

        label.frame = bounds

    }

    

    // ラベルの設定&Viewに追加

    override func didMoveToWindow() {

        super.didMoveToWindow()

        

        label.textColor = UIColor.redColor()

        label.text = "テキスト"

        addSubview(label)

    }

}

GitHub SampleView

  

目 次