UITableView詳解(UITableViewCell(一)重中之重) · iOS UI

**一.UITableView概述** 1.UITableView繼承自UIScrollView，可以表現為Plain和Grouped兩種風格(具體區別的話大家可以自行試驗,區別還是蠻大,不過因為iOS7扁平化的效果,感覺沒6顯示的區別大)： ~~~ typedefNS_ENUM(NSInteger, UITableViewStyle) { UITableViewStylePlain,? ? ? ? ? ? ? ? ?// regular table view UITableViewStyleGrouped ? ? ? ? ? ? ? ?// preferences style table view }; ~~~ 2.因為繼承UIScrollView,因此也支持滾動,可以分區(組)顯示內容,其中分區成為section,行成為row 3.frame決定tableView顯示的位置和邊框,每一行的位置都會放一個UITableView負責顯示行的內容 4.style樣式(參照第一條) ? // ? 分割線樣式 separatorStyle ? // ? 分割線顏色 separatorColor ? // 行高 ? rowHeight ? ?// ? 控制代理 ?delegate ? ?// ? 數據代理 ?dataSource ?// ?與邊框的分隔距離設置separatorInset **二.UITableView基本配置** @主要是通過2個協議:UITableViewDataSource和UITableViewDelegate 1.dataSource是UITableViewDataSource類型，主要為UITableView提供顯示用的數據(UITableViewCell)，指定UITableViewCell支持的編輯操作類型(insert，delete和eordering)，并根據用戶的操作進行相應的數據更新操作，如果數據沒有更具操作進行正確的更新，可能會導致顯示異常，甚至crush。 2.delegate是UITableViewDelegate類型，主要提供一些可選的方法，用來控制tableView的選擇、指定section的頭和尾的顯示以及協助完成cell的刪除和排序等功能。 UITableView *tableView = [[UITableView alloc] initWithFrame:self.view.frame style:UITableViewStylePlain]; (我的編輯環境都是支持ARC的) // 設置tableView的數據源 ? tableView.dataSource = self; ? // 設置tableView的委托 ? tableView.delegate = self; ? // 設置tableView的背景圖 ? tableView.backgroundView = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"humingtao.png"]]; ?** @一個UIView中可以有多個UITableView,我們這里先舉例就一個UITableView,所以配置時,沒用到(UITableView *)tableView這個參數,直接返回值了 @protocol UITableViewDataSource ~~~ // ?可選,默認是返回1,1個分區 -(NSInteger)numberOfSectionsInTableView:(UITableView *)tableView{ return 4; // 這里將UITableView分成4個分區 } ~~~ // 下面2個方法都是完成配置必須實現的(引申,OC中的協議相當于JAVA中的接口,只不過,如果引用JAVA中的接口,則必須實現它的全部方法,在OC中則不用) ~~~ -(NSInteger)tableView:(UITableView)tableView?numberOfRowsInSection:(NSInteger)section{ ? ? // 設置每個section的row數量(都是從0下標開始) if (section == 0) { ? ? ? ? return 10; } if (section == 1) { return 5; } if (section == 2) { return 5; } return 7; } ~~~ // 用于設置每個row上面的cell,其中indexPath 索引路徑-->兩個屬性:section and ?row -(UITableViewCell)tableView:(UITableView)tableView?cellForRowAtIndexPath:(NSIndexPath)indexPath{ // UITableViewCell的重用機制,將在下一章進行詳細分析 // cell的重用標識(不是很懂,不知道是不是為了標識各種不同的cell) static NSString * cellIdentifier ?= @"cell"; // 從重用隊列中取出cell對象 UITableViewCell * cell = [tableView dequeueReusableCellWithIdentifier:cellIdentifier]; // 如果沒有,則創建(解釋:一般剛進入界面的時候,是不需要重用的,當時顯示的是能夠映入界面的足夠的cell,只有拖動的時候,才需要) ~~~ if (!cell) { cell = [[UITableViewCell alloc] initWithStyle:(UITableViewCellStyleDefault) reuseIdentifier:cellIdentifier]; } if (indexPath.section == 1) { cell.imageView.image = [UIImage imageNamed:@"image1.png"]; }else{ cell.imageView.image = [UIImage imageNamed:@"image.png"]; } if (indexPath.row == 1) { cell.textLabel.text = @"我是個小小小小菜鳥"; }else{ cell.textLabel.text = @"我是個大大大大傻逼"; } return cell; } ~~~ //section頭的title(例如,通訊錄不同姓名標識) -(NSString)tableView:(UITableView)tableView?titleForHeaderInSection:(NSInteger)section{ return [NSString stringWithFormat:@"%i",section+1]; } //section尾段的title? -(NSString)tableView:(UITableView)tableView?titleForFooterInSection:(NSInteger)section{ return @"失戀者聯盟"; } //section索引的title集合(例如,通訊錄索引,幫助快速找到姓名) -(NSArray *)sectionIndexTitlesForTableView:(UITableView *)tableView{ return [NSArray arrayWithObjects:@"A", @"B",@"C",@"D",@"E",@"F",@"G",@"H",nil]; } **@protocol UITableViewDelegate** // 設置cell行高(因為參數是indexPath,所以可以設置不同section的行高,也能設置同一section不容row的行高)** -(CGFloat)tableView:(UITableView)tableView?heightForRowAtIndexPath:(NSIndexPath)indexPath{ return 80; } // section頭部的height -(CGFloat)tableView:(UITableView?*)tableView?heightForHeaderInSection:(NSInteger)section{ } // section尾部的height -(CGFloat)tableView:(UITableView)tableView?heightForFooterInSection:(NSInteger)section{ } // section頭部的view -(UIView)tableView:(UITableView)tableView?viewForHeaderInSection:(NSInteger)section{ } // section尾部的view -(UIView)tableView:(UITableView)tableView?viewForFooterInSection:(NSInteger)section{ } // cell的縮進級別 -(NSInteger)tableView:(UITableView)tableView?indentationLevelForRowAtIndexPath:(NSIndexPath)indexPath{ } **三.UITableViewCell(label,button等是添加在"*contentView*"屬性上,切記)** 1.系統提供的UITableView也包含了四種風格的布局，分別是: typedef enum { ? ? UITableViewCellStyleDefault, ? ? UITableViewCellStyleValue1, ? ? UITableViewCellStyleValue2, ? ? UITableViewCellStyleSubtitle } UITableViewCellStyle; ![](https://box.kancloud.cn/2016-01-12_5694d74bafa72.jpg) 2.下面我們看一下cell在正常狀態下和編輯狀態下的構成圖：** ![](https://box.kancloud.cn/2016-01-12_5694d751650ec.jpg) 3.cel的屬性 ![](https://box.kancloud.cn/2016-01-12_5694d75181e21.jpg) 其中,cell.accessoryType = ?UITableViewCellAccessoryCheckmark ? ? 對應上圖第三個標識 cell.accessoryType = ?UITableViewCellAccessoryDisclosureIndicator 對應上圖第一個標識** cell.accessoryType = UITableViewCellAccessoryDetailDisclosureButton 對應上圖第二個標識 4.cell的一些控制方法 //輔助button點擊 -(void)tableView:(UITableView)tableView?accessoryButtonTappedForRowWithIndexPath:(NSIndexPath)indexPath{ } // cell將要被選中 -(NSIndexPath)tableView:(UITableView)tableView?willSelectRowAtIndexPath:(NSIndexPath)indexPath{ } // cell被選中 -(void)tableView:(UITableView)tableView?didSelectRowAtIndexPath:(NSIndexPath)indexPath{ [tableView?deselectRowAtIndexPath:indexPath?animated:YES]; ? // 選中cell后,高亮狀態立馬就消失 } // cell將要被取消選中 -(NSIndexPath)tableView:(UITableView)tableView?willDeselectRowAtIndexPath:(NSIndexPath)indexPath?NS_AVAILABLE_IOS(3_0){ } // cell被取消選中 -(void)tableView:(UITableView)tableView?didDeselectRowAtIndexPath:(NSIndexPath)indexPath?NS_AVAILABLE_IOS(3_0){ } // 選擇cell滑動出現[delete]按鈕 -(void)tableView:(UITableView)tableView?commitEditingStyle:(UITableViewCellEditingStyle)editingStyle forRowAtIndexPath:(NSIndexPath)indexPath ? { NSLog(@"刪除"); ? } **@就是當往上滑動UITableview的時候廣告條也跟著往上滑動，剛開始以為那個廣告得單獨定義一個scrollview，現在才知道uitableview有個?tableHeaderView 這個屬性，我們只需要設置tableHeaderView 這個屬性就可以，就可以實現廣告條跟著滾動的，想實現點擊關閉按鈕后廣告條消失，只需要將?tableHeaderView 設為 nil 即可 ?，即?mytableview.tableHeaderView = nil;原來如此簡單** //根據indexPath獲取cell對象 **@-(UITableViewCell)cellForRowAtIndexPath:(NSIndexPath)indexPath;** **//獲取tableview正在window上顯示的cell的indexPath** **@- (NSArray)indexPathsForVisibleRows;** **@隱藏多余的分割線** ~~~ -(void)_setExtraCellLineHidden:(UITableView)tableView{ UIView view =[ [UIView alloc]init]; view.backgroundColor= [UIColor clearColor]; [tableView setTableFooterView:view]; } ~~~ ***@根據indexPath定位tableView的位置*** ~~~ NSIndexPath * indexPath = [NSIndexPath indexPathForRow:row inSection:section]; [_tableView scrollToRowAtIndexPath:indexPath atScrollPosition:UITableViewScrollPositionTop animated:YES]; ~~~ `<span class="pun" style="margin: 0px; padding: 0px; border: 0px; vertical-align: baseline; background: transparent;"> </span>`