はじめに
Auto Layoutを勉強していてStack Viewの便利さを知ったので記事を書こうと思います。
また、Auto Layoutはエンジニア必須スキルで、ちゃんと理解できれば他のエンジニアと差をつけられる要素になるみたいです。
しっかり使いこなせるようになりたいですね。
Stack Viewとは何か
公式ドキュメントにはこのように書かれています。
Stack Viewは、複雑な制約を導入することなく、自動レイアウトの機能を活用する簡単な方法を提供します。
要するに、本来なら複雑な制約を書いて実装するけど、Stack Viewを使えば簡単に実装できるようになります！って感じです。
使ってみた
今回はボタンを並べて、後からボタンを追加する作業にStack Viewを使っていきます。
Stack ViewをViewに追加
HorizontalとVerticalがあります。
Horizontalは水平なので横並び、Verticalは垂直なので縦並びで設定したい時に使います。
今回はHorizontalを使います。
Stack Viewにボタンを上から載せて追加
3つのボタンを並べます。
配置を設定
topとcenterの制約を設定します。
右下にあるAdd New Constraintsでtopの制約を追加します。
次に、Stack Viewをコントロール押しながらドラックしてViewで離します。
すると画像のような選択肢が出てくるので、Center Horizontallyを選択肢します。
これで配置が完了しました。
それぞれのボタンのスペースを８に設定してみました。
ボタンを追加する
さて、ここでボタン追加の変更が入ったとします。Stack Viewでなければボタンを追加して、配置なども１からやり直しでしたが。
Stack Viewを使っているので、Stack Viewのなかにボタンをドロップするだけで配置することができます。
もちろん、さっき設定したスペースの８も自動で設定されますので、設定し直す必要がありません。
最後に
レイアウトを管理することができるのがStack Viewの役割です。
これはかなり便利な機能だなと思いました。
まだこのくらいしか使い方知りませんが、また便利な使い方があれば更新していきます。