表視圖是iOS開發中使用最頻繁的視圖,我們一般都會選擇以表的形式來展現資料,比如通訊錄、頻道列表等。表視圖分段、分組、索引等功能使我們所展 示的資料看起來更規整更有調理,更令人興奮的是表視圖還可以利用細節展示等功能多層次的展示資料,正所謂一表勝千言。 不過,相較於其它控制項表視圖的使用比較複雜,但是對比於表視圖各種靈活多變的功能,我們在使用上花費的努力還是相當值得的。
簡單表視圖
表視圖的形式靈活多變,本著由淺入深的原則,我們先從簡單表視圖開始學習。本節講的簡單表視圖是動態表,(iOS 5之前全部是動態表沒有動態表和靜態表區別)。
建立簡單表視圖
在iOS 5之後我們可以使用xib或者故事板技術建立表視圖,要顯示的是一個最基本的表,我們只需實現UITableViewDataSource協議中必須要實 現的方法即可,分別是tableView:numberOfRowsInSection:和 tableView:cellForRowAtIndexPath:就可以了。:
構造方法initWithFrame:style:是在執行個體化表視圖的時候調用,如果採用xib或故事板來設計表視圖,那麼表視圖的建立是在執行個體化 表視圖控制器的時候完成的,表視圖顯示的時候會發出tableView:numberOfRowsInSection:訊息詢問當前節中的行數,表視圖單 元格顯示的時候會發出tableView:cellForRowAtIndexPath:訊息為儲存格提供顯示資料。
我們建立一個簡單表視圖,儲存格使用預設樣式,有表徵圖和主標題,顯示的是世界盃球隊的資訊。
使用“Single View Application”模板建立一個工程,工程名為“SimpleTable”,開啟IB設計畫面,在“View Controller Scene”選中“View Controller”刪除控制器,然後從控制項陳列庫中拖拽一個“Table View Controller”到設計畫面。
將h檔案中ViewController的父類從原來的UIViewController修改為UITableViewController。
在IB設計畫面左側的Scene列表中選擇“Table View Controller Scene” → “Table View Controller”, 開啟表視圖控制器的標識檢查器,在Class選項裡選擇“ViewController”,這是我們自己的編寫視圖控制器。
然後在Scene列表中選擇“Table View Controller Scene” → “Table View Controller” → “Table View”, 開啟表視圖的屬性偵測器。Content下有兩個選項“Dynamic Prototypes”和“Static Cells”,這兩個選項只有在故事板中才有。“Dynamic Prototypes”是構建“動態表”
如果通過代碼來實現儲存格的建立,“Prototype Cells”項目要設為0,代碼實現的模式代碼如下:
static NSString *CellIdentifier = @”CellIdentifier”;UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];if (cell == nil) {cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:CellIdentifier];}
Identifier是可重用儲存格標識符,這個可重用儲存格與Collection視圖中的可重用儲存格概念一樣。首先,在表視圖中尋找是否有可 以重用的儲存格,如果沒有就通過initWithStyle: reuseIdentifier:構造方法建立一個儲存格對象。
如果要利用故事板設計儲存格,要選擇“Table View Controller Scene” → “Table View Controller” → “Table View” → “Table View Cell”,開啟儲存格的屬性偵測器,Style下有很多選項, Identifier是指可重用儲存格標識符。
這樣操作以後在代碼部分就不需要執行個體化儲存格了,我們直接通過設定的Identifier取得儲存格的執行個體,以此達到重用儲存格的目的。
static NSString *CellIdentifier = @”CellIdentifier”;UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier]; if (cell == nil) { cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:CellIdentifier]; }我們需要將“team.plist”和“球隊圖片”添加到工程中,ViewController.h檔案的代碼如下:#import <UIKit/UIKit.h>@interface ViewController : UITableViewController@property (nonatomic, strong) NSArray *listTeams;@end
需要將ViewController的父類修改為UITableViewController。還定義NSArray*類型的屬性 listTeams,listTeams用來裝載從檔案中讀取的資料。讀取屬性列表檔案team.plist的操作是在viewDidLoad方法中實現 的
ViewController.m檔案的viewDidLoad方法代碼如下:
- (void)viewDidLoad{[super viewDidLoad];NSBundle *bundle = [NSBundle mainBundle];NSString *plistPath = [bundle pathForResource:@"team" ofType:@"plist"];//擷取屬性列表檔案中的全部資料self.listTeams = [[NSArray alloc] initWithContentsOfFile:plistPath];}我們再看看UITableViewDataSource協議方法,代碼如下:- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section{return [self.listTeams count];}- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{static NSString *CellIdentifier = @”CellIdentifier”;UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:CellIdentifier];if (cell == nil) {cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:CellIdentifier];}NSUInteger row = [indexPath row];NSDictionary *rowDict = [self.listFilterTeams objectAtIndex:row];cell.textLabel.text = [rowDict objectForKey:@"name"];NSString *imagePath = [rowDict objectForKey:@"image"];imagePath = [imagePath stringByAppendingString:@".png"];cell.imageView.image = [UIImage imageNamed:imagePath];cell.accessoryType = UITableViewCellAccessoryDisclosureIndicator;return cell;}
由於當前的這個表事實上只有一個節,因此不需要對節進行區分,在tableView: numberOfRowsInSection:方法中直接返回listTeams屬性的長度即可。 tableView:cellForRowAtIndexPath:方法中NSIndexPath參數的row方法可以獲得當前的儲存格行索引。 cell.accessoryType屬性是設定擴充檢視類型。
我們可以將儲存格的樣式UITableViewCellStyleDefault替換為其它三種,來體驗一下其它的三種儲存格樣式的效果。
簡單表案例運行結果