【Swift 初心者】TableViewを表示させるのに１番早い記事｜Playground発！アプリ開発会社の技術ブログ

他にもたくさん同じ様な記事があると思いますが、こちらの記事がおそらく

tableViewを表示させるのに最速の方法です。

tableViewはほとんどのアプリで使われているUIですので、

始めたての方はこの記事を読んでレベルアップしてください。

(あくまで初心者向きなので、中級、上級の方は飛ばしてください)

1 1 プロジェクトの作成
2 2 Main.storyboardを変更していきます
3 ViewController.swiftを編集
4 Build

1 プロジェクトの作成

プロジェクトをまずは作ってください。添付画像までできればOKです。

2 Main.storyboardを変更していきます

Main.storyboardに移動したら画像の様な手順でtableViewをViewControllerの上に配置してみてください

SwiftUIのLibrary

❶ ＋ボタンを押しSwiftUIのLibraryを出します。

❷ SwiftUIのLibraryの検索の箇所にtableViewと記入

❸ tableViewが出たらドラッグして白い部分に運ぶ

TableVIewの配置

TableViewのdetaSorceとdelegateをViewControllerへ継承

❶の赤い枠(初めはdatasorceの横）で囲んでいるところを選択すると青い線が出できますので❷のViewControllerと書いてあるところへまで伸ばして離してみてください。

次に同じ様に一段したのdelegateの箇所もやってみてください。

以下の画像の様になればokです。

TableViewCellの配置

先ほどと同じ様にSwiftUIのLibraryを表示させTableViewCellをTableViewの上に運んでください。

Cellの設定

❶ 赤枠の様になっているかどうか確認してください

❷ ここが選択されていることを確認(初めはTableViewCellになっているはず)

❸ identiflerに任意の文字を入力してください(今回はCellというのにしてます)

ViewController.swiftを編集

TableViewのdetaSorceとdelegateをViewControllerへ継承

❶　UITableViewDelegateとUITableViewDataSourceを追加してください

❷ 赤枠のFixボタンを押してください

すると以下の画像の様になるかと思います。

Cellの表示、表示内容の設置

❶ ❷ ❸の箇所に赤枠で囲っているコードを打ち込んでください。

❶ 何を表示するかの材料

❷ 何個表示するか？今回は a,b,cの3つ

❸ どのCellを使うのか、使いまわせる様にする設定

下記にコードを載せておくのでそちらをコピペでも構いません。

import UIKit



class ViewController: UIViewController , UITableViewDelegate, UITableViewDataSource {
    
    
    var array = ["a", "b", "c"]
    
    func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        return array.count
    }
    
    func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
       let cell: UITableViewCell = tableView.dequeueReusableCell(withIdentifier: "Cell", for: indexPath)
        // セルに表示する値を設定する
        cell.textLabel!.text = array[indexPath.row]
        return cell
    }
    

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