第一步
開啟 Storyboard
把 Cell 顯示的元件 透過 Storyboard 都給 拉一拉 , 把 outlet 擺設做好
第二步
新增一個 Class ,
在此我取這個 Class 的名稱為 ByTimeViewCell , 要選 繼承自(Subclass of) UITableViewCell
好了 , 上面兩個圖之後 , 就會產生出 Class ( 有 .h 也有 .m )
第三步 ,
於 ByTimeViewCell.h / .m 添加 outlet 物件的 @property / @synthesize
// ByTimeViewCell.h
@property (nonatomic, weak) IBOutlet UILabel *firstLabel;
@property (nonatomic, weak) IBOutlet UILabel *secondLabel;
@property (nonatomic, weak) IBOutlet UILabel *thirdLabel;
// ByTimeViewCell.m
@synthesize firstLabel;
@synthesize secondLabel;
@synthesize thirdLabel;
第四步
去到 Storyboard , 指派 ByTimeViewCell Class 給 Cell 物件
如果 這個 Custom Class 下拉選單 , 沒有出現 剛剛新增的 .h .m Class ,
請看一下 .h .m Class 應該是還沒儲存
如下圖 尚未儲存
如下圖 ( 當下檔案 Command+S 儲存快速鍵 )已經儲存
如果 .h .m 已經儲存 , 但 Class 還是沒有顯示 ,
可嘗試 關閉其他的 xcode Project 專案 , 只剩下 待解決的這個 Project ,
然後整個 xcode 關掉 重開 , Project 重開
再不行 , 還有一招 , 等下再講
第五步
去到 Storyboard 把 outlet 指派 Object
滑鼠指標移到最右邊的 圈圈 , 圈圈 裡頭會多個 + 號 , 然後按著
拉到 預覽可視版型的 物件上頭 再將滑鼠左鍵放開
第六步
去到 TableViewController.m
編輯 引用 .h
#import "ByTimeViewCell.h"
第七步
去到
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath {
客制 ViewCell
當上方的框框改寫成如下
ByTimeViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];
下方的框框
就可以以 . 帶出我們剛剛所新增的 三個 Label 物件
cell.firstLabel.text = (NSString*)[dictionary objectForKey:@"StayTime"];
cell.secondLabel.text = [NSString stringWithFormat:@"%02i:%02i", components.hour, components.minute];
cell.thirdLabel.text = strDist;
這個 Function 第一行 CellIdentifier , ByTimeTableCell 自己命名
static NSString *CellIdentifier = @"ByTimeTableCell";
但需要與 Storyboard 裡頭 相同
如果不相同 , 編譯不會有 Warring , 也不會有 Error ,
情況會是 滑動 Cell 時 , 都是重新再畫 Cell , 比較耗用效能 , 因為沒有重複使用
如果 Storyboard 空白 , 編譯時會有 Warring , 也不會有 Error
但 , 執行起來 , Cell 會空空的 , 帶不出資料
好了 , 這樣就把 Custom ViewCell 講完了
[EOF]
