[Swift4]CustomCellミニマムサンプル

CustomCellを使うシンプルな解説記事が見つからなかったのでCustomCellの使い方をできるだけ端的にわかりやすく丁寧に最低限のコードで解説します。

実行環境

xcode: Version 10.1 (10B61)

swift: version 4.2.1

CustomCell

①StoryBoardにTableViewを貼り付ける

②CustomCellクラスを作成(Xibも一緒に)

customCellクラスを作成します。

Also create XIB fileにチェックを入れてください

③Cellのレイアウトを適当に作成

④CellクラスとUIを紐付け

cellの値を変更するUIとcellクラスの紐付けをします。

値をセットするメソッドも作ります。

import UIKit

class CustomTableViewCell: UITableViewCell {

    @IBOutlet weak var button: UIButton!
    @IBOutlet weak var label: UILabel!
    
    //値を設定するメソッド
    func setData(buttonText: String, labelText: String){
        button.setTitle(buttonText, for: .normal)
        label.text = labelText
    }
}

⑤TableViewの紐付けとセルの設定

delegateやregisterはviewDidLoadに書かれている記事が多いですが、didSetに書いた方がスッキリして個人的に好きです。

コードはコメントを入れておいたのでつまるところはないと思います。

import UIKit

class ViewController: UIViewController {

    @IBOutlet weak var tableView: UITableView! {
        didSet {
            tableView.delegate = self
            tableView.dataSource = self
            //nibNameはCustomCellのクラス名、forCellReuseIdentifierは適当なcellを使うときに判別するkey
            tableView.register(UINib(nibName:"CustomTableViewCell", bundle: nil),forCellReuseIdentifier:"customCell")
        }
    }
    var misoSoup:[String]!
    
    override func viewDidLoad() {
        super.viewDidLoad()
        misoSoup = ["しじみの味噌汁", "なめこの味噌汁", "トマトの味噌汁"]
    }
}

extension ViewController:UITableViewDelegate, UITableViewDataSource {
    //セルを何個出すか
    func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        return misoSoup.count
    }
    
    //indexpath.rowに何個めのセルなのかが入っている
    func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        //withIdentifierはregisterで設定したkeyを入れる
        let cell = tableView.dequeueReusableCell(withIdentifier: "customCell") as! CustomTableViewCell
        cell.setData(buttonText: "作る", labelText: misoSoup[indexPath.row])
        return cell
    }
}

⑥ビルド結果

 画像のようなリストが表示されていたら成功です。

CustomCellのボタンタップ

何番目のボタンがタップされたのかを取得する方法を記事にまとめました。

CustomCellのボタンをどのCellのものか判別する