文系iOSエンジニアの備忘録

エンジニア iOS Swift

UI実装ナレッジ〜AutoLayoutのPreview〜

どうもおはようございます、こんにちは、こんばんは。

 ## はじめに

UI実装ナレッジの共有です。

Preview機能とは

StoryboardやXibファイルを実装中の複数端末レイアウトを一度に確認できる機能です。 ビルドの必要はなく、すぐに反映されます。

機能的には割と昔から提供されていたようですが、

Xcode11になってからアシスタントエディタ(名前知らなかったけど右上のタブ)の仕様が変わったので導線が変わりました。

使ってみる

1.Storyboardファイルを選択肢右上の「三」をタップ。

f:id:chiltarou1224:20200726191916p:plain

2. 出てきたpreviewの左下の+ボタンを押下して確認したいデバイスを選択する。

f:id:chiltarou1224:20200726191921p:plain

3. 制約や文字内容を変更すると即時反映される。  あえてiPhone SEでボタンが見切れるようにしています。

f:id:chiltarou1224:20200726191929p:plain

最後に

可変的なデータを使用する場合では、やはり実際にシミュレータ や実機で動かしながら確認というのも必要ですが、

Preview を使った確認で大きなレイアウト崩れや、他端末を考慮した出戻りなどが幾分か減ると思います。

 

ブログの投稿は基本毎日19時頃する予定です。

コメントや反応もらえると嬉しいです!よろしくお願いいたします!