カスタムViewをxibではなく、storyboardでデザインする

特定のViewControllerで使うカスタムViewを、今まではxibファイルで作っていたんですが、storyboardでも作れることが判明したのでシェアします。

###プロジェクトを用意
<img width="733" alt="スクリーンショット 2016-11-02 13.05.12.png" src="https://qiita-image-store.s3.amazonaws.com/0/45467/72b87c5b-c706-e625-5c3b-d3ecc700ac02.png">

###storyboardでUIViewをこの位置にドラッグすると、、、
<img width="671" alt="スクリーンショット_2016-11-02_13_12_50.png" src="https://qiita-image-store.s3.amazonaws.com/0/45467/30afd954-2eac-f90a-88f0-77125047d2dc.png">

こんなマークが出て、、
![IMG_5706.JPG](https://qiita-image-store.s3.amazonaws.com/0/45467/05f665c5-09d5-5358-9c08-e87d9966b114.jpeg)

こうなります
<img width="603" alt="スクリーンショット_2016-11-02_13_21_14.png" src="https://qiita-image-store.s3.amazonaws.com/0/45467/500d7c86-3f38-f715-23a3-726618a54932.png">
すでにインスタンスはありますが、ViewControllerには載っていません。addSubviewするだけで使える状態です。

<img width="684" alt="スクリーンショット_2016-11-02_13_24_53.png" src="https://qiita-image-store.s3.amazonaws.com/0/45467/6164b10f-41b7-ca34-a6ab-216410847ce3.png">

適当にデコります
<img width="349" alt="スクリーンショット 2016-11-02 13.34.46.png" src="https://qiita-image-store.s3.amazonaws.com/0/45467/273be0cc-9fdb-375f-04cb-5aee95533bc8.png">

###カスタムViewのswiftファイルを作ります
<img width="731" alt="スクリーンショット 2016-11-02 13.36.24.png" src="https://qiita-image-store.s3.amazonaws.com/0/45467/a4c813f7-653b-c11d-7820-e795c1654df6.png">

<img width="691" alt="スクリーンショット 2016-11-02 13.37.51.png" src="https://qiita-image-store.s3.amazonaws.com/0/45467/05f11331-4fcd-ab35-abaf-43257e94e843.png">

###storyboardのカスタムviewとswiftファイルを紐付けします
まずはstoryboardのカスタムViewを選択して、クラスを指定します
<img width="702" alt="スクリーンショット_2016-11-02_13_40_48.png" src="https://qiita-image-store.s3.amazonaws.com/0/45467/552e3482-d6ef-a824-ec6c-f0f22c84ceb3.png">

ViewControllerアイコンからCustomViewアイコンへ、Ctrlを押しながらドラッグします
<img width="573" alt="スクリーンショット_2016-11-02_13_39_28.png" src="https://qiita-image-store.s3.amazonaws.com/0/45467/facb2f8f-2012-cc17-f489-551a7a96e695.png">

こんな風になる
![IMG_5707.JPG](https://qiita-image-store.s3.amazonaws.com/0/45467/604211d4-31db-5cd7-ddea-5e5aaface294.jpeg)

###そしてビルドしてみると、、swiftファイルのinitが呼ばれるようになりました！
<img width="495" alt="スクリーンショット 2016-11-02 13.48.41.png" src="https://qiita-image-store.s3.amazonaws.com/0/45467/4a55c552-cf68-c6d5-26b0-89a718a5d6c0.png">

###ViewControllerにaddSubviewする前に、storyboardのCustomViewをViewController.swiftと紐付けます
![IMG_5708.JPG](https://qiita-image-store.s3.amazonaws.com/0/45467/9b1f319f-f034-671c-021f-d663806aeb05.jpeg)
ctrl押しながら、CustomView.swiftファイルのViewDidLoad()の上までドラッグ

![IMG_5709.JPG](https://qiita-image-store.s3.amazonaws.com/0/45467/29e0242e-15e5-6974-28e3-7da5724c5795.jpeg)
Nameを入力してconnectを押せば、、

<img width="640" alt="スクリーンショット_2016-11-02_14_01_45.png" src="https://qiita-image-store.s3.amazonaws.com/0/45467/dc6adc01-ebae-745b-614f-8d5be6be3037.png">

###さっそくaddSubviewしたら、載りました！
<img width="760" alt="スクリーンショット_2016-11-02_14_04_50.png" src="https://qiita-image-store.s3.amazonaws.com/0/45467/c86ad3c8-64e2-6919-5546-9a6d862007a3.png">

###最後にCustomView.swiftをいじってみましょう
ラベルを載せてみます
<img width="733" alt="スクリーンショット 2016-11-02 14.09.21.png" src="https://qiita-image-store.s3.amazonaws.com/0/45467/4943bf5c-fd29-21c2-4967-4a7ea9e35754.png">
これでコードでもいじれますね。

###ありがとうございました