案件でSwitUIを導入して

f:id:adglobe_n_ozawa:20211231171249p:plain

はじめに

株式会社アドグローブでアプリ開発エンジニアをしている小澤です。WWDC2019でSwiftUIが発表されてから2年、開発案件でSwiftUIを導入してみました。導入してみて良かったこと、まだまだ課題が残るところについて記載してみました。

案件について

SwiftUIを導入している案件は、実証実験用のアプリ開発案件で、以前のアプリの機能を一部流用しつつ新規アプリとして作成する案件です。サポートOSはiOS14からで良かったため、SwiftUIを開発のベースとして作成しました。また、以前のアプリは、Swiftで開発されており、その機能を流用するため、SwiftUiからUIKitを呼ぶ形で開発を進めました。 案件では、アーキテクチャをMVVMに選定して、以前のアプリで利用していたCocoaPodsのライブラリからSwfitPMで移植できるところはするなど開発技術のモダン化をしました。

案件で利用して良かったこと

良かった点を以下に挙げます。

  • SwiftUIは、コードをマージする際、StoryBoardやxibのコンフリクトの苦悩から解放される
    • Stroyboard、xibのコードは、読み慣れていない経験の浅いエンジニアにとっては可読性が低く、コンフリクトが発生した場合、解消に工数がかかる頭の痛い作業でありました。SwiftUIではStoryboardやXIBファイルといったものは使用しないため、このような苦悩から解放されます。
  • アニメーション表現がしやすい
    • UIKitでアニメーションをさせる場合は、アニメーションをさせるViewのプロパティを変更して、アニメーション実行する2点のコードを書きますが、SwiftUIでは、あらかじめViewにアニメーションの設定を入れ、アニメーション対象のViewのプロパティを変更することでアニメーションさせることができます。以下は、今回の案件で利用したUIの例です。画面下のボタンをクリックして画面下部のViewを拡大・縮小させます。ボタンの押下時に Viewの高さを変更させるのみで、Viewのアニメーションが実行できます。

f:id:adglobe_n_ozawa:20211231123430g:plain:h300
画面下に配置したviewの拡大と縮小

  • 案件でのサポートされるiOSのバージョンが、iOS14以上であったこと
    • iOS13は、マイナーバージョンでOS間の挙動が異なるため、動作確認が必要になります。またiOS14以上の場合、iOS14から利用できるSwiftUI部品がある利点がありました。

まだまだなところ

SwiftUIでまだまだだなと感じる部分が以下の点です。

・SwiftUIの部品で表現できる部品がない

UI部品が充分にありません。今回のアプリでは、GoogleMapの地図機能とWebをアプリ内に開く機能が必要で、それぞれ、SwiftUIでは部品がまだありません。よって、UIKitでそれぞれの部品を呼び出す実装をしました。

・SwiftUIの部品でカスタムが難しい

UI部品を呼び出すメソッドのプロパティが少ないため、呼び出したUI部品をカスタムすることが難しいケースがありました。ピッカーを例としてあげます。ピッカーは以下のような部品で、上下へのドラッグ操作でくるくる回転するボタンです。

f:id:adglobe_n_ozawa:20211231163933p:plain:h300
pickerの例

案件では、複数のPickerを並べて中央の選択線を消したかったのですが、本記事を執筆した時点では、該当するプロパティを有するSwiftUIの部品はまだありませんでした。そのため、UIKitのパーツを利用致しました。

おわりに

SwiftUIは、UIKitに比べるとまだまだ部品も足りず、カスタマイズできることも多くはありません。エンジニア間では「かゆいところに手が届かない」との表現をしている記事もあります。しかし、個人的にはSwiftで利用したUIKitと比較すると上記のViewのアニメーションのようにUIアニメーションがしやすく、よりインタラクション表現ができるアプリ開発ができると考えております。日々、知見を増やし、ユーザーが使いやすいインタラクションを感じるアプリの開発を求めていきたい思います。