XibファイルからカスタムのViewを作成する

XibファイルからカスタムのViewを作成する使い回しできるカスタムのビューがあると何かと便利ですよね。枠だけ合って、UIImageをセットすれば枠付のイメージが出来たりとか、別にコードで書いてもいいんですが、いろんなところで使う場合はカスタムのクラス作っちゃいますよね。で、更に、そのカスタムのビューもコードで書くとちょっとした変更が面倒くさい。そこで、Xibファイルからカスタムのビューが作れないかと考えました。

巷には色々なやり方があるんですが、先日ふと思いついて自分なりに考えてみたところ、さくっと行きましたので共有します。

Xibファイルからカスタムのビューを作る方法

(カスタムのビューをCustomViewというUIViewのサブクラスで作成した例です)

1. UIViewを継承したCustomView.hとCustomView.mを作成する。
2. 空のCustomView.xibファイルを作成する。
3. CustomView.xibファイルにUIViewの部品を置き、クラスをUIViewからCustomViewに変更する。図1参照
4. その他、置きたいビューの要素があれば置いて、クラスのファイルと関連付けをする（ピーと紐を伸ばして結びつけるやつ）。
5. CustomView.mファイルのinitWithFrame:メソッドをオーバーライドして、コード1を参考に書き込む。
6. DONE!

図1

<コード1>

- (id)initWithFrame:(CGRect)frame
{
    self = [super initWithFrame:frame];
    if (self) {
        
        // make self from nib file
        UINib *nib = [UINib nibWithNibName:@"CustomView" bundle:nil];
        self = [nib instantiateWithOwner:nil options:nil][0];
    }
    return self;
}

こんな感じです。UINibでxibファイル自体を持ってきて、0番目の要素(一番最初に置いたUIView)を取得して自分自身にセットしてるという感じかなと思います。selfはinitメソッドの中なら代入ができるのです。

楽ちんですよ！！！

Github

Githubにコードを置いておきました。

• morizotter/CustomViewFromNib