一、表視圖的介紹
1、表視圖和其他視圖一樣,它是iOS中最重要的試圖,很多應用程序都會使用到,表只是一個容器,要想顯示內容,必須提供信息。
2、表試圖里面可以放很多行信息,使用表視圖可以顯示一個單元格列表,每個單元格列表都包含大量的信息,但仍然是一個整體。并且可以將表視圖劃分為多個區(section),以遍從視覺上將信息分組。表視圖控制器是一種只能顯示表視圖的標準視圖控制器,可以在表視圖占據整個視圖時使用這種控制器。
3、表視圖的兩種風格(或者說外觀)
1)普通風格(或者叫無格式,它不像分組表那樣在視覺上將各個區分開,但通常帶可觸摸的索引(類似于通訊錄),有時又稱他們為索引表)
UITableViewStylePlain(段里面較多數據可以保持段頭保持不動)
2)分組風格(分組)
UITableViewStyleGrouped
3)UITableViewStylePlain和UITableViewStyleGrouped。這兩者操作起來其實并沒有本質區別,只是后者按分組樣式顯示前者按照普通樣式顯示而已。
二、表視圖的基本結構
1、表視圖有表頭、表尾、中間一連串單元格試圖組成 (表頭,設置單元格視圖,表尾)
1)設置表頭 tableHeaderView (其實就是建一個label)
例如 :給tableView設置表頭
UILabel *headerLable = [[UILabel alloc]initWithFrame:CGRectMake(0, 0, 0, 60)];
headerLable.textAlignment = NSTextAlignmentCenter;//表頭設置在中間
headerLable.text = @"五期聯系人";
headerLable.backgroundColor = [UIColor cyanColor];
tableView.tableHeaderView = headerLable;
2)設置單元格試圖(每個單元格都有獨特的標示符,也成為重標示符,(reuse)用于在編譯時引用單元格;配置表視圖時,必須使用這些標示符)
UITableViewCell,單元格也可以分段顯示,每一段都可以通過代理設置段頭和段尾
3)設置表尾 tableFooterView
例如:給tableView設置表尾
UILabel *footterLable = [[UILabel alloc]initWithFrame:CGRectMake(0, 0, 0, 60)];
footterLable.textAlignment = NSTextAlignmentCenter;
footterLable.text = @"未來由我創,愛拼才會贏.";
footterLable.backgroundColor = [UIColor clearColor];
tableView.tableFooterView = footterLable;
- tableView的常用屬性和方法(每個屬性都有舉例)如果是建立的UITabelView 表達時用 它的對象加 屬性名字,如果是基于UITableViewController,則運用屬性直接用self.加屬性名字
1. 設置表視圖分割線風格
@property(nonatomic) UITableViewCellSeparatorStyle separatorStyle;
例如:
self.tableView.separatorStyle = UITableViewCellSeparatorStyleSingleLine;
self.tableView.separatorColor = [UIColor cyanColor];
2. 設置表視圖分割線顏色,默認標準灰色
@property(nonatomic,retain) UIColor *separatorColor;
例如:tableView.separatorColor = [UIColor redColor];
3.設置表視圖的頭部視圖
@property(nonatomic,retain) UIView *tableHeaderView;
例如:給tableView設置表頭
UILabel *headerLabel = [[UILabel alloc]initWithFrame:CGRectMake(0, 0, 0, 100)];
headerLabel.textAlignment = NSTextAlignmentCenter;
headerLabel.text = @"寧做雞頭不做鳳尾";
headerLabel.textColor = [UIColor whiteColor];
headerLabel.backgroundColor = [UIColor clearColor];
tableView.tableHeaderView = headerLabel;
4. 設置表視圖的尾部視圖
@property(nonatomic,retain) UIView *tableFooterView;
例如: 給tableView設置表尾
UILabel *footerLabel = [[UILabel alloc]initWithFrame:CGRectMake(0, 0, 0, 100)];
footerLabel.textAlignment = NSTextAlignmentCenter;
footerLabel.text = @"愛咋咋地";
footerLabel.textColor = [UIColor whiteColor];
footerLabel.backgroundColor = [UIColor clearColor];
tableView.tableFooterView = footerLabel;
5.設置表視圖單元格的行高
@property(nonatomic) CGFloat rowHeight;
例如:
tableView.rowHeight = 100;
6.設置表視圖背景
@property(nonatomic, readwrite, retain) UIView *backgroundView
例如:
tableView.backgroundView = [[UIImageView alloc]initWithImage:[UIImage imageNamed:@"apple.jpg"]];//后面是圖片名字
7.刷新表視圖單元格中數據
- (void)reloadData;
8.顯示指示條
showsVerticalScrollIndicator
9 設置表視圖section頭部行高
@property(nonatomic) CGFloat sectionHeaderHeight;
-(CGFloat)tableView:(UITableView *)tableView heightForHeaderInSection:(NSInteger)section
{
return 40;
}
10. 設置表視圖section尾部部行高
@property(nonatomic) CGFloat sectionFooterHeight
-(CGFloat)tableView:(UITableView *)tableView heightForFooterInSection:(NSInteger)section
{
return 40;
}
三、單元格的顯示
1、單元格的位置表示
NSIndexPath:能表示當前cell是tableView的第幾段第幾行
2、單元格的創建(必須有一個標識符)
UITableViewCell * cell = [[UITableViewCell alloc]initWithStyle:UITableViewCellStyleDefault reuseIdentifier:cellID];
cell的樣式
1)UITableViewCellStyleDefault
左側顯示textLabel,imageView顯示在最左邊
2)UITableViewCellStyleValue1
左側顯示textLabel、右側顯示detailTextLabel,imageView顯示在最左邊
3)UITableViewCellStyleValue2
左側依次顯示textLabel(默認藍色)和detailTextLabel,imageView可選
4)UITableViewCellStyleSubtitle
左上方顯示textLabel,左下方顯示detailTextLabel,imageView顯示在最左邊
cell的輔助圖標 accessoryType (accessory |?k?ses?ri| 輔助,附加的)
1) 不顯示任何圖標
UITableViewCellAccessoryNone,
2) 跳轉指示圖標
UITableViewCellAccessoryDisclosureIndicator
3) 內容詳情圖標和跳轉指示圖標
UITableViewCellAccessoryDetailDisclosureButton
4) 勾選圖標
UITableViewCellAccessoryCheckmark
5) 內容詳情圖標
UITableViewCellAccessoryDetailButton
5) 自定義輔助圖標
accessoryView屬性
3、cell的常用屬性
1)設置cell的背景試圖
backgroundView
2)設置選中的cellbei的背景圖片
selectedBackgroundView
cell.selectedBackgroundView = [[UIImageView alloc]initWithImage:[UIImage imageNamed:@"tableCell"]];
3) 設置選中時的樣式
selectionStyle
4.UItableView表中的每一行都由一個UItableViewCell表示可以用一個圖像,一些文本,一個可選擇的輔助圖標來配置每個UItableViewCell對象,UItableViewCell為每個cell定義了如下的所示的屬性
1). textLable:Cell的主文本標簽(一個UILable的對象)
2). detailTextLable :cell的二級文本標簽,當需要添加額外細節時(一個UILable對象)
3) . imageView :一個用來裝載圖片的圖片視圖
5.UItableView 必須實現的3個核心方法(段數,行,建立一個cell)
1).段的數量,返回表視圖劃分多少個分區(這個方法可以分段顯示或者單個列表顯示我們的數據)不寫代表一行
-(NSInteger)numberOfSectionsInTableView:(UITableView *)tableView
2).設置某段行的數量 //返回給定分區有多少行,分區編號從0開始(不同的分段返回不同的行數可以用switch來做,如果是單個列表,就返回單個想要的函數即可)
-(NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section
3).- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath//返回一個經過正確配置的單元格對象,用于顯示在表視圖的指定位置(通過我們索引的路徑section和row來確定)
四、代理方法(UITableViewDelegate)
1、一般是處理表視圖基本樣式(單元格高度)以及捕捉選中單元格事件
2、常用代理方法(下面的返回值都是數字)
1)配置行高
- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath;
2)設置section 頭部、尾部視圖的高度(段頭,段尾)
- (CGFloat)tableView:(UITableView *)tableView heightForHeaderInSection:(NSInteger)section;
- (CGFloat)tableView:(UITableView *)tableView heightForFooterInSection:(NSInteger)section;
3)自定義section頭部、尾部視圖,注意:需要指定高度
1.- (UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section;
例如:
//自定義段頭
- (UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section{
UILabel *label = [[UILabel alloc]initWithFrame:CGRectMake(0, 0, 0, 50)];
NSString *title = dataArray[section][@"title"];
label.text = title;
label.backgroundColor = [UIColor redColor];
label.textAlignment = NSTextAlignmentCenter;//把自定義的段頭段位放到中間
return label;
}
//自定義段尾
- (UIView *)tableView:(UITableView *)tableView viewForFooterInSection:(NSInteger)section;
- (UIView *)tableView:(UITableView *)tableView viewForFooterInSection:(NSInteger)section{
UILabel *label = [[UILabel alloc]initWithFrame:CGRectMake(0, 0, 0, 50)];
NSString *title = dataArray[section][@"trail"];
label.text = title;
label.backgroundColor = [UIColor redColor];
label.textAlignment = NSTextAlignmentCenter;
return label;
}
4)用戶單擊單元格中輔助按鈕時,調用該方法
- (void)tableView:(UITableView *)tableView accessoryButtonTappedForRowWithIndexPath:(NSIndexPath *)indexPath;
5)用戶單擊單元格,調用該方法(五六很像,大家要區分開)
- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath;
6)取消選中單元格時,調用該方法
- (void)tableView:(UITableView *)tableView didDeselectRowAtIndexPath:(NSIndexPath *)indexPath NS_AVAILABLE_IOS(3_0);
7)設置單元格編輯樣式
- (UITableViewCellEditingStyle)tableView:(UITableView *)tableView editingStyleForRowAtIndexPath:(NSIndexPath *)indexPath;
8).創建lable時帶的一些屬性
//給label指定內容
cell.textLabel.text = self.dataArray[indexPath.row];
//給label的內容設置字體和大小
cell.textLabel.font = [UIFont fontWithName:self.dataArray[indexPath.row] size:20];
cell.textLabel.textColor = [UIColor whiteColor];
cell.backgroundColor = [UIColor clearColor];
9).懶加載
當用到某一個對象的時候,才創建這個對象
- (NSArray *)dataArray
{
if (_dataArray == nil) {
_dataArray = [NSArray array];
}
return _dataArray;
}