UI基础之----UITableView 详解(初级)
一 UITabelView 基础属性
1. 表视图 UITableView,iOS中重要的视图.
表视图通常用来管理一组具有相同数据结构的数据.
2. UITable 继承自UIScrollView, 所以可以滚动.
表视图的每一条数据都是显示在 UITableViewCell 对象中.
表视图的每一条数据都是显示在 UITableViewCell 对象中.
表视图可以分区显示数据,每个分区称为一个section,每一行称为 row, 编号都是从0开始.
3. UITableView 可以有多个分区(section)[相当于我们班中的分组],每个分区里 又有很多行(row)[相当于分分组里的组员]
二 表视图的创建及显示数据
1. 创建 UITableView 对象
UITableView*tableView = [[UITableView alloc]initWithFrame:[UIScreen mainScreen].boundsstyle:UITableViewStylePlain];
表视图的style有两种样式:UITableViewStylePlain
UITableViewStyleGrouped(主要用于分组)
2. 设置表的行高
tableView.rowHeight =80;
3. 设置表分割线颜色
tabelView.separatorColor= [UIColor brownColor];
4. 设置分割线的样式
tableViewseparatorStyle= UITableViewCellSeparatorStyleSingleLine;(有三种样式)
5. 设置分割线的边界(上,左,下,右)逆时针的方向
tableView.separatorInset= UIEdgeInsetsMake(0,0,0,0);
6. 表视图的表头(tableHeaderView)
定义一个 UIView 对象;表头视图很重要,一般会在这里放置轮播图
UIView *view =[[UIView alloc]initWithFrame:CGRectMake(0,0,320,50)];
view.backgroundColor= [UIColor greenColor];
tableView.tableHeaderView = view; [view release];
7. 表视图的表尾(tableFooterView)
表头和表尾,当表里面没有内容的时候,只会显示表头视图和表尾视图.(紧挨在一起)
定义一个视图作为 cell 的下角
UIView *view =[[UIIView alloc]initWithFrame:CGRectMake(0,0,230,50)];
view.backgroundColor= [UIColor redColor];
tableView.tableFooterView= view;
[view release];
表视图如果没有内容,如何将那些没有内容的 Cell去除(快速去除的方法)
tableView.tableFooterView = [[[UIView alloc]init]autorelease];
8. 表视图的数据源属性(VVIP)配置数据源代理
1> 指定数据源的代理对象
tableView.delegate =self;
2> 遵循数据源代理的协议
在类中
3> 实现数据源协议中的方法
① 配置tableView 每个分区对应的行数
-(NSInteger)tableView: (UITableView *)tableView numberOfRowsInSection
:(NSInteger)section;
② 用来创建每一行上的内容的方法(需要借助于 UITabelViewCell)
-(UITabelViewCell*)tableView: (UITableView *)tableView cellForRowAtIndexPath: (NSIndexPath*)indexPath;
③ NSIndexPath 继承自 NSobject,用于存储 cell 所在的存储分区和在分区中的行数(包括 section 和 row)
④ 可以使用下面的方法进行查看
NSIndexPath *index = [NSIndexPath indexPathForRow:0 inSection:1];
NSLog(@”%ld %ld”,index.section,index.row);
⑤ 如何重用创建的 cell, 而且节约内存呢?
表视图中提供了表视图的重用机制.(即出屏幕的 cell会被添加到 mutableSet中,进入屏幕的 cell,先从 set中获取,如果获取不到,才创建一个 cell.在 cell 显示之前,给 cell赋上相应的内容)
cell 的 reuseldentifier是重用的关键.
⑥ 重用机制的具体实现过程:
1> 创建重用 cell 的标志
static NSString*indentifier = @”cell”; //静态去中的数据,第一次初始化之后,值不在改变
2> 根据重用标志去重用队列中取cell
UITableViewCell *cell = [tableViewdequeueReusableCellWithIdentifier: indentifier];
3> 判断是否成功取到cell. 取到的 cell 一定带有标志的,也就是可重用的
if(!cell){ !cell表示取到的值为空
// 创建 cell 对象,这些 cell 都是有标志
cell =[[[UITableViewCell alloc]initWithStyle:UITableViewCellStyleSubtitlereuseIdentifier : indentifier]autorelease];
内存问题:在哪里创建就在那个地方释放,因为当重用池中又 cell的时候,这个判断就不会在执行了,所以在 return cell的时候,不需要再 autorelease 了.
}
⑦ 为 cell 添加图片(imageView)
cell.imageView.image= [UIImage imageNamed:@”0.png”];
⑧ 为 cell 添加 lable
cell.detailTextLable.text= @”27班”;
⑨ 指定 cell 被选中时的效果
cell.selectionStyle =UITableViewCellSelectionStyleDefault;
⑩ 设置辅助视图的样式
cell.accessoryType =UITableViewCellAccessoryDisclosureIndicator;
数据源代理其余的方法
1> 配置 tableView 的分区数,返回值是几,就有几个分组,返回分区的个数
-(NSInteger)numberOfSectionsInTableView:(UITableView *)tableView;
2> 配置每个分区的页眉
-(NSString*)tableView: (UITableView *)tableView titleForHeaderInSection: (NSInteger)section;
3> 配置每个分区的页脚
-(NSString*)tableView: (UITableView *)tableView titleForFooterInSection: (NSInteger)section;
4> 配置 tableView右侧的分区索引(返回一个数组)
-(NSArray *)sectionIndexTitlesForTableView: (UITableView *)tableViw{
return @[@” A”,@”B”,@”C”,@”D”,@”E”];
}
业务代理方法(VIP)
1> 在创建UITableView对象的时候,设置业务代理对象(即在viewDidLoad方法中)
tableView.delegate =self;
2> 在类中遵循代理协议
3> 实现代理中常用的方法
① 当 tableView 的某一行被选中的时候触发.(主要作用是用来添加点击某一行时,跳转界面的功能),是比较常用的方法
-(void)tableView:(UITableView *)tableView didSelectRowAtIndexPath: (NSIndexPath *)indexPath
② 当 tableView: 的某一行取消选中的时候会被触发
- (void)(UITableView*)tableView didDeselectRowAtIndexPath: (NSIndexPath *)indexPath;
③ 返回每一页分组的高度(使用if…….else if…..进行判断)
-(CGFloat)tableView: (UITableView *)tableViewheightForRowAtIndexPath: (NSIndexPath *)indexPath;
代码如下:#import "RootViewController.h"
#import "DetailViewController.h"
@interface RootViewController ()
#warning 设置数据源对象第三步: 遵循数据源协议
#warning 设置代理第二步, 遵循代理协议
@property (nonatomic,retain) NSArray *bigArray;
@property (nonatomic,retain) NSDictionary *dictionary;
@property (nonatomic,retain) NSArray *key;
@end
@implementation RootViewController
- (void)viewDidLoad {
[super viewDidLoad];
//self.view.backgroundColor = [UIColor redColor];
// 定义数组
NSArray *array = @[@"李鲲鹏",@"李学良",@"李晨迪"];
NSArray *array1 = @[@"陈晨",@"陈辰",@"陈殿名",@"陈冠希"];
NSArray *array2 = @[@"王辉",@"王亮",@"王二小",@"王宝强"];
self.bigArray = @[array,array1,array2];
// 定义字典
// 创建字典的时候,使用语法糖 的格式@{key:value,key1:value1,key2:value2}
self.dictionary = @{@"L":array,@"C":array1,@"W":array2};
// 取出字典中的所有 key 值,存放到数组中
NSArray *keyArray = [self.dictionary allKeys];
// 将取出的 key 值排序
self.key = [keyArray sortedArrayUsingSelector:@selector(compare:)];
/*UITableView是iOS 中提供用来展示数据视图的视图.叫做表视图,但是只有一列,而且只能在垂直方向滑动,继承自 UIScrollView
UITableView 可以有多个分区(section)[相当于我们班中的分组],每个分区里又有很多行(row)[相当于分组里的组员]
*/
// 1.创建 UITableView 对象
UITableView *tableView = [[UITableView alloc]initWithFrame:[UIScreen mainScreen].bounds style:UITableViewStylePlain];
//tableView.backgroundColor = [UIColor redColor];
// 2.设置属性
// 2.1设置行高
tableView.rowHeight = 80;
// 2.2设置分割线的样式
tableView.separatorColor = [UIColor brownColor];
// 2.3设置分割线的样式
tableView.separatorStyle = UITableViewCellSeparatorStyleSingleLine;
// 2.4设置分割线边距(上,下,左,右)逆时针方向
tableView.separatorInset = UIEdgeInsetsMake(0, 0, 0, 0);
//2.5 ============表视图===============
// 表视图很重要,一般会在这里放置轮播图
// 创建一个 UIView视图对象
UIView *view = [[UIView alloc]initWithFrame:CGRectMake(0, 0, 320, 50)];
// 给UIView 视图添加背景色
view.backgroundColor = [UIColor greenColor];
// 将创建的视图做为 tableView 的表头(tableHeaderView)属性
tableView.tableHeaderView = view;
[view release];
// 2.6============表尾视图==============
// 表尾,表头,如果表里面没有内容,只会显示表头视图和表尾视图
// 定义一个视图作为cell 的表尾
// UIView *footView = [[UIView alloc]initWithFrame:CGRectMake(0, 0, 320, 50)];
// // 给视图添加背景颜色
// footView.backgroundColor = [UIColor redColor];
// // 将创建的视图 footView 作为tableView 的表尾(tableFootView属性)
// tableView.tableFooterView = footView;
// [footView release];
// 表尾如果没有内容.如何将那些没有内容的 cell 去除
// 快速去除方式
//tableView.tableFooterView = [[[UIView alloc]init]autorelease];
//=========数据源属性===========
// VVIP 配置数据源代理
#warning 设置数据源对象第一步:设置数据源对象
tableView.dataSource = self;
//=========代理属性============
#warning 设置代理第一步, 设置代理对象
// VIP 代理
tableView.delegate = self;
[self.view addSubview:tableView];
[tableView release];
}
#pragma mark ----------- UITableViewDataSouce实现协议的方法----------------
#warning 必须实现的方法
// 配置 tableView 每个分区对应的行数
- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section{
#warning 从数组中获取行数
// 1.计算分区对应的行数 方法一
/* {
if (0 == section) {
NSArray *tempArray = self.bigArray[0];
return tempArray.count;
// 也可以直接 return [self.bigArray[0] count];
}else if (1 == section){
NSArray *tempArray = self.bigArray[1];
return tempArray.count;
// return [self.bigArray[1] count];
}else{
NSArray *tempArray = self.bigArray[2];
return tempArray.count;
// return [self.bigArray[2] count];
}
} */
// 2.计算分区方法 方法二
// NSArray *tempArray = self.bigArray[section];
// return tempArray.count;
#warning 字典中取出数据
// 方法一:
/* {
if (0 == section) {
// 先取出排序后数组中的key 值
NSString *key = self.key[0];
// 使用 key 值取出 字典中 key 值对应的 value 值
NSArray *keyArray = [self.dictionary objectForKey:key];
return keyArray.count;
// return [self.dictionary[key] count];
}else if(1 == section){
NSString *key = self.key[1];
return [self.dictionary[key] count];
}else{
NSString *key = self.key[2];
return [self.dictionary[key] count];
}
}*/
// 方法二:
// 1.从排好的数组中取出 key 值
NSString *key = self.key[section];
// 2.从字典中根据 key 值,取出对应的 value(数组)
return [self.dictionary[key] count];
}
// 用来创建 cell
static int i = 0; // 用来记录 cellForRowAtIndexPath 走的次数
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{
// NSIndexPath 继承自 NSObject,用于存储 cell 所在的存储分区和在分区中的行数(包括 section 和 row)
// 使用下面的方法查看(section 和 row),打印结果中 length 是分组的个数
// NSIndexPath *index = [NSIndexPath indexPathForRow:0 inSection:1];
// NSLog(@"%ld %ld",index.section,index.row);
// 创建 UITableViewCell 对象
/*
即出屏幕的 cell 会被添加到 mutableSet 中,进入屏幕的 cell, 先从 set 中获取,如果获取不到,才创建一个 cell.在 cell 显示之前,给 cell 赋上相应的内容)
cell 的 reuseldentifier 是重用的关键.
*/// 为了节约内存,采用了表视图的重用机制
//如何重用 cell?
// 1.创建重用 cell 的标志
static NSString *indentifier = @"cell"; // 静态区的数据,第一次初始化之后,值不再改变
// 2.根据重用标志去重用池中取cell
UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:indentifier];
// 3.判断是否成功取到 cell 取到的 cell 一定是带有标志的,也就是可重用的
if (!cell) { // !cell表示取到的值为空
// 4. 创建 cell 对象,这些 cell 都是有标志的
// 内存问题:在哪里创建就在那个地方释放,因为当重用池中有 cell 的时候,这个判断就不会再执行了,所以在 return cell 时候不需要再 autorelease 了
cell = [[[UITableViewCell alloc]initWithStyle:UITableViewCellStyleSubtitle reuseIdentifier:indentifier]autorelease];
NSLog(@"创建了%d次",++i); // 用来记录加载界面的时候,创建 cell 的次数
}
#warning 从大数组中取出数据
/* {
// 取出小数组中的数据(名字),让 textLable 显示
// 根据分区索引获取小数组
NSArray *tempArray = self.bigArray[indexPath.section];
// 根据行索引,获取小数组中对应的元素
cell.textLabel.text = tempArray[indexPath.row];
} */
#warning 从字典中取出数据
// 1.从排好序的数组中取出 key 值
NSString *key = self.key[indexPath.section];
// 2.根据 key 值在字典中获取对应的 value
NSArray *tempArray = self.dictionary[key];
// 3. 根据获得的数组取出数据
NSString *name = tempArray[indexPath.row];
// 4.给 textLable赋值
cell.textLabel.text = name;
// 为 cell 添加图片
cell.imageView.image = [UIImage imageNamed:@"0.png"];
// 为 cell 添加 lable
cell.detailTextLabel.text = @"27班";
// 添加 cell被选中时的效果
cell.selectionStyle = UITableViewCellSelectionStyleDefault;
// 添加cell 的辅助视图
cell.accessoryType = UITableViewCellAccessoryDisclosureIndicator;
return cell;
}
// 配置 tableView 的分区数,返回值是几,就有几个分组,返回分区的个数
- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView{
#warning 大数组中的元素的个数等于分区的个数
// return self.bigArray.count;
#warning 字典中键值对的个数等于分区的个数
return self.dictionary.count;
}
// 配置每个分区的页眉
- (NSString *)tableView:(UITableView *)tableView titleForHeaderInSection:(NSInteger)section{
return @"123";
}
// 配置每个分区的页脚
//- (NSString *)tableView:(UITableView *)tableView titleForFooterInSection:(NSInteger)section{
一般不需要
//}
// 配置 tableView 右侧的分区索引
- (NSArray *)sectionIndexTitlesForTableView:(UITableView *)tableView{
return @[@"A",@"B",@"C",@"D",@"E",@"F",@"G",@"H",@"I",@"J",@"K",@"L",@"M",@"N",@"O",@"P",@"Q",@"R",@"S",@"T"];
}
#pragma mark -------业务代理的方法------------
#warning 一般用来实现界面的跳转功能
// 当tableView 的某一行被选中时触发
- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath{
DetailViewController *detail = [[DetailViewController alloc]init];
[self.navigationController pushViewController:detail animated:YES];
[detail release];
}
// 当 tableView 的某一行取消选中会触发
- (void)tableView:(UITableView *)tableView didDeselectRowAtIndexPath:(NSIndexPath *)indexPath{
NSLog(@"deselect section:%ld,row:%ld",indexPath.section,indexPath.row);
}
// 返回每一分组的高度
- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath{
if (0 == indexPath.section) {
return 100;
}else if (1 == indexPath.section ){
return 80;
}
return 60;
}
- (void)dealloc
{
[_key release];
[_dictionary release];
[_bigArray release];
[super dealloc];
}
- (void)didReceiveMemoryWarning {
[super didReceiveMemoryWarning];
}
@end