【SwiftUI入門】第1回 Hello world

SwiftUI入門

第1回はプロジェクトの作成から実行までです。

プロジェクトを作成する

まず初めにプロジェクトを作成して行きましょう。

Xcodeを起動すると以下の様な画面になります。

赤枠で囲ったCreate a new Xcode projectを選択します。
既に作ってあるプロジェクトを開く場合はOpen a project or file又は右側の一覧から選択します。

次にプロジェクトの形式を選択します。

様々な形式が選べますが、今回は単純なiOSアプリを作成するのでiOSのAppを選択します。
一般的にイメージするアプリを作る場合はAppでOKです。

ARを使いたい場合はAugmented Reality Appを選択します。
GameはSwiftでゲームを作る場合に選択します。ゲームエンジンを使う場合はそちら側でプロジェクト生成を行うのであまり使わないと思います。

nextで次に進みプロジェクトの設定を行います。

設定項目を順に説明します。

・Product Name
プロジェクト名になります。また後述のOrganizaiton Identifierと組み合わせてBundle Identifierとなります。
アプリの表示名やストア掲載名とは異なります。

・Team
Apple IDを追加することで紐づいた組織又は個人が選択できる様になります。
私の場合は本名が表示されているので念の為隠しています。

Organizaiton Identifier
組織または個人を識別するIDとなります。Product Nameと組み合わせてBundle Identifierとなります。
一応は何でも大丈夫ですが、被ると面倒なので独自のものを設定すべきです。
通例としてリバースドメインとする事を推奨されています。
私の場合はこのWebページ様にthwork.netのドメインを持っているのでnet.thworkとしています。
また、リリースしないテスト用のものは追加で.testを加えて区別しています。
ドメインを持っていない方は独自のなるべく文字列になるように設定して下さい。

Bundle Identifier
アプリを識別するIDとなります。一意に定まらなければなりません。
Product NameとOrganizaiton Identifierが組み合わされて設定されます。
なのでこの2つの項目は注意して設定する必要があります。
なおAppStoreに登録するまでは変更する事は可能ですので、仮のもので設定しておく事は可能ですが、
リリースする予定のものは初めにしっかり決めておくのが無難です。
テスト専用であればある程度雑に決めても構いませんが、重複は避ける様にして下さい。

・Interface
SwiftUIかStoryboardの選択ができます。今回はSwiftUIを選んでください。
後からの変更が全く出来ない訳ではありませんが、非常に面倒なので変更しない方が無難です。

・Language
SwiftUIを選択した時点でSwiftのみになります。
StoryboardであればSwiftとObjective-Cの選択が可能なので、その為の項目です。

・Use Core Data
Core Data はモデルオブジェクトを永続化するためのフレームワークです。
要はデータ保存に使用するのですが、簡単なデータはCore Data無しで保存出来ます。
デフォルトのコードにCore Dataのコードが追加されるので分かりにくくなります。今回は外してください。
後から追加は若干面倒なので必要な場合はチェックを入れて作成する様にしてください。

・Include Tests
テストの為のコードや設定が追加されます。
こちらは無視しても問題が起きにくいのでそのままで大丈夫です。

次へ進むと保存先の選択になります。

任意のフォルダを選んでCreateを押せば完了です。

赤枠のCreate Git repository on my Macはソース管理にGitを使う場合にチェック入れます。
分からない方は外してしまって大丈夫です。後から使うときも簡単に設定出来ます。

アプリを実行する

プロジェクトが作成されたら早速試しに実行してみましょう。

プロジェクトの作成が完了したら以下の様な画面になります。
ContentsViewが選択されていなければ左上のフォルダマークを選択した後ContentsViewを選択して下さい。

まずは赤枠のResumeをクリックしてみましょう。
すると以下の様に画面のプレビューが表示できます。

SwiftUIではプレビューを利用できるので、シミュレータを別途起動する事なく簡単な画面や動作の確認ができます。

次はシミュレータで動かしてみましょう。

赤枠の位置をクリックするとプルダウンが出ます。
ここから実行した機種を選択します。実機を接続した場合もこの一覧に追加されます。

最後に赤枠の位置のボタンを押すとビルドが行われ、シミュレータが立ち上がり実行されます。
初回は時間がかかるのでゆっくり待ちましょう。

これでアプリが実行できました。

まとめ

第1回ではプロジェクトの作成から実行までを行いました。

特別難しい事はありませんでしたが、設定項目にはいくつか注意が必要な点がありましたので、しっかり把握しておきましょう。

次回はデフォルトのコードの解説を行なっていきます。

コメント

タイトルとURLをコピーしました