#15 Swift で TableViewからPickerViewへのデータ伝達と戻り値処理

実現したい機能

•	画面1（TableView）: 「Auto-Lock」というラベルと、現在選択中の時間（デフォルトは「30 Seconds」）を表示。
•	画面2（PickerView）: 時間選択のためのピッカーを表示。選択後に画面1へ戻ると、選択内容が更新される。

実装ステップ

1. 画面1: SettingListViewController

UITableViewController を使用して、単一のリスト項目を表示します。ここでは、項目のサブタイトルに選択した時間を表示します。

実装コード

import UIKit

class SettingListViewController: UITableViewController {
    var time = "30 Seconds" // デフォルトの選択肢

    override func viewDidLoad() {
        super.viewDidLoad()
    }

    // TableViewのセクション数
    override func numberOfSections(in tableView: UITableView) -> Int {
        return 1
    }

    // セクション内の行数
    override func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        return 1
    }

    // 各セルの設定
    override func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        let cell = tableView.dequeueReusableCell(withIdentifier: "reuseIdentifier", for: indexPath)
        cell.textLabel?.text = "Auto-Lock"
        cell.textLabel?.font = UIFont.systemFont(ofSize: 16)
        cell.detailTextLabel?.text = time // サブタイトルに選択内容を表示
        cell.detailTextLabel?.font = UIFont.systemFont(ofSize: 14)
        cell.detailTextLabel?.textColor = .lightGray
        cell.accessoryType = .disclosureIndicator // 矢印を表示
        return cell
    }

    // unwind segueで戻ってきたときにデータを受け取る
    @IBAction func unwindToSetting(_ unwindSegue: UIStoryboardSegue) {
        if let sourceViewController = unwindSegue.source as? PickerSettingViewController,
           let selectedTime = sourceViewController.selectedTime {
            time = selectedTime
        }
        tableView.reloadData() // データを更新してリロード
    }
}

2. 画面2: PickerSettingViewController

UIPickerView を使用して、時間を選択する画面を実装します。選択された値を prepare(for segue:) で渡します。

実装コード

import UIKit

class PickerSettingViewController: UIViewController, UIPickerViewDelegate, UIPickerViewDataSource {
    @IBOutlet weak var timePicker: UIPickerView!
    var selectedTime: String? = ""
    let timeOptions = ["30 Seconds", "1 Minute", "2 Minutes", "5 Minutes", "Never"] // 選択肢

    override func viewDidLoad() {
        super.viewDidLoad()
        timePicker.delegate = self
        timePicker.dataSource = self
    }

    // UIPickerViewのコンポーネント数
    func numberOfComponents(in pickerView: UIPickerView) -> Int {
        return 1
    }

    // 各コンポーネントの行数
    func pickerView(_ pickerView: UIPickerView, numberOfRowsInComponent component: Int) -> Int {
        return timeOptions.count
    }

    // 各行に表示する内容
    func pickerView(_ pickerView: UIPickerView, titleForRow row: Int, forComponent component: Int) -> String? {
        return timeOptions[row]
    }

    // 次の画面にデータを渡す
    override func prepare(for segue: UIStoryboardSegue, sender: Any?) {
        selectedTime = timeOptions[timePicker.selectedRow(inComponent: 0)]
    }
}

ポイント解説

1. unwind segue の使用

unwind segue を使用することで、簡単にデータを前の画面に戻すことができます。以下の手順で設定します：
1. Storyboard で PickerView の「Done」ボタンから SettingListViewController の exit アイコンにドラッグ。
2. @IBAction を実装して、戻ってきた際のデータ受け取りを設定。

@IBAction func unwindToSetting(_ unwindSegue: UIStoryboardSegue) {
    if let sourceViewController = unwindSegue.source as? PickerSettingViewController,
       let selectedTime = sourceViewController.selectedTime {
        time = selectedTime
    }
    tableView.reloadData()
}

prepare(for segue:) を使ったデータの準備

prepare(for segue:) を使用して、PickerView で選択されたデータを次の画面に渡します。この方法を使えば、unwind segue のデータ受け取りが容易になります。

まとめ

この実装を通じて、以下を学びました：
• UITableView と UIPickerView の連携
• unwind segue を使用した画面間のデータ伝達

この記事が参考になれば幸いです！フィードバックや質問があれば、ぜひコメントをお寄せください。😊