読者です 読者をやめる 読者になる 読者になる

脳汁portal

アメリカ在住(だった)新米エンジニアがその日学んだIT知識を書き綴るブログ

[iOS] SwiftによるiPhoneアプリ開発入門(超初歩)その7 -リスト構造-

iOS

今回は一覧表示画面の作成方法を説明します
イメージ
f:id:portaltan:20150723010641p:plain

1、ストーリーボードから既存のシーンを削除して、Table View Controllerを配置し、右の設定画面の「Is Initial View Controller」にチェックをいれます
f:id:portaltan:20150723003005p:plain

2、セルのプロパティを編集して、スタイルとidentifierを設定します
f:id:portaltan:20150723003149p:plain

3、既存のビューコントローラを削除し、UITableViewControllerのサブクラスを作成します
f:id:portaltan:20150723003818p:plain

4、テーブルに表示するデータをTableViewControllerに入力します
以前説明したタプル構造で配置します

    let items: [(text: String, detail: String)] = [
        ("キーボード", "メカニカルキーボードです"),
        ("マウス", "3ボタンマウスです"),
        ("ゲームパッド", "連射機能が搭載されています"),
        ("液晶ディスプレイ", "23インチです。サブディスプレイにぜひ"),
        ("LANケーブル", "電波の強力なモデルなので、家中に電波が行き渡ります。"),
        ("マウスパッド", "かわいいハムスターのデザインです"),
        ("外付けHDD", "30TBの大容量なので、バックアップ用に最適です"),
        ("USBケーブル", "断線しにくい構造になっています"),
        ("DVD-R", "日本国内で生産しています"),
    ]

5、セクション(グループ分け)の数を設定
今回はグループにわけないので、1を設定

    //セクションの数を返す
    override func numberOfSectionsInTableView(tableView: UITableView) -> Int {
        // #warning Potentially incomplete method implementation.
        // Return the number of sections.
        return 1
    }

6、セクションあたりの行数を設定する
今回は1セクションなので、全アイテムの件数を設定する

    //セクションの数を返す
    override func numberOfSectionsInTableView(tableView: UITableView) -> Int {
        // #warning Potentially incomplete method implementation.
        // Return the number of sections.
        
        // 全データを返す
        return items.count
    }

7、セルの作成の処理を実装する

    override func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell {
        
        // 再利用できそうなセルがあれば取得する
        // 第一引数にはストーリーボードで作成したセルのidentifierを指定する
        let cell = tableView.dequeueReusableCellWithIdentifier("myCell", forIndexPath: indexPath) as! UITableViewCell
        
        // セルの内容を設定
        cell.textLabel?.text = items[indexPath.row].text
        cell.detailTextLabel?.text = items[indexPath.row].detail

        return cell
        
    }

8、シーンといま作成したUITableViewControllerを紐づける
f:id:portaltan:20150723005659p:plain

以上で完成です。