
今回は画面の見方と名称について説明します。
他のサイトのブログなどを見た時にどこを指してるのかわからなかったりするので覚えておけばその都度調べないで済むので便利だと思います。
①ツールバーエリア
②ナビゲーターエリア
③エディタエリア
④ユーティリティエリア
⑤デバッグエリア
①ここでシュミレーターの実行と停止ができます。実行はcommand+Rでもできます。
②シュミレーターを選択できます。
③開発に関するメッセージが出てきます。
④+が部品などを追加する時に使うボタンで、右側の矢印はSwiftUIで組んだレイアウトのプレビューを見る事ができます。
⑤ナビゲーターエリア、ユーティリティーエリア、デバッグエリアを表示、非表示を切り替えます。
赤枠の中に色々アイコンが並んでいますが、主に使うのが一番左のアイコンです。
このアイコンではプロジェクトの中にどんなファイルが入ってるか確認できて、
それぞれクリックすると右隣のエディターエリアで見る事ができます。
この中のファイルで最初のよく使うのが、
部品などを配置する「Main.storyboard」
コードを書く「ViewController.swift」
画像を格納する「Assets.xcassets」
この3つくらいかなと思います。
(他のアイコンは最初のうちはほとんど使わないので割愛します)
このエリアではstoryboardを開いて部品を配置したり、ViewController.swiftを開いてコードを書いたりします。
ここで押さえておきたいのが、画面を分割して2画面にする方法です。
例えばstoryboardを表示させている状態だとして、ViewController.swiftも同時に表示させたいと言う事がよくあります。
そんな時はstoryboardを表示させている状態でoptionを押しながらクリックすると2画面にできます。
ユーティリティエリアですが、こちらも上部にアイコンが並んでいます。
こちらのアイコンで今開いているファイルの詳細や部品の設定を変えたりできるようになっています。
デバッグエリアはエラーメッセージを確認したりprtint()で出力した結果を確認する事ができます。
試しに簡単な計算結果を表示させて見ました。
以上が基本的な見方と名称です。
参考にしていただければと思います。
[…] 先ほど説明したセルはコードで扱う事になるのでIdentifierの設定をします。Identifier、、、横文字が出てくると難しく思ってしまいがちですが、セルに名前をつけるだけです!では下記画像の補足をします。①をクリックすると緑で囲んだ部分のウィンドウが表示されます。詳しくは[Step2]画面の見方と名称の記事に書いています〜!②を選択した状態で③をクリックして④にMemoTableViewCellと入力します。 […]
[…] まずはstoryboardとアシスタントエディタ(コードを書く画面)の両方を表示させます。前回作ったMemoTableViewController.swiftを「option」を押しながらクリックしてみて下さい。これでstoryboardとアシスタントエディタが同時に表示されたと思います。ナビゲーターエリアとユーティリティエリアは今回使わないので②の青くなってる部分をクリックして消しておきましょう。Xcodeの画面の名称などの詳しい説明はこちらの記事に書いているので参考にしてみて下さいね![Xcode]画面の見方と名称 […]