今回は前から気になっていたSwiftUIを触ってみようと思います
今回の記事は、SwiftUIのチュートリアルをベースにしています
プロジェクト作成
まずはプロジェクトを作ってみましょう！
プロジェクトを新規で作成する際にSingle View App を選択します
Nextをクリックしたら、User InterfaceでSwiftUIを選択します
それ以外は今までと同じようにすればSwiftUI用のプロジェクトが作成されます
プロジェクトの中身
プロジェクトが無事に作成されたら、次は中身をみていきましょう！
プロジェクトを開いて見ると、Storyboardに慣れている人はMain.storyboardがないことに戸惑うかもしれません
SwiftUIはキャンバスのプレビューでアプリの表示や動作を確認してしながらSwiftファイルに直接コードを書いていく形式なので、ストーリーボードは存在しません
最初に画面を作るのはContentView.swiftというビューファイルです
下記の赤枠を押すことでプレビューが表示できるオプションが表示されます(MacのOSバージョンが10.15以上の場合)
Canvasを選択して、Resumeをクリックしることでビルドエラーがなければプレビューが表示されます
SwiftUIのViewファイル(ここでのContentView.swift)は下記2つで構成されています
・Viewの内容やレイアウトの宣言
・プレビューの設定
当然ながら、プレビューで表示されている"Hello World"を書き換えると、書き換えた文言で表示されます
文字のカスタマイズ
文字をもう少しカスタマイズしたい場合はどうすればいいのでしょうか？
プレビュー画面のテキストをクリックしながらcommandボタンを押すとオプションが表示されます
そこで、show SwiftUI inspectorを選択するとサイズやフォントが変更できるオプションが表示されます
例えば、fontをLarge Title、ColorをRedにするとプレビューにも反映され、ソースコードも自動で反映されます
今のところ自分でソースコードを追加してません！
リストにしたりもできるので、簡単なUIを作成するくらいならソースコードを書く必要がないかもしれません
テキストのオプションを追加していく場合はチェーンのようにオプションを追加していくことで実現できます
また下記のようにソースコードのTextの部分でcommand + クリックで同じように設定ができます
今回はここまでとします
SwiftUIは気になるトピックなので、また続きは別記事を書こうと思っています！
