前回の記事からだいぶ時間が経ってしまいましたが、改めて SwiftUI によるアプリケーション開発の記事を書いていくことにします。
まずは、Xcode による 新規プロジェクトの作成方法について説明します。
環境
OS: macOS Big Sur 11.2.1
Xcode: 12.4
Swift: 5.2.4
新規プロジェクトの作成
Xcode を起動したら、「Create a new Xcode project」を選択します。
続いて、テンプレート選択画面(Choose a template for your new project)が表示されるので、[iOS]タブを選択して、一覧から「App」を選択して [Next] ボタンをクリックします。
次に、プロジェクトの設定を行います。
Product Name に任意のプロダクト名を、Organization Identifier には、ユニークな組織名を入力します。一般的には、URL を逆にして入力します。Interface は「SwiftUI」を選択し、Life Cycle は「SwiftUI App」を選択します。最後に [Next] ボタンをクリックします。
続いてプロジェクトの保存先を選択して [Create] ボタンをクリックします。このとき、必要に応じて「Create Git repository on my Mac」を選択します。
先程の画面で「Create Git repository on my Mac」を選択した場合で、Git が未設定のときは、以下のようにな画面が表示されます。この場合は [Cancel] ボタンをクリックして後から設定をするか、[Fix] ボタンをクリックして設定を完了させます。
[Fix]ボタンをクリックすると、以下のように「Source Control」の設定が表示されますので、Author Nameと Author Email を入力します。Ignored Files は、必要に応じてソース管理に登録したくない対象のファイルを入力します。
Xcode の画面構成
プロジェクトの作成が完了すると、Xcode は下図のようになります。 一番左側はナビゲータエリアで、プロジェクトに関連するファイルの選択などができます。
中央のエディターエリアは、ナビゲータエリアで選択したファイルの表示をしたり、デバッグ情報を表示するエリアです。
一番右側は、インスペクタエリアで、選択されている項目の設定などを行います。
Hello World を表示するアプリケーションを作成する
ソースコードの編集
それでは Hello World を表示するアプリケーションを作成しましょう と言いたいところですが、プロジェクトを作成した時点で、すでに Hello World が表示されるアプリケーションになっています。
そこで、「Hello World」ではなく「Hello Swift」を表示するアプリケーションを作成してみましょう。
エディターエリアにはすでに、ContentView.swift のコードが表示されていますが、このコードがアプリ画面に表示される内容を決定しています。
もしも、ContentView.swift が表示されていない場合は、Xcode の左側にあるナビゲータエリアから ContentView.swift を選択してください。
ソースコードを以下の5行目のように「Hwllo, World」から「Hello, Swift」に編集します。
import SwiftUI struct ContentView: View { var body: some View { Text("Hello, Swift!") // ←ここを修正 .padding() } } struct ContentView_Previews: PreviewProvider { static var previews: some View { ContentView() } }
実行画面をプレビューで確認する
ソースコードの編集が完了したら、プレビューで実行時の画面を確認してみましょう。
エディターエリアの右側でプレビュー確認をすることができます。
はじめに Xcode の上部で任意のシミュレータを選択します(下図の赤枠部分)。現時点で最新の iPhone 12 シリーズも選択可能です。
シミュレータの選択が完了したら、エディターエリア右側上部にある [Resume] をクリックします。
しばらくすると、下図のようにプレビューが表示されます。
まとめ
今回は、Xcode を使用して Hello Swift! を表示するまでの手順について説明しました。
Xcode にはじめて触れた方には、すこし難しく感じれられる場合もあるかと思いますが、繰り返し操作しているうちに慣れてきますので、細かいところはあまり気にせずに取り組むようにしましょう。
コメント