さいごにSnapKitというライブラリを使ってみる高階さん(株)ライトコードの高階(たかがい)です!前回の記事では、NSLayoutConstraintとNSLayoutAnchorを使ってAutoLayoutを実装してみました。前回に引き続き以下の環境で作業しています。4.0SnapKitについてSnapKitの対応バージョンについてですが、使用可能な環境は以下です。3.0+Swift3.xであればSnapKit3.0.0、Swift4.xであればSnapKit4.0.0を使用してください。CocoapodsとCarthageの両方に対応しています。SnapKitの使い方についてですが、まずは見てもらった方が早いと思うので、100pt四方の赤いViewを画面中央に表示させてみました。上記の例の通り、makeConstraint()の引数に指定されているクロージャの中、make(ConstraintMaker)に制約を設定していきます。前回の記事ではAttributeの種類にまで触れていなかったんですが、leading/trailing、left/rightという似てるものがあるので軽く補足します。trailingとrightが示す位置はおそらく同じだと思います。)left/rightについては、左右を表しています。leadingは、先端(先頭)。trailingは、末尾というような意味になります。leftとなるAttributeに関して標準と違うポイントAttributeに関して標準と違うポイントは、widthとheightの値が同じ場合、sizeとしてまとめて設定できるところですかね。正方形や正円形であるものは簡単に記述できますし、リサイズも簡単なので地味に嬉しいポイントです。(centerXとcenterYも従来通りcenterとしてまとめることができます。)relatedrelatedに関しては、以下の種類がありますが、基本的には、equalTo()やequalToSuperView()を使うことが多いです。その他のメソッドは、Viewの制約を動的に変更させたい条件がいくつかある場合など、状況に合わせて使用します。ConstraintBasicAttributesDSLクラスに定義されたメソッドは以下の通りです。親Viewに関する値SnapKitの特徴Autoresizingの設定が不要NSLayoutConstraintやNSLayoutAnchorを用いた方法の場合では、addSubview前に、Autoresizingという旧式のレイアウトの仕組みをAutoLayoutに反映させないための設定変更を行う必要がありました。SnapKitではライブラリ側で対応してくれるため、以下の一文が不要となりました。falseメソッドチェーンAttributeを続けて指定して設定することができます。制約を設定したいViewのAttributeと基準となるAttributeが同じ場合は、省略可能です。以下の2行は同じ意味。以下の2行は同じ意味。make.top.equalTo(superView.snp.top)make.top.equalTo(superView)使えるメソッド設定する値を調整するための便利なメソッドも用意されてます。multipliedBy()引数で渡されたCGFloat型の値を掛け合わせる。2倍なら2、3倍なら3。標準(NSLayoutConstraintやNSLayoutAnchor)のmultiplier引数と同じ扱いです。dividedBy()引数で渡されたCGFloat型の値で割る。1/2なら2、1/3なら3。標準のmultiplier引数で0.5と指定していたところを、dividedBy(2)というように記述できるようになりました。offset()引数で渡された値の分だけ位置をずらす。負数をセットすると負の方向に移動する。配置を指定した後に続けて記述して使用できます。以下は上で表示させた赤い四角のViewの右隣に10pt間を開けて同じサイズの青い四角いViewを表示させた例です。右方向に10pt移動させる}inset()Viewの内側に余白を作る。CSSで言うところのPaddingのようなもの。equalTo()などで配置の制約を指定した後に続けて設定することができます。Attributeのedgesを指定して、マージンを表す構造体であるUIEdgeInsets()と組み合わせて指定すると、以下のように簡単に余白を表示させることができます。画面の上下左右に10ptの余白を設ける。画面の上下左右に10ptの余白を設ける。10))}さいごに前回の記事で最初に紹介したNSLayoutConstraintの方法と比べると見違える程ラクになりました!今までコードでAutoLayoutを実装することへの苦手意識のせいでなるべく避けてきたわけですが、SnapKitならInterfaceBuilderを使用しなくてもスイスイ書けちゃいそうです。高階さん重たいInterfaceBuilderファイルを開くときの待機時間やコンフリクト解消にかかる時間とは、これでおさらば!...とは言いつつInterfaceBuilderではビルドしなくてもレイアウトを確認できたり、制約が足りない場合や制約の重複・コンフリクトなどが起きている場合にエラーを出して教えてくれるなどのメリットもあります。社長と一杯飲みながらお話してみたい方はこちらミツオカフリーランスエンジニア様の募集はこちらにゃんこ師匠その他、お問い合わせはこちらミツオカお気軽にお問い合わせください!せっかくなので、別の記事もぜひ読んでいって下さいね!一緒に働いてくれる仲間を募集しております!ライトコードでは、仲間を募集しております!当社のモットーは「好きなことを仕事にするエンジニア集団」「エンジニアによるエンジニアのための会社」。エンジニアであるあなたの「やってみたいこと」を全力で応援する会社です。ライトコードは現在、急成長中!だからこそ、あなたにお任せしたいやりがいのあるお仕事は沢山あります。「コアメンバー」として活躍してくれる、あなたからのご応募をお待ちしております!なお、ご応募の前に、「話しだけ聞いてみたい」「社内の雰囲気を知りたい」という方はこちらをご覧ください。rightcodeエンジニア大募集中!私たちライトコードでは、エンジニアを募集しております。私服大歓迎のカジュアルな職場なので、お気軽にご応募ください!また、フリーエンジニアの方も募集しております。