#author("2016-11-14T14:51:42+09:00","default:wikiwriter","wikiwriter")
#author("2016-12-08T23:04:56+09:00","default:wikiwriter","wikiwriter")
[[UIKit]]

&tag(UIKit/カスタムビュー);
*目次 [#qe5834f7]
#contents
*関連ページ [#b7aeec5b]
*参考情報 [#j1cf476a]
-Creating a Custom View That Renders in Interface Builderという公式ドキュメントが存在するはずだがリンク切れ?
-[[IBDesignable できるカスタムビューを xib で定義するときには NSBundle に注意する - Qiita:http://qiita.com/usagimaru/items/e1c349c5bc51a1c4a92c]]
-[[カスタムViewをNibから初期化し、IBDesignableとIBInspectableで便利に使う - Think Big Act Local:http://himaratsu.hatenablog.com/entry/ios/customview]]
-[[Auto LayoutでCustom Viewを作る その1 | Cyber Passion for iOS:http://blogios.stack3.net/archives/1944]]


*基本手順 [#xf194da6]
**Xibの作成 [#o3da204e]
-SizeをFeedomに、Status BarをNoneに設定する。コンポーネントを配置。
-File > New > iOS > User Interface > Viewでxibを追加。UIViewのサブクラスを作成するとxibは自動的に作成してくれないので手動でxibを作成する。
-xibを開いてAttributes InspectorでSizeをFeedomにStatus BarをNoneに設定する。
-Viewの上に好みのコンポーネントを配置。

**クラスの作成 [#f9bd9bd4]
-以下のように作成。
#pre{{

@IBDesignable class CustomView: UIView {
    override init(frame: CGRect) {
        super.init(frame: frame)
        loadFromNib()
    }
    
    required init?(coder aDecoder: NSCoder) {
        super.init(coder: aDecoder)
        loadFromNib()
    }
    
    private func loadFromNib() {
        // ここは UINib を使っても良い
//        let v = NSBundle(forClass: self.dynami).loadNibNamed("CustomView", owner: self, options: nil).first as! UIView
        let v = UINib(nibName: "CustomView", bundle: Bundle(for: CustomView.self)).instantiate(withOwner: self, options: nil)[0] as! UIView
        v.frame = self.bounds
        addSubview(v)
    }
    
    // ここでStoryboard上の見た目を初期化する
    override func prepareForInterfaceBuilder() { // <= (4)
        loadFromNib()
    }
}

}}
**関連づけ [#qa54428b]
-xibのFile's OwnerをCustom Viewとする。ViewのほうをCustom Viewとしてはならない。
--そうするとOutletが接続できなくなったりいろいろな不都合が発生する。
--CustomViewのsubviewとしてxibをロードしていることに注目。ViewのほうをCustom Viewとすると無限ループ的な動きになる。
--NSBundleおよび、UINibの呼び出しでownerをselfにすることを忘れてはならない。

*トラブルシューティング [#v20a8320]

**Interface Builderで表示できない。 [#w50ef90c]
-クラスの定義に「@IBDesignable」がついているかどうか確認する。

**Interface Builderに設定するとエラーが起こる [#z8b79de8]
-xibファイルをロードしているところにownerを確認する。Interface BuilderでFile's OwnerをCustom Viewとした場合、ロード時にself(CustomView)を指定する。
        let v = UINib(nibName: "CustomView", bundle: Bundle(for: CustomView.self)).instantiate(withOwner: self, options: nil)[0] as! UIView

**outletを接続するとエラー [#g729c421]
-これもやっぱり、オーナーまわりの設定がおかしい可能性あり。


**ライブラリプロジェクトのビューが読み込めない [#e4d88ae6]
-ライブラリ内のxibはNSBundle.mainBundleでは読み込めない。クラス名を指定して読み込む。


トップ   新規 一覧 検索 最終更新   ヘルプ   最終更新のRSS