SnapKitについてオープンソース勉強会

山下大輔

• 自己紹介　https://github.com/daisuke0131

• ビズリーチのiOSエンジニア

• https://github.com/daisuke0131/ViewMonitor を作っています。星ください。PR下さい。

use_frameworks!

pod 'Bond' pod 'SwiftTask' pod 'Alamofire' pod 'SwiftyJSON' pod 'SwiftCop' pod 'Async'

pod 'SDWebImage'

ライブラリ的には

What’s ViewMonitor

• Masonry(objective-C)のswift版ライブラリ

• 独自記述で簡単に書けそう->autoLayoutはコードから書こうと思うとかなり辛い

• シンプルに書けそうなのでちょっとしたときに制約を追加したりに便利そう

SnapKitについて

https://github.com/SnapKit/SnapKit

• iOS6から導入されたviewの配置を決める仕組み

• view同士の位置を制約を使って設定

• IB上からポチポチするのがデフォ。

• 画面サイズが変わったときに動的に配置が調整される

• viewの書き換え時に動的にviewの配置換えするのはつらい。-> iOS9から導入されたUIStackViewがこの辺の課題解決をしてくれそう。

Autolayoutについて

上右左のself.viewに対して 距離0を設定 高さ50を設定

autolayoutで書くとlet redView = UIView() redView.backgroundColor = UIColor.redColor() self.view.addSubview(redView) view.translatesAutoresizingMaskIntoConstraints = false redView.translatesAutoresizingMaskIntoConstraints = false

redView.addConstraint( NSLayoutConstraint(item: redView, attribute: .Height, relatedBy: .Equal,toItem: nil, attribute: .Height, multiplier: 1.0, constant: 50.0)

)

self.view.addConstraints([ NSLayoutConstraint(item: redView, attribute: .Top, relatedBy: .Equal, toItem: self.view, attribute: .Top, multiplier: 1.0, constant: 0.0), NSLayoutConstraint(item: redView, attribute: .Left, relatedBy: .Equal, toItem: self.view, attribute: .Left, multiplier: 1.0, constant: 0.0), NSLayoutConstraint(item: redView, attribute: .Right, relatedBy: .Equal, toItem: self.view, attribute: .Right, multiplier: 1.0, constant: 0.0), ])

SnapKitで書くと

let redView = UIView() redView.backgroundColor = UIColor.redColor() self.view.addSubview(redView)

redView.snp_makeConstraints { (make) -> Void in make.height.equalTo(50) make.top.equalTo(view).offset(0) make.left.equalTo(view).offset(0) make.right.equalTo(view).offset(0)

}

IBに配置したviewの制約をいじる

IBに配置して コードから autolayout設定

制約通りに配置

例えば以下の様なことがしたい

試すと

エラーめっちゃでる。。。

• IBにおいたviewにはいい感じに勝手にautolayoutが設定されるっぽい。

• IB上からuse autolayoutをoffにしてやるとうまくいく。

• 配置からコードでやる場合は問題ないです。

http://stackoverflow.com/questions/30534850/prevent-interface-builder-from-auto-creating-constraints

参考）

なんで？

UIStackViewを使うと便利になるよ

実行時に要素１ を消す

要素１ を詰めて表示

まとめ

• SnapKitはすごく書きやすい

• コードで完結させるときには使いやすい

• IBとかと中途半端に連携させるとつらいかも。（制約をOutletとかで接続するとかの方がよさそう）

• ちょっとしたところで使うのはおすすめできない。

• ちょっとしたところはUIStackViewが解決してくれるとおもうので期待。

Autolayout制約でのエラー

Autolayoutの制約エラー ->発生してもなんとなくいい感じに表示はされます。

ここでシンボリックブレイクポイントを仕込む

expr -l objc++ -O -- [[UIWindow keyWindow] _autolayoutTrace]

Autolayoutの制約矛盾が発生した段階でブレイク

Viewの階層表示

別プロジェクトへの反映方法

http://www.slideshare.net/daisukeyamashita180/21-potatotips-yamashita

バグのことは嫌いになってもXcodeのことは嫌いにならないでください。

http://qiita.com/daisuke0131/items/82e85e75e766cf08745f

Xcodeに関すること