ToDoリストアプリを作成する（XcodeとSwiftの基礎）
ToDoリストアプリを作成する（XcodeとSwiftの基礎）
Xcodeの基本的な使い方やSwift言語の基礎について解説します。
百聞は一見にしかず、実際にToDoリストアプリを作って学びましょう！
※Swift言語とXcodeを学び始めて2.3週間程度の者が書いています。
プロの方の記事や、同じToDoアプリを作成している先輩方の記事を参考にしていますが、適切でない表現等ございましたら、教えていただけますと幸いです。
プロジェクトの作成
「➕Create a new Xcode project」で iOS Application の App を選択する。
任意のProduct Nameを設定し、以下の画像と同じように設定する
（私は「My ToDoList」とした）
トップ画面を作成する
左のプロジェクトファイル内から「Main」を選択した後、アプリの端末サイズを選択する。
（ここの選択を謝ると、作成したアプリが正しく表示されないので、しっかりと確認すること！）
画面中央のLibrary（＋ボタン）を開き、「Navigation Bar」と「Navigation Item」をボード上にドラッグ＆ドロップする。
前項の要領で「Table View」と「Table View Cell」も追加する。
画面遷移先Storybordを作成する
画面中央のLibrary（＋ボタン）を開き、「View Controller」を追加する。
遷移先Storybordに「Navigation Bar」と「Navigation Item」、「Text Field」と「Buttun」を追加する
それぞれのオブジェクト表記「MyToDoList」や「＋」「戻る」などの設定は画面右側の「三」内にある「Title」に任意の文字列を入力することで設定できる。
遷移先bordのswiftファイル作成
タスクバーから「 File」→「New」→「File...」→「iOS」→「Cocoa Toutch Class」を選択し、ファイルを作成します。
Class名はわかりやすく「AddViewController」にしました。
それぞれの紐付け
「Main」を開き、遷移先bordを選択します。
下画像のように所属Classを「AddViewController」に設定します。
トップbordの「Navigation Item」を選択し、「controlキー」を押しながら遷移先bordまでドラッグします。
選択フィールドから「Show」を選んでください。
遷移先bordの「Navigation Item」を選択し、「controlキー」を押しながらトップbordまでドラッグします。
選択フィールドから「Show」を選んでください。
※画面が小さくなった場合は「画面が小さくなった！」を参考にしてください。
「Tavle View」を選択し、「controlキー」を押しながらトップbordの「View Controller」までドラッグします。
トップ画面と遷移画面との間に矢印マークが表示されているか確認してください。
選択フィールドから「data Source」と「delegate」を選択します。
下画像のようになっているか確認してください。
コーディング
「Main」で遷移先bordを選択した後、画面中央の右上から「Assistant」を選択します。
画面下部または右にAddViewControllerのソースコードが表示されます。
遷移先bordの「Text Field」を選択し、「controlキー」を押しながらソースコードのclass下にドラッグします。
各設定と入力を行なった後に「connect」します。
ボタンも同じようにconnectします。
以下Add Controller と View Controller のソースコード
ViewController
|
/* ViewController.swift * MyToDoList2 * Created by Terrine on 2021/09/28. */ // iOSまたはtvOSアプリ用のグラフィカルなイベント駆動型ユ import UIKit //classの継承を追加 class ViewController: UIViewController,UITableViewDe //UITableView、 func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int { //戻り値の設定(表示するcell数) return TodoTextList.count } //UITableView、cellForRowAtの追加( func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell { //変数を作る let TodoCell : UITableViewCell = tableView.dequeueReusableCell( //変数の中身を作る TodoCell.textLabel!.text = TodoTextList[indexPath.row] //戻り値の設定（表示する中身) return TodoCell } //最初からあるコード override func viewDidLoad() { super.viewDidLoad() //追加画面で入力した内容を取得する if UserDefaults.standard.object(f TodoTextList = UserDefaults.standard.object(f //TodoTextの入力情報を出力する print("TodoTextList: \(TodoTextList)") } } override func didReceiveMemoryWarning() { //アプリがメモリ警告を受信すると、 super.didReceiveMemoryWarning( } } |
AddController
|
/* AddController.swift * MyToDoList2 * Created by Terrine on 2021/09/28. */
import UIKit
//ViewControllerに渡す変数の設置 var TodoTextList = [String]()
class AddController: UIViewController {
//テキストフィールドのコネクト @IBOutlet weak var TodoTextField: UITextField!
//追加ボタンのコネクト @IBAction func TodoAddButten(_ sender: Any) { //変数に入力内容を入れる TodoTextList.append(TodoTextFi //追加ボタンを押したらフィールドを空にする TodoTextField.text = "" //変数の中身をUDに追加 UserDefaults.standard.set( TodoTextList, forKey: "TodoList" ) }
//最初からあるコード override func viewDidLoad() { /* コントローラのビューがメモリにロードされた後に呼び出される。 このメソッドをオーバーライドして、 super.viewDidLoad() }
//エラー発生時に呼び出される override func didReceiveMemoryWarning() { //アプリがメモリ警告を受信すると、 super.didReceiveMemoryWarning( } |
「Swift言語の『！』と『？』の使い分けがわからない！」、「オプショナル型って何？」、「アンラップとは？」
初心者にもわかりやすく１から解説しているオススメサイト：
参考文献：
Swift逆引きハンドブック-林晃- /【Swift/Xcode超入門】ToDoリストを作ってみよう①〜プロジェクト作成からレイアウト作成まで〜 / Swiftで簡単なTODOアプリを作ってみよう / Apple Deveropper
＊＊＊＊＊＊＊記事の更新記録＊＊＊＊＊＊＊
2021/09/28....初回記録！＜更新！
＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊＊
