こんにちは、Takuです!Xcode成長記Part1の今回は、Xcodeを触りだけやってみようかと思います。
具体的に何をするかというと!定番である、「Hello World」を出すだけです(笑)
とりあえずやっていきましょう!
当記事では、Xcodeの初心者がノート感覚で残しているので、プロの方が見ると、すこしおかしい部分がある場合もあると思いますが、そこは大目に見てください…けど、コメントで教えてくださると、ものすごく嬉しいです!
ファイルを作る
ごちゃごちゃになったら嫌なので、まずはFinderにプログラム用のフォルダーを作っていきます。
デスクトップを開き、新規フォルダーを作成。名前は「Xcode」としておきます。その中に一応のために、「Practice」という名前のフォルダーも作っておきます。
これができたら、とうとうXcodeを起動していきます!!
まだインストールをしていない方は、App Storeを開き、「Xcode」と検索します。
↑こいつをインストールします。かなり重いアプリなので、家のWi-Fiの環境で、時間のある時にインストールするのがおすすめです。
インストールが終わったら、Xcodeを起動します。そして、次に下の写真でまるで囲ってあるところをクリックしてください。
すると、画面が変わるはずなので、次も下の写真で丸で囲ってあるやつをクリックしてください。
すると次のポップアップが出てくるので、下の写真で上から順番に設定していきます。
まずProject Nameですが、今回はHello Worldで行きます。できるだけ英語の方がいいと思います。
次に、Teamですが、ここは任意で、自分のApple IDを追加してください。
次のOrganization Identiferでは一意なIDをつける必要があります。今回はなんでもいいのですが、com.Testや
com.自分の名前などにしておいてください。
InterfaceはStoryboardとしておいてください。LanguageはSwiftにしてください。
最後にUse Core DataとInclude Testsは、高度なアプリ開発をする際に使うらしいですが、今回は必要ないので、チェックを外しておいて大丈夫です。
これができたら、Nextを押してください。
すると保存先の選択画面となりますので、先ほど作成した、「Xcode」→「Practice」を選択してCreateをクリックします。
これで、Projectが作成できました!
UIを作る
では、UIを作っていきます。いうだけだと少し難しそうに聞こえますが、Xcodeではすごく簡単にできるので、早速やっていきましょう!
まず下の写真でまるで囲ってあるMain.storyboardを開いてください
これで、開いて出てきた画面がUIを作成する「Storyboard」と呼ばれる場所です。ではここに、HelloWorldをおいていきます。Xcodeの画面で右上の方にある下の写真でまるで囲ってある+ボタンを押してください。
すると小さい画面が出てくるので、その中の「Label」を下の写真のようにiPhoneの画面に置いてください
次にLabelを一回クリックします。すると右に色んな設定画面が出てきます、ここで、このLabelの設定を変えていきます。
上の写真で、上から2番目にあるテキストフィールドで「Label」から「Hello Word」と変更します。
その下にあるColorで、テキストカラーを変えれるので、好きな色に設定してください。僕は黒に設定しておきます。
次に、その下にあるFontからSystem 25.0くらいに変更しておいてください。ここからフォントや文字のサイズを変更できます。
最後に2個下にある、Alignmentで左から2個目の中央揃えを選択しておいてください。
では、次に、Hello Worldの位置を設定していきます、画面の右下のあたりにあり、下の写真で囲ってあるものをクリックしてください
そして、下の写真で、まるで囲ってある2つのチェックを入れて、Add 2Constraintsをクリックしてください。
これで場所の設定ができました。ではこれでアプリ自体は完成です。!
実行する
実行していくのですが、その前に、デバイスを設定の確認をしておきます。
まるで囲ってあるものをクリックします。すると色んな世代のiPhoneが出てきます。
記事執筆時点ではもうiPhone 15 Proが発売されていますが、まだXcodeでは反映されていないので、iPhone 14 Proを設定しておきます。15 Proが出てる場合はせっかくなので、iPhone 15 Proを選択しておいてください!
では、実行していきます!
まるで囲ってある、三角のボタンを押してください。するとSuccess Buildと出てきた後、画面が移りiPhoneの画面が出てきます。
こうなっていると成功です!
これにて、Hello Worldと出すアプリが完成しました!
次回では、簡単に時刻を表示するアプリを作っていきます!
コメント