SwiftUIをやってみようっと
今までの開発ではまだSwiftUIを使っていなかったので、今回からはSwiftUIを使ってみたいと思います。
環境について
いままでの記事ではどのバージョンを使っていたのか等書いていなかったし、時間が空いて色々変わってしまっていました。なるべく使用環境を記載していくようにします。
記述時の環境
- PC: MacBook Pro (16-inch, 2019)
- CPU: Intel Core i7 2.6GHz
- MEM: 16GB DDR4
- OS: 12.6
- Xcode: 14.0.1
SwiftUIって…？
SwiftUIはXcode11から登場したコードベースで画面を作成出来る機能です。つまり、コーディングするようにSwiftで画面のレイアウトを記述してしまおうというフレームワークです。
SwiftUI以前はStoryboardというGUIのUIエディタを使って画面を作成していました。
このStoryboardがなかなか厄介でして、Storyboard上で作成した画面と画面制御用のコードとを紐付けたり等なかなか面倒でした(control押しながらコード側のエディタに向かってドラッグ&ドロップするとか正気かしら)
SwiftUIの使い方
Xcode11以上であれば、プロジェクト新規作成時にSwiftUIかStoryboardかを選択することが出来ます。
図1. UIインターフェースの指定
InterfaceをSwiftUIにすることでSwiftUIでの開発が可能になります。
早速やってみました
手始めにカードビューをSwiftUIとStoryboardで作ってみました。
図2. SwiftUIで書いたカードビュー
図3. Storyboardで作成したカードビュー
SwiftUIを使ってみて
SwiftUIとStoryboardとの大きな違いとして感じたのはビューの配置方法ですね。
親Viewを基準にViewの設定していくStoryboardに対して、配置したViewに対して設定を追加していく感じです。
Storyboardでは親ビューを基準として子ビューの位置を決める形になります。この際に設定する位置やサイズの指定(制約:Constraints)の設定がかなり面倒で、StackViewの設定には苦労させられますし、ガッチリ固めた構造に新たにパーツを追加したりするのはかなり面倒です。
それに対してSwiftUIはStackに配置したビューに対してサイズ、パディング、カラーといった要素を追加していく形です。親Viewの影響を受けずにレイアウトを作れたのでSwiftUIの方が直感的にViewを作ることが出来ました。
また、paddingやcornerRadius(Viewの角丸設定)をカスタムView無しに設定出来るのは大きいですね。
SwiftUIを使ってみるまではコードでビューを書くのって設定が面倒そうだなと思っていましたが、欲しい設定をチェーンで記述していくだけ（順番は考える必要がありますが）だし、何より修正が楽なので作業効率はSwiftUIの方が高いですね。