ToDoアプリの作成

Blog

 

ToDoアプリを作成してみましょう。

完成イメージ

 

 

 

 

 

環境

  • Swift4
  • Xcode9
  • UITableView
  • UITextField

 

それでは、やっていきましょう。

 

UIの設定

 

 

 

 

TableViewとCellの設定

 

 

  1. cellのIdentifierに名前をつける。「Cell」。
  2. tableViewにdelegate、datasourceを設定。

 

 

 

 

 

 

 

ファイルの作成と関連付け

 

 

  1. File > New > Fileで「addViewController.swift」を作成。
  2. アイテム追加画面とaddViewController.swiftを関連させる。

 

 

 

 

 

 

セグエの追加

 

 

  1. 追加ボタンからAddView画面へセグエをつなぐ。「show」を選択。
  2. 戻るボタンからTableView画面へセグエをつなぐ。「show」を選択。

 

 

 

 

 

 

コネクト

 

[ ViewController.swift ]

  1. TableViewをOutlet接続。

 

 

 

 

[ addViewController.swift ]

 

  1.  TextFieldをOutlet接続。
  2. ButtonをAction接続。

 

 

 

コーディング

 

[ addViewController.swift ]

 

  1. 変数の作成。
  2. Addボタンにコードを記入。

 

 

 

import UIKit

var TodoKobetsunonakami = [String]()


class addViewController: UIViewController {
    
    
    @IBOutlet weak var textField: UITextField!

    override func viewDidLoad() {
        super.viewDidLoad()

        // Do any additional setup after loading the view.
    }
    
    
    @IBAction func addButton(_ sender: Any) {
        
        TodoKobetsunonakami.append(textField.text!)
        
        textField.text = ""
    
        UserDefaults.standard.set( TodoKobetsunonakami, forKey: "TodoList" )
    
    }
    

    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
        // Dispose of any resources that can be recreated.
    }
    
}

 

[ ViewController.swift ]

 

  1. TableViewのメソッド、DataSource、Delegateを追加。
  2. ViewDidLoad内にコードを追加。

 

 

 

 

import UIKit

class ViewController: UIViewController, UITableViewDelegate,UITableViewDataSource {
    
    @IBOutlet weak var tableView: UITableView!
    

    override func viewDidLoad() {
        super.viewDidLoad()
        
        if UserDefaults.standard.object(forKey: "TodoList") != nil {
            TodoKobetsunonakami = UserDefaults.standard.object(forKey: "TodoList") as! [String]
        }
        
    }
    
    
    func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        
        return TodoKobetsunonakami.count
    }
    
    func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
    
        let TodoCell : UITableViewCell = tableView.dequeueReusableCell(withIdentifier: "Cell", for: indexPath)
        
        TodoCell.textLabel!.text = TodoKobetsunonakami[indexPath.row]
        
        return TodoCell
    
    }

    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
        // Dispose of any resources that can be recreated.
    }


}

 

 

実行結果

 

 

 

 

 

いかがでしたか。

 

以上で「ToDoアプリの作成」の説明を終わります。

 

 

🤗

 

 

コメント