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

うさがにっき

読書感想文とプログラムのこと書いてきます

テーブル表示

概要

複数のデータをリスト表示するUItableView、一覧画面と詳細画面が切り替わるMaster-Detail Appliationなどをまとめる

詳細

UITableView

複数の値をリスト表示させたいときに使う
データの表示はdelegateを使う

UITableViewにデータを表示して選択すると値を表示してみる

ViewControllewにTable Viewを配置
f:id:tiro105:20150323113405p:plain
Table ViewのdataSourceとdelegateをView Controllerに設定
f:id:tiro105:20150323113448p:plain
VIewControllerにdataSourceとdelegateのソースを記載

import UIKit

class ViewController: UIViewController, UITableViewDataSource, UITableViewDelegate {

    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view, typically from a nib.
    }

    override func didReceiveMemoryWarning() {
        super.didReceiveMemoryWarning()
        // Dispose of any resources that can be recreated.
    }

    // 行数
    func tableView(tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        return 10
    }
    
    // 表示するセルの中身
    func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell {
        var cell = UITableViewCell(style: .Default, reuseIdentifier: "myCell")
        cell.textLabel?.text = "\(indexPath.row)行目"
        return cell
    }
    
    // 選択されたときに行う処理
    func tableView(tableView: UITableView, didSelectRowAtIndexPath indexPath: NSIndexPath) {
        println("\(indexPath.row)行目を選択")
    }

}

こんな感じ
f:id:tiro105:20150323114328p:plain

Master-Detail Application

一覧と詳細画面が切り替わるアプリに使う

新規プロジェクトでMaseter-Detail Applicationで作成する
f:id:tiro105:20150323114649p:plain

Master Detail Appliationはそのままでは編集機能が付いている状態になっている
初めてなので表示するだけにするために、編集機能を削除する

削除前

    override func viewDidLoad() {
        super.viewDidLoad()
        // Do any additional setup after loading the view, typically from a nib.
        self.navigationItem.leftBarButtonItem = self.editButtonItem()

        let addButton = UIBarButtonItem(barButtonSystemItem: .Add, target: self, action: "insertNewObject:")
        self.navigationItem.rightBarButtonItem = addButton
    }

削除後

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

データの追加をするメソッドを削除
削除するメソッド

    func insertNewObject(sender: AnyObject) {
        objects.insert(NSDate(), atIndex: 0)
        let indexPath = NSIndexPath(forRow: 0, inSection: 0)
        self.tableView.insertRowsAtIndexPaths([indexPath], withRowAnimation: .Automatic)
    }

データの編集をするメソッドを削除
削除するメソッド

    override func tableView(tableView: UITableView, canEditRowAtIndexPath indexPath: NSIndexPath) -> Bool {
        // Return false if you do not want the specified item to be editable.
        return true
    }

    override func tableView(tableView: UITableView, commitEditingStyle editingStyle: UITableViewCellEditingStyle, forRowAtIndexPath indexPath: NSIndexPath) {
        if editingStyle == .Delete {
            objects.removeAtIndex(indexPath.row)
            tableView.deleteRowsAtIndexPaths([indexPath], withRowAnimation: .Fade)
        } else if editingStyle == .Insert {
            // Create a new instance of the appropriate class, insert it into the array, and add a new row to the table view.
        }
    }

テーブルビューを表示するようにプログラムを修正

    override func viewDidLoad() {
        super.viewDidLoad()
        
        // タイトルをつける
        self.title = "寿司メニュー"
        // 表示データを用意
        objects = ["まぐろ", "サーモン", "えび", "はまち", "いか", "うなぎ"]
    }

cellForRowAtIndexPathで、表示する行のラベルの値を設定

    override func tableView(tableView: UITableView, cellForRowAtIndexPath indexPath: NSIndexPath) -> UITableViewCell {
        let cell = tableView.dequeueReusableCellWithIdentifier("Cell", forIndexPath: indexPath) as UITableViewCell

        // 表示する行のラベルに配列の値を設定
        var myStr = objects[indexPath.row] as String
        cell.textLabel?.text = myStr
        
        return cell
    }

行が選択されたときにdetail画面にデータを渡すプログラムを作る

    override func prepareForSegue(segue: UIStoryboardSegue, sender: AnyObject?) {
        if segue.identifier == "showDetail" {
            if let indexPath = self.tableView.indexPathForSelectedRow() {
                let object = objects[indexPath.row] as String
                let controller = segue.destinationViewController as DetailViewController
                controller.detailItem = object
            }
        }
    }

detail画面では受け取ったデータをラベルに表示する仕組みができているのでそのまま使う

    func configureView() {
        // Update the user interface for the detail item.
        if let detail: AnyObject = self.detailItem {
            if let label = self.detailDescriptionLabel {
                label.text = detail.description
            }
        }
    }

こんな感じ
f:id:tiro105:20150323121141p:plain
f:id:tiro105:20150323121150p:plain

感想

DetailViewControllerに値が渡るところとかがよくわからない
徐々に調べてく

参考

Swiftではじめる iPhoneアプリ開発の教科書 【iOS 8&Xcode 6対応】

Swiftではじめる iPhoneアプリ開発の教科書 【iOS 8&Xcode 6対応】

広告を非表示にする