SwiftUI レイアウト編(1) プロジェクト作成とこれまでとの違いチェック

何を作るか考えて、ClockClipというアプリが良いかと。
ずいぶん前につくったまま放置してしまっていましたが、難しいレイアウトでないし、SwiftUIの練習も兼ねて、作り直してみましょう。
#自分的には、重宝してました。が、アプリとしては、鳴かず飛ばずです。

ClockClip:どんなアプリか

古いiPadを持っているので、それでスライドショー&時間表示(+アラーム等もあったら便利?)ということができたらいいなアプリです。
あまり複雑な機能を入れたくはないと考えて、機能はシンプルに、それに伴ってGUIもシンプルになってます。なので、SwiftUIの練習に最適かと。

作りたいUI

基本的には、以下の要素がメイン画面の要素。

  • 写真のスライドショーを表示するImageViewがどーんと真ん中に。
  • あとは、設定画面へ移行するボタンが端の方のどこかに
  • 時計も表示したいので、デジタル時計の部分をどこかに

予想する難しさは、以下と予想しますが、どうでしょう。

  • 重ねて配置する要素をどのように記述するのか

まずは、プロジェクト作成

  • 新しいプロジェクト作成
  • iOS / SingleViewAppを選択
  • プロジェクトの名前を設定するときに併せて、User InterfaceでSwiftUIを選択
    今回は、CoreDatは使わないので選択せず。UITestは必要に応じて。
  • 保存するフォルダを選択したら、プロジェクト作成完了

作ったプロジェクトの中身確認

SwiftUIを指定する/しないでどのような違いができるのかを確認してみたところ

SwiftUI指定で作成したプロジェクトのStoryboard指定で作成したプロジェクトとの違い
  • ViewControllerの代わりにContentViewが作成される
  • (おそらくPreview用?)Content Previewフォルダが作成される
  • Info.plistでUIMainStoryboardFile, UISceneStoryboardFileのどちらのキーも指定がなくなっている
  • SceneDelegate.swiftでUIHostingControllerを使うようにコード生成されている
最後のUIHostingControllerは調べてみないとわからないけど、他の相違点は、もっともなものでした。
ちなみに
上記の差分は、XCodeをインストールすると一緒にインストールされる”FileMerge”というアプリで調べました。便利!

UIHostingController?

上記が定義なので、内包するビューをContentとしてもつViewControllerのGenericsという感じかと。
SwiftUI指定で追加されるコードは、「上位から渡されたSceneがUIWindowSceneであるならば、ContentView(新しく作られていたクラス)をrootViewとしてもつUIHostingControllerをWindowのrootViewControllerとして持つように設定する」でした。
ざっくりいうと、ContentViewをそのコンテンツとしてもつWindowをUIHostingControllerでControlするように設定するということ。

気づいたこと

これまでの、UIViewとUIViewControllerの関係と似ている感じ。
おそらく、新規の記法含め、内部ビューの設定をContentViewという形で独立させたかったので、それを内包するコントローラも作りましたという感じかと。

新しい技術って、調べるだけで楽しくて、ワクワクする!

1 COMMENT

コメントを残す

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です