2日目：複数のテキスト入力エリアを配置、配列に入れて表示するアプリ

2日目のアプリ

複数のテキスト入力エリアを配置、配列に入れて表示するアプリ

画面キャプチャ

以下の流れで作りました。

1. storyboadに4つのUITextFieldと、2つのbutton（表示ボタンとリセットボタン）を配置
2. ボタンを端末が変わってもレイアウトが崩れないように設定
3. 上記要素をViewController.swiftへoptionドラッグして紐付ける
4. 紐付けができたら、ViewController.swiftでコードを書く

できたこと

• UITextFieldの配置ができるようになった
• デバイスサイズが変わってもレイアウトが崩れないように設定できた
• Buttonの文字をViewControllerから変更できるようになった
• テキスト入力エリア毎にソフトウェアキーボードを変更して表示できるようになった
• 文字入力したものを配列に格納することができるようになった
• Buttonのタップ（表示ボタン）をトリガーにして入力した文字列を表示できるようになった
• リセットボタンをトリガーにしてテキストエリアを空欄＆配列空欄にできるようになった

書いたコードを共有します！

import UIKit

//テキストフィールドのデータを受け取るためにViewControllerにUITextFieldDelegateを追加
class ViewController: UIViewController, UITextFieldDelegate {


//    要素を紐付ける
    @IBOutlet weak var name: UITextField!
    @IBOutlet weak var age: UITextField!
    @IBOutlet weak var phone: UITextField!
    @IBOutlet weak var email: UITextField!
    @IBOutlet weak var label: UILabel!

//    4つの項目の文字を一度に出力するために配列を用意する
    var outPutText:[String] = ["", "", "", ""]

//    画面読み込み時に表示するもの
    override func viewDidLoad() {
        super.viewDidLoad()

//        プレースホルダー
        name.placeholder = "なまえ"
        age.placeholder = "ねんれい"
        phone.placeholder = "でんわばんごう"
        email.placeholder = "めーるあどれす"

//        入力時にキーボードをニョキっと出す
        self.name.keyboardType = .namePhonePad
        self.age.keyboardType = .numberPad
        self.phone.keyboardType = .phonePad
        self.email.keyboardType = .emailAddress


//        テキストフィールドに入力された内容を受け取る

        name.addTarget(self, action: #selector(getName(textField:)), for: UIControl.Event.editingChanged) //何か入力があったら呼び出す

        age.addTarget(self, action: #selector(getAge(textField:)), for: UIControl.Event.editingChanged)

        phone.addTarget(self, action: #selector(getPhone(textField:)), for: UIControl.Event.editingChanged)

        email.addTarget(self, action: #selector(getEmail(textField:)), for: UIControl.Event.editingChanged)

        name.delegate = self
        age.delegate = self
        phone.delegate = self
        email.delegate = self


    }

    @objc func getName(textField: UITextField) {
        outPutText[0] = "Name: " + name.text!
}
    @objc func getAge(textField: UITextField) {
        outPutText[1] = "Age: " + age.text!
    }

    @objc func getPhone(textField: UITextField) {
        outPutText[2] = "Phone: " + phone.text!
    }

    @objc func getEmail(textField: UITextField) {
        outPutText[3] = "E-mail: " + email.text!
    }

    @IBAction func tapButton(_ sender: Any) {
        let str = outPutText[0] + "\n" + outPutText[1] + "\n" + outPutText[2] + "\n" + outPutText[3]
        label.numberOfLines = 4
        label.text = str
        self.view.endEditing(true)
    }

    @IBAction func clearButton(_ sender: Any) {
        outPutText = ["", "", "", ""]
        label.text = ""
        name.text = ""
        age.text = ""
        phone.text = ""
        email.text = ""

    }

    func textFieldShouldReturn(_ textField: UITextField) -> Bool {
            textField.resignFirstResponder()
            return true
        }



}

感想

2日目。とにかく形にすることに集中！コードの書き方はきっと素人。。。