Customizing Table View Cells

Tabel View 是一種在 iOS 裝置上面顯示多筆數的資料元件，其中每一筆稱之為 Table View Cell。在 Table View Cell 裡面提供了一些預設的 cell 樣式，default 樣式可以顯示圖片和文字在同一行、subtitile 樣式可以顯示細節比較小灰色字體在主要文字下方、Style Value 1 讓主文字靠左細節項目靠右顯示、Style Value 2 讓細節項目顯示在主文字的左邊。如果今天想要呈現不是 UITableView Cell 提供的，我們有兩種方式可以達到，一是直接在 UITableViewCell 加入 subviews，二是為 UITableViewCell 建立 subclass。

方式一、加入 subviews 到 Table View Cell
在 CellsViewController.m 裡面實作基本的程式碼，例如初始化要宣告哪些值配製，這邊參考 code 即可，比較值得提的部份是：


在 UITableViewCell 初始化時候，規劃 CGRect, UILabel 並且配製文字顯示和字體大小，然後將這些放置給 cell 的 contentView，像這樣子
[cell.contentView addSubview:nameLabel];
看要配製幾組，就依序這樣一一加入 contentView 裡面。當我們建置好 cell ，使用 indexPath 參數去決定說現在是哪一個 row 要取出事先配製在 dictionary 的 key/balue pairs。看完整 CellViewController.m 程式碼

方式二、加入 subclass 到 UITableViewCell
另外開設繼承 UITableViewCell 的 CutomCell 包含 (.h, .m, .xib 檔案)，在 CutomCell.m 規劃出要顯示的 UILabel 名稱和顏色，規劃好 IBOutlet 後，進入到CutomCell.xib，使用 Interface Builder 我們可以拖拉 Table View Cell，指定 class，調整好位置大小後，我們再從 Library 區域拖拉 View 進來，讓它適合我們要顯示的大小，接著我們就可以依序將我們 Label 拉進來，再將 IBOutlet 串聯好，即可回到 XCode 實作去。


在這邊將宣告 CustomCell ，並且將他 nib 配製出來，再來就可以依序 cell 裡面的 colorLabel 和 cell.nameLabel。看完整的 CellViewController.m 程式碼

我們在做這樣練習時候，用同一個 Project，會發現前後要使用不同方法卻是做出同樣效果，所以在 github 上面可以切出兩個 tag，分別是 v0.1, v0.2，來做不同版本的差異紀錄，如此也可以事後進入兩部份對照不同的 CellViewController.m 的 code 做追蹤。以上除了可以參考書本 Beginning iPhone 3 Development 章節 Customizing Table View Cells，程式碼完整收錄在 edwardinubuntu/cell。