這次學(xué)習(xí)的控件非常重要且非常強(qiáng)大，是ios應(yīng)用中使用率非常高的一個(gè)控件，可以說(shuō)幾乎每個(gè)app都會(huì)使用到它，它就是功能異常強(qiáng)大的Table Views。可以打開你的iphone中的phone、Messages、Contacts、Mail、Settings等等等等，這些都用到了Table Views。
在Table Views中，Table是用來(lái)顯示一系列數(shù)據(jù)的，每條數(shù)據(jù)占用且只占用一行（一個(gè)table cell），在ios中沒(méi)有規(guī)定table到底可以容納多少行數(shù)據(jù)，也就是說(shuō)，只要內(nèi)存足夠多，table可以容納任意多行的數(shù)據(jù)。
上面的2段文字，一共提到了三個(gè)概念：Table，Table View Cell，Table View，它們之間的關(guān)系如下，Table用來(lái)保存數(shù)據(jù)，Table View用來(lái)顯示當(dāng)前可見的Table中的數(shù)據(jù)（也就是iphone屏幕中顯示的那些數(shù)據(jù)），Table View Cell就是當(dāng)前可見的Table View中的那一行，這樣說(shuō)可能還不是最清楚，那么看下面的圖，你就可以有一個(gè)比較直觀的認(rèn)識(shí)了。 
ios的設(shè)計(jì)是很注重資源的節(jié)省的，這樣做的好處就是能夠是程序運(yùn)行的盡可能的快，給用戶更好的體驗(yàn)，因此一些不需要的東西，ios是堅(jiān)決不會(huì)顯示或者生成的，在Table Views中，只有當(dāng)前瀏覽到的數(shù)據(jù)，會(huì)生成table view cell，然后顯示，沒(méi)有瀏覽到的數(shù)據(jù)，不會(huì)生成多余的cell，而且當(dāng)一個(gè)cell移除屏幕后，這個(gè)cell會(huì)給進(jìn)入屏幕的數(shù)據(jù)繼續(xù)使用，因此，生成的cell的數(shù)量會(huì)是固定的，不會(huì)多不會(huì)少，正好夠在table view中顯示。
和前一篇Pickers一樣，Table Views也使用delegate：UITableViewDelegate，UITableViewDataSource。
另外，Table Views只有一列，每行只有一個(gè)cell，每個(gè)cell可以包含一張圖片，一些文字，一個(gè)icon，任意多個(gè)subview（之后都會(huì)有例子，看了就明白了）。
好了，說(shuō)了一些概念性的東西，還是有點(diǎn)小小的枯燥，下面開始coding。
1）創(chuàng)建一個(gè)新的項(xiàng)目，這次選擇Single View application模板，命名為Simple Table 
2）添加Table View控件 
在PRoject navigator中選中BIDViewController.xib，在Object Library中找到上面的Table View控件，拖到view上面，Table View將占滿整個(gè)view（一般來(lái)所，Table View會(huì)占滿整個(gè)view，當(dāng)然必要時(shí)會(huì)空出navigator bar，tool bar，tab bar） 
選中view中的table view，打開Connections Inspector，會(huì)看到很熟悉的dataSource和delegate，這個(gè)在學(xué)習(xí)Picker View的時(shí)候已經(jīng)見到過(guò)，這里的作用和在Picker View中是一樣的。將它們關(guān)聯(lián)到File's Owner 
3）寫code 打開BIDViewController.h，添加如下代碼
#import <UIKit/UIKit.h>@interface BIDViewController : UIViewController <UITableViewDelegate,UITableViewDataSource>@property (strong, nonatomic) NSArray *listData;@end有沒(méi)有很熟悉的感覺(jué)，Table View的協(xié)議（protocols）和Picker View的是一樣的，然后聲明一個(gè)NSArray來(lái)存放數(shù)據(jù)。
打開BIDViewController.m，添加如下代碼
#import "BIDViewController.h"@implementation BIDViewController@synthesize listData;- (void)didReceiveMemoryWarning{ [super didReceiveMemoryWarning]; // Release any cached data, images, etc that aren't in use.}#pragma mark - View lifecycle- (void)viewDidLoad{ [super viewDidLoad]; // Do any additional setup after loading the view, typically from a nib. NSArray *array = [[NSArray alloc] initWithObjects:@"Sleepy", @"Sneezy", @"Bashful", @"Happy", @"Doc", @"Grumpy", @"Dopey", @"Thorin", @"Dorin", @"Nori", @"Ori", @"Balin", @"Dwalin", @"Fili", @"Kili", @"Oin", @"Gloin", @"Bifur", @"Bofur", @"Bombur", nil]; self.listData = array;}- (void)viewDidUnload{ [super viewDidUnload]; // Release any retained subviews of the main view. // e.g. self.myOutlet = nil; self.listData = nil;}#pragma mark -#pragma mark Table View Data Source Methods- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section{ return [self.listData count];}- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath { static NSString *SimpleTableIdentifier = @"SimlpeTableIdentifier"; UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:SimpleTableIdentifier]; if(cell == nil) { cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:SimpleTableIdentifier]; } NSUInteger row = [indexPath row]; cell.textLabel.text = [listData objectAtIndex:row]; return cell;}
......這里面需要解釋的就是2個(gè)dataSource方法，其他的方法都簡(jiǎn)單，在這里就不過(guò)多解釋了： tableView:numberOfRowsInSection：用來(lái)告訴table view在Section中有多少個(gè)數(shù)據(jù)（listData中的數(shù)據(jù)個(gè)數(shù)），這里有一個(gè)Section的概念，暫且先不用理會(huì)，我們這個(gè)例子中只有1個(gè)Section，因此直接返回listData中的數(shù)據(jù)個(gè)數(shù)即可（Section的概念下一篇會(huì)介紹） tableView:cellForRowAtIndexPath：當(dāng)table view需要?jiǎng)?chuàng)建一個(gè)cell時(shí)，會(huì)調(diào)用該方法。這個(gè)方法稍微有點(diǎn)復(fù)雜，但也不是很難理解，首先聲明了一個(gè)靜態(tài)的字符串SimpleTableIdentifier，這個(gè)字符串作為一個(gè)key用來(lái)標(biāo)識(shí)UITableViewCell的類型，凡是cell擁有這個(gè)key，就可以認(rèn)為他們是同一種類型的cell，相互之間可以任意使用。前面已經(jīng)說(shuō)過(guò)，一個(gè)Table View在同一時(shí)間只會(huì)創(chuàng)建一定數(shù)量的Table View Cell（夠用就好），因此當(dāng)一個(gè)cell移出屏幕后，這個(gè)cell會(huì)被放入一個(gè)隊(duì)列，等待其他即將顯示的數(shù)據(jù)使用。接下來(lái)的一句語(yǔ)句 UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:SimpleTableIdentifier]; 就是通過(guò)剛才的key來(lái)尋找可重復(fù)使用的Table View Cell。 如果沒(méi)有可重復(fù)使用的cell（cell == nil），那么就需要?jiǎng)?chuàng)建一個(gè)新的cell cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault //設(shè)定cell顯示的樣式 reuseIdentifier:SimpleTableIdentifier]; //設(shè)置標(biāo)示符SimpleTableIdentifier（設(shè)置key），這樣以后這個(gè)cell才可以被制定的key找到并重復(fù)使用。 cell創(chuàng)建完成后，需要設(shè)置顯示的文字 NSUInteger row = [indexPath row]; //通過(guò)indexPath找到現(xiàn)在顯示第幾行的數(shù)據(jù) cell.textLabel.text = [listData objectAtIndex:row]; //得到行號(hào)后再去listData中找到相應(yīng)的數(shù)據(jù)，并復(fù)制給cell的屬性textLabel。 這些都設(shè)置好后，返回cell即可
4）編譯運(yùn)行 希望上面的解釋大家都能夠看懂，然后command+B，command+R編譯運(yùn)行程序，效果如下 
5）添加圖片 可以為每個(gè)cell添加一張圖片，并顯示在cell的左邊，首先下載下面的圖片：Star.png 然后將圖片拖到Project navigator中，放在Simple Table文件夾下 打開BIDViewController.m，在剛才添加的tableView:cellForRowAtIndexPath方法中添加如下代碼
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath { static NSString *SimpleTableIdentifier = @"SimlpeTableIdentifier"; UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:SimpleTableIdentifier]; if(cell == nil) { cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:SimpleTableIdentifier]; } UIImage *image = [UIImage imageNamed:@"star.png"]; cell.imageView.image = image; NSUInteger row = [indexPath row]; cell.textLabel.text = [listData objectAtIndex:row]; return cell;}好了，在此編譯code并運(yùn)行，效果如下 
很簡(jiǎn)單吧，如果當(dāng)我們選中table view中的一行，想換一張圖片，表示選中的狀態(tài)，進(jìn)行如下操作 添加一張選中狀態(tài)的圖片到Simple Table文件夾下：Star2.png 打開BIDViewController.m，在tableView:cellForRowAtIndexPath方法中添加如下代碼
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath { static NSString *SimpleTableIdentifier = @"SimlpeTableIdentifier"; UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:SimpleTableIdentifier]; if(cell == nil) { cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:SimpleTableIdentifier]; } UIImage *image = [UIImage imageNamed:@"star.png"]; cell.imageView.image = image; UIImage *image2 = [UIImage imageNamed:@"star2.png"]; cell.imageView.highlightedImage = image2; NSUInteger row = [indexPath row]; cell.textLabel.text = [listData objectAtIndex:row]; return cell;}編譯運(yùn)行，效果如下 
當(dāng)我們選中一行row的時(shí)候，圖片發(fā)生了變化，UITableViewCell的屬性imageView.image用來(lái)設(shè)置一般狀態(tài)下的圖片，imageView.highlightedImage用來(lái)設(shè)置選中狀態(tài)下的圖片，如果不設(shè)置，將繼續(xù)使用一般狀態(tài)下的圖片。
6）UITableViewCell的Style 在介紹style之前，先看看UITableViewCell自帶的3個(gè)屬性，其中2個(gè)我們?cè)谥暗睦又幸呀?jīng)使用到，分別是TextLabel和imageView，第三個(gè)屬性是detailTextLabel，看下面的例子，就知道這個(gè)detailTextLabel是什么東東了，還是打開BIDViewController.m，在tableView:cellForRowAtIndexPath方法中添加如下代碼
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath { static NSString *SimpleTableIdentifier = @"SimlpeTableIdentifier"; UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:SimpleTableIdentifier]; if(cell == nil) { cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:SimpleTableIdentifier]; } UIImage *image = [UIImage imageNamed:@"star.png"]; cell.imageView.image = image; UIImage *image2 = [UIImage imageNamed:@"star2.png"]; cell.imageView.highlightedImage = image2; NSUInteger row = [indexPath row]; cell.textLabel.text = [listData objectAtIndex:row]; if (row < 7) cell.detailTextLabel.text = @"Mr. Disney"; else cell.detailTextLabel.text = @"Mr. Tolkien"; return cell;}編譯運(yùn)行 
有沒(méi)有發(fā)現(xiàn)什么變化也沒(méi)有？這是因?yàn)槭怯脕?lái)UITableViewCellStyleDefault樣式造成的，UITableViewCell一共有4種樣式，在tableView:cellForRowAtIndexPath方法中，創(chuàng)建cell的時(shí)候設(shè)置initWithStyle，就是cell的樣式。
cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:SimpleTableIdentifier];現(xiàn)在換一種樣式看看，將上面代碼中的UITableViewCellStyleDefault改成UITableViewCellStyleSubtitle，在編譯運(yùn)行看一下效果 
這次效果對(duì)了，所有的3個(gè)屬性都顯示出來(lái)了。
總結(jié)一下所有4個(gè)UITableViewCell的樣式 UITableViewCellStyleDefault 
UITableViewCellStyleSubtitle 
UITableViewCellStyleValue1 
UITableViewCellStyleValue2 
最后別忘了還是將樣式設(shè)置回UITableViewCellStyleDefault，之后的例子還是以這個(gè)樣式為例子的
7）UITableViewCell的縮進(jìn) 打開BIDViewController.m，添加如下代碼
#pragma mark -#pragma mark Table Delegate Methods- (NSInteger)tableView:(UITableView *)tableView indentationLevelForRowAtIndexPath:(NSIndexPath *)indexPath { NSUInteger row = [indexPath row]; return row;}tableview:indentationLevelForRowAtIndexPath這個(gè)方法用于設(shè)置縮進(jìn)的級(jí)別，使用indexPath取得當(dāng)前row是在第幾行，然后根據(jù)第幾行來(lái)設(shè)置縮進(jìn)的大小。注意，這個(gè)方法是table view的delegate方法，之前用到的方法都是dataSource方法。
編譯運(yùn)行 
8）UITableViewCell的選擇事件 UITableViewCell的選擇事件有2種，一種在選中一行之前發(fā)生的事件，叫做tableView:willSelectRowAtIndexPath，另一個(gè)方法就是選中一行后發(fā)生的事件，叫做tableView:didSelectRowAtIndexPath，他們都是table view的delegate方法，在BIDViewController.m中添加如下code
- (NSIndexPath *)tableView:(UITableView *)tableView willSelectRowAtIndexPath:(NSIndexPath *)indexPath { NSUInteger row = [indexPath row]; if (row == 0) { return nil; } return indexPath;}- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath { NSUInteger row = [indexPath row]; NSString *rowValue = [listData objectAtIndex:row]; NSString *message = [[NSString alloc] initWithFormat:@"You selected %@", rowValue]; UIAlertView *alert = [[UIAlertView alloc] initWithTitle:@"Row Selected!" message:message delegate:nil cancelButtonTitle:@"Yes I Did" otherButtonTitles:nil]; [alert show];}在tableView:willSelectRowAtIndexPath中，根據(jù)indexPath來(lái)獲得即將選中的是哪一行，然后判斷如果即將選中的row是第一行，則返回nil，使其無(wú)法選中，如果不是，則返回indexPath。
在tableView:didSelectRowAtIndexPath中，根據(jù)indexPath來(lái)獲得選中的是哪一行，然后讀取這一行的數(shù)據(jù)（其實(shí)是根據(jù)行號(hào)到NSArray中找到相應(yīng)的數(shù)據(jù)），然后顯示出來(lái)。
編譯運(yùn)行，試著選擇第一行，是不會(huì)有反應(yīng)的，然后選擇其他行，一個(gè)警告框會(huì)彈出 
9）更改UITableViewCell的字體大小和行的高度 還是在tableView:cellForRowAtIndexPath中，添加如下代碼
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath { static NSString *SimpleTableIdentifier = @"SimlpeTableIdentifier"; UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:SimpleTableIdentifier]; if(cell == nil) { cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:SimpleTableIdentifier]; } UIImage *image = [UIImage imageNamed:@"star.png"]; cell.imageView.image = image; UIImage *image2 = [UIImage imageNamed:@"star2.png"]; cell.imageView.highlightedImage = image2; NSUInteger row = [indexPath row]; cell.textLabel.text = [listData objectAtIndex:row]; cell.textLabel.font = [UIFont boldSystemFontOfSize:50]; if (row < 7) cell.detailTextLabel.text = @"Mr. Disney"; else cell.detailTextLabel.text = @"Mr. Tolkien"; return cell;}將字體的大小設(shè)置成50，編譯運(yùn)行 
字體是變大了，但是行高太小，以至于字符無(wú)法顯示完整，我們需要調(diào)整行高，添加一個(gè)新的table view的delegate，如下
- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath { return 70;}tableView:heightForRowAtIndexPath用來(lái)設(shè)置行高，因?yàn)槭菍⑦@個(gè)table view的行高進(jìn)行統(tǒng)一設(shè)置，所以直接返回高度即可，如果需要針對(duì)某些行進(jìn)行調(diào)整，那么就需要通過(guò)indexPath來(lái)獲得第幾行，然后在進(jìn)行行高的設(shè)置
編譯運(yùn)行 
ok，現(xiàn)在和諧了。
10）總結(jié) 這篇是Table View的入門學(xué)習(xí)，學(xué)習(xí)了Table View中最最基礎(chǔ)的一些東西，讀取顯示數(shù)據(jù)，添加圖片，cell的樣式，縮進(jìn)，字體大小，行高等等的一些基礎(chǔ)內(nèi)容，后一篇的內(nèi)容會(huì)講到自定義Table View Cell的內(nèi)容，難度有所加深，但總得來(lái)說(shuō)還是很簡(jiǎn)單的。反正IOS學(xué)習(xí)到現(xiàn)在，給我的感覺(jué)似乎是越來(lái)越容易，很多東西開始變得容易上手了，很多概念都是融會(huì)貫通的，大家繼續(xù)努力加油啊，謝謝大家的一直關(guān)注，我也會(huì)繼續(xù)努力的，謝謝！
新聞熱點(diǎn)
疑難解答
圖片精選
網(wǎng)友關(guān)注
