【swift】TableViewにつけたボタン(UIButton)でページ遷移

10241 ワード
Storyboard Swift tableView UIButton segue Storyboard テキストリンク

Swift(storyboard)でtableviewにボタンを付け、そのボタンをタップしてページ遷移させる方法
githubにてソースコード公開しているのでそれだけでわかる人はこちらから→https://github.com/saisai-web/swift
ページ遷移を行いたい方はこちら→https://saisai-weblink.com/2021/08/19/swiftstoryboardで画面の条件遷移を実装する/

では、本題に移る。

storyboardの設定

下の画像のようにTableViewを設定する。

datasourceとdelegateを赤矢印の方に引っ張れば完成。
この時に注意するのはviewcontrollerではなくviewに引っ張ってしまうこと。

(大事！！)Tableviewの中にTable view cellを埋め込む。埋め込み方は下の画像の様に矢印で引っ張る！！(他のラベルとかボタンとかも同様に追加してあげて下さい。最初のTableView も同様。)

下の画像の赤枠のようにidentiferとかいう部分に「cell」と入力してあげて下さい。

下の画像3枚のようにtag(赤い四角で囲んであります。)を付けてあげる。

最後に。別ページのviewcontroller作成。

viewcontrollerを画面に引っ張ってきて下の画像の様にラベルを配置する。

赤丸の部分をクリックして右側の四角で囲まれた部分に「himadana-」と入力してあげれば完成！！

ViewController側。

以下のコードを貼り付ける。

ViewController.swift
import UIKit

// 追加①：UITableViewDelegate, UITableViewDataSourceを追加
class ViewController: UIViewController , UITableViewDelegate, UITableViewDataSource {

    // 追加②：セルに表示するデータ
    var data = [
        ["qiita","2021/8/21"]
    ]

    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view.
    }

    // 追加③：セルの個数を指定するデリゲートメソッド（必須）
    func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        return data.count;
    }
    // 追加④：セルに値を設定するデータソースメソッド（必須）
    func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        // セルを取得する
        let cell: UITableViewCell = tableView.dequeueReusableCell(withIdentifier: "cell", for: indexPath)

        // TableViewCellの中に配置したLabelを取得する
        let label1 = cell.contentView.viewWithTag(1) as! UILabel
        let label2 = cell.contentView.viewWithTag(2) as! UILabel
        let button = cell.contentView.viewWithTag(3) as! UIButton

        // Labelにテキストを設定する
        label1.text = data[indexPath.row][0]
        label2.text = data[indexPath.row][1]
        button.setTitle("クリック", for: .normal)
            button.addTarget(self, action: #selector(btnEvent), for: UIControl.Event.touchUpInside)

        return cell
    }
    // UIButtonを選択した時
    @objc func btnEvent(_ sender: UIButton) {
        guard let b = storyboard?.instantiateViewController(identifier: "himadana-") else{return}

        present(b, animated: true, completion: nil)
    }

}

以上でbuildした際にページ遷移ができるボタンのついたiosアプリが動く。