iOS开发基础 - UITableView

UITableView

基本设置

UITableView * tableV = [[UITableView alloc] initWithFrame:self.view.bounds style:UITableViewStyleGrouped];
/*
UITableViewStylePlain, //分区没间隔  区头置顶替换
UITableViewStyleGrouped //分区有间隔  区头显示在间隔中
*/
tableV.delegate = self;
tableV.dataSource = self;
//cell自适应里面label的高度 等同于协议方法
//self.tableView.rowHeight = UITableViewAutomaticDimension;
//预留cell的高度
self.tableView.estimatedRowHeight = 40.0;

UIView * headView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, [UIScreen mainScreen].bounds.size.width, 200)];
headView.backgroundColor = [UIColor purpleColor];
//table的表头 表头只有一个 和分区没有关系 是独立的一部分
_tableView.tableHeaderView = headView;
UIView * footerView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, [UIScreen mainScreen].bounds.size.width, 200)];
footerView.backgroundColor = [UIColor purpleColor];
//table的表尾 表尾只有一个 和分区没有关系 是独立的一部分
_tableView.tableFooterView = footerView;

//加载后自动定位到某一行
NSIndexPath *idxPath = [NSIndexPath indexPathForRow:8 inSection:0];//定位到第8行
[self.resultCommunityTableview scrollToRowAtIndexPath:idxPath
atScrollPosition:UITableViewScrollPositionMiddle
animated:NO];

//在table的上面添加子视图
UIView * customView = [[UIView alloc] initWithFrame:CGRectMake(0, -150, [UIScreen mainScreen].bounds.size.width, 150)];
customView.tag = 100;
customView.backgroundColor = [UIColor lightGrayColor];
//内容距离上下左右的边距
_tableView.contentInset = UIEdgeInsetsMake(0, 0, 0, 0);
//内容显示的偏移量
//_tableView.contentOffset = CGPointMake(0, -150);
[_tableView addSubview:customView];

//设置间隔线样式 默认为单线
[self.tableView setSeparatorStyle:UITableViewCellSeparatorStyleNone];

//刷新tableView 重新调用协议方法
[self.tableView reloadData];
[self.view addSubview:tableV];

当显示的行数少于屏幕最大显示行数的时候，会出现多余的间隔线，可以使用_tableView.tableFooterView = [[UIView alloc] init]; 即设置表尾可以消除多余的间隔线

对于tableView的详细设置 在其协议方法中实现

--------------协议方法----------------
//列表 我们称之为cell  细胞/单元
-(CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath{
//  设置cell高度 Row 行 就是我们的cell section区
return 60; //默认高度40
}
-(NSInteger)numberOfSectionsInTableView:(UITableView *)tableView{
//    设置分区个数 默认是1
return 2;
}

//***************UITableViewDataSource协议*******************
//必须要实现的方法
-(NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section{
//每个分区有多少行
return 10;
}

//tableView最重要的协议方法
-(UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{

//在我们把tableView加到cell上 进入到这个界面会自动调用这个方法
//这个方法会被不断调用 最开始会调用几次 tableView就能显示几个 cell就会被调用几次
//复用度 重用池/重用队列
//开始的时候 就从重用池里面获取cell
//    Identifier位置标识符
//定义重用标识符
static NSString * cellId = @"cellID";

UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:cellId];

//    如果重用池里面获取不到数据
if (!cell) {
cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleValue1 reuseIdentifier:cellId];
NSLog(@"new");
//        reuseIdentifier重用标识符
}

cell.textLabel.text = @"标题”;
cell.detailTextLabel.text = @"详情";
cell.imageView.image = [UIImage imageNamed:[NSString stringWithFormat:@"%d.jpg",arc4random()%7+1]];
return cell;
}

对于重写的cell 可以使用下面的方法 （重写的cell必须有XIB文件）
1.//提前注册cell
[self.tableView registerNib:[UINib nibWithNibName:@"MyCell" bundle:nil] forCellReuseIdentifier:@"newID"];
2.在协议方法中
-(UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{

MyCell * cell = [tableView dequeueReusableCellWithIdentifier:@"newID" forIndexPath:indexPath];
DataModel * dataModel = _mArr[indexPath.row];
cell.titleLabel.text = dataModel.name;
cell.imageView.image =[UIImage imageNamed:@"image_14.jpg"];
return cell;
}

在自定义的cell上 添加视图的时候 应该添加到 cell.contentView上

*****************************非自定义cell*************************
//创建cell 显示内容
-(UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{
//设定重用标识符
static NSString * cellId = @"id";
//    2.根据重用标识符 拿到cell
UITableViewCell * cell = [tableView dequeueReusableCellWithIdentifier:cellId];
if (!cell) {
cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:cellId];
//如果使用系统的UITableViewCell 在cell上添加子控件的时候应该在这个判断中创建 添加
UILabel * label = [[UILabel alloc] initWithFrame:CGRectMake(100, 40, 100, 40)];
//        label.text = @"aaa";
[cell.contentView addSubview:label];
label.tag = 100;
}
//让cell 显示数据
cell.textLabel.text = @"数据显示";
//cell上子控件显示数据一定要在判断外
UILabel * subLabel = (id)[cell viewWithTag:100];
subLabel.text = @"new";

return cell;
}

//点击cell触发事件
-(void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath{

//设置区头
-(NSString * )tableView:(UITableView *)tableView titleForFooterInSection:(NSInteger)section{
return @"区尾";
}
//设置区尾
-(NSString *)tableView:(UITableView *)tableView titleForHeaderInSection:(NSInteger)section{
return @"区头";
}

//设置区头区尾的高度
-(CGFloat)tableView:(UITableView *)tableView heightForFooterInSection:(NSInteger)section{
return 40;
}
-(CGFloat)tableView:(UITableView *)tableView heightForHeaderInSection:(NSInteger)section{
return 40;
}

//自定制区头区尾
-(UIView *)tableView:(UITableView *)tableView viewForFooterInSection:(NSInteger)section{

//自定制区头view的高度要和设置区头高度的协议方法里的值要一致
//x y width 无实际效果
UIView * view = [[UIView alloc] initWithFrame:CGRectMake(0, 0, [UIScreen mainScreen].bounds.size.width, 40)];
view.backgroundColor = [UIColor grayColor];

return view;
}

对TableView 删改操作

//**********单个删除/左划删除*************
//点击右上角图标 调用此方法
-(void)editCell:(UIButton *)btn{
//cell能否被编辑
_tableView.editing= !_tableView.editing;
NSString * title = self.tableView.editing?@"完成":@"编辑";
[btn setTitle:title forState:UIControlStateNormal];
}

//当点击删除的时候触发
-(void)tableView:(UITableView *)tableView commitEditingStyle:(UITableViewCellEditingStyle)editingStyle forRowAtIndexPath:(NSIndexPath *)indexPath{
//删除数据源里面相应的数据
[self.dataArr removeObjectAtIndex:indexPath.row];

[self.tableView reloadData];
}

//侧滑显示多个按钮
-(NSArray *)tableView:(UITableView *)tableView editActionsForRowAtIndexPath:(NSIndexPath *)indexPath{

UITableViewRowAction * delete = [UITableViewRowAction rowActionWithStyle:UITableViewRowActionStyleDefault title:@"删除" handler:^(UITableViewRowAction *action, NSIndexPath *indexPath) {

}];
delete.backgroundColor = [UIColor redColor];

UITableViewRowAction * action2 = [UITableViewRowAction rowActionWithStyle:UITableViewRowActionStyleDestructive title:@"置顶" handler:^(UITableViewRowAction *action, NSIndexPath *indexPath) {

}];
action2.backgroundColor = [UIColor orangeColor];

UITableViewRowAction * action3 = [UITableViewRowAction rowActionWithStyle:UITableViewRowActionStyleNormal title:@"动作3" handler:^(UITableViewRowAction *action, NSIndexPath *indexPath) {

}];
action3.backgroundColor = [UIColor grayColor];

return @[delete,action2,action3];
}

//**********移动*************
//cell移动会调用这个方法 可以出现排列图标
-(void)tableView:(UITableView *)tableView moveRowAtIndexPath:(NSIndexPath *)sourceIndexPath toIndexPath:(NSIndexPath *)destinationIndexPath{
NSLog(@"移动");
//    [_dataArr exchangeObjectAtIndex:sourceIndexPath.row withObjectAtIndex:destinationIndexPath.row];

if (sourceIndexPath.row < destinationIndexPath.row) {
//先插入
[self.dataArr insertObject:self.dataArr[sourceIndexPath.row] atIndex:destinationIndexPath.row+1];
[self.dataArr removeObjectAtIndex:sourceIndexPath.row];
}
else
{
//先插入
[self.dataArr insertObject:self.dataArr[sourceIndexPath.row] atIndex:destinationIndexPath.row];
[self.dataArr removeObjectAtIndex:sourceIndexPath.row+1];
}
[self.tableView reloadData];
}

//设置左侧按钮样式
-(UITableViewCellEditingStyle)tableView:(UITableView *)tableView editingStyleForRowAtIndexPath:(NSIndexPath *)indexPath{
//    UITableViewCellEditingStyleNone, 无样式
//    UITableViewCellEditingStyleDelete, -号
//    UITableViewCellEditingStyleInsert  +号
return UITableViewCellEditingStyleDelete;
}

//**********多项删除操作*************

步骤
1.点击按钮 调用方法，更改状态
self.tableView.editing = !self.tableView.editing;//允许操作
self.tableView.allowsMultipleSelectionDuringEditing = YES;//允许多行操作
2.利用下面两个方法 记录点击的cell集合
-(void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath
-(void)tableView:(UITableView *)tableView didDeselectRowAtIndexPath:(NSIndexPath *)indexPath
3.再次点击button 更改状态 将选中的多行删除

具体代码
-(void)mutableEditCell:(UIBarButtonItem *)item{

self.tableView.editing = !self.tableView.editing;
//允许多项选择
self.tableView.allowsMultipleSelectionDuringEditing = !self.tableView.allowsMultipleSelectionDuringEditing;
/*
for (int i = 0; i < self.selectedArr.count;i++) {
NSIndexPath * index = self.selectedArr[i];
//将选中的cell 替换成空
[self.dataArr replaceObjectAtIndex:index.row withObject:@""];
}
//把所有的空字符串删除掉
[self.dataArr removeObject:@""];
*/

NSMutableIndexSet * set = [[NSMutableIndexSet alloc] init];
for (int i = 0; i < self.selectedArr.count; i++) {
NSIndexPath * index = self.selectedArr[i];
//把选中的行存储到集合当中
[set addIndex:index.row];
}
[self.dataArr removeObjectsAtIndexes:set];

[self.selectedArr removeAllObjects];

[self.tableView reloadData];
}
//cell选中状态 加入选中集合
-(void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath{
//如果是编辑状态 选中的cell将被存储下来
if (self.tableView.editing) {
[self.selectedArr addObject:indexPath];
}
}
//cell选中后 再次点击 将视为未选中状态 从集合中删除
-(void)tableView:(UITableView *)tableView didDeselectRowAtIndexPath:(NSIndexPath *)indexPath{
[self.selectedArr removeObject:indexPath];
}

分组收放

思路：通过给区头上自定义view设置点击手势，改变该区的cell行数，即0行为收起状态，>0为展开状态

//设置自定义区头
-(UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section{
（…省略view设置）
UITapGestureRecognizer * tap = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(tapHeaderView:)];

[view addGestureRecognizer:tap];
view.tag = 100 + section;
return view;
}

//手势设置
- (void)tapHeaderView:(UITapGestureRecognizer *)tap{
UIView * view= tap.view;//拿到点击的视图

NSString * key = [NSString stringWithFormat:@"%d",view.tag-100];
//通过字典记录每个分组的收放状态 即 YES or NO
[self.mDic setObject:@(![self.mDic[key] boolValue])forKey:key];
//[self.tableView reloadData];

//重新加载数据时 有动画效果
[self.tableView reloadSections:[NSIndexSet indexSetWithIndex:view.tag - 100] withRowAnimation:UITableViewRowAnimationFade];
}

//改变每个区的cell数
-(NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section{
NSString * key = [NSString stringWithFormat:@"%d",section];
if ([self.mDic[key] boolValue]) {
return 5;
}
return 0;
}

自定义Cell显示动画

即通过调用下面这个方法来实现
//cell将要显示的时候会触发这个方法
-(void)tableView:(UITableView *)tableView willDisplayCell:(UITableViewCell *)cell forRowAtIndexPath:(NSIndexPath *)indexPath{
//    CATransform3D transform = CATransform3DMakeRotation(M_PI_2, 0, 0, 0);
//    cell.transform = [NSValue valueWithCATransform3D:  transform].CGAffineTransformValue;

//将动画赋给cell的layer
cell.layer.transform = CATransform3DMakeTranslation(200, 0, 0);

//设置锚点 即中心点
cell.layer.anchorPoint = CGPointMake(0, 0);
[UIView animateWithDuration:0.5 animations:^{
cell.layer.transform = CATransform3DIdentity;
}];
}

瀑布流

即左右两个或两个以上tableView排列显示
协议方法实现如下

-(NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section{

if (tableView == self.tableView1) {
return self.dataArr1.count;
}
return self.dataArr2.count;
}

-(UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{
if (tableView == self.tableView1) {

UITableViewCell * cell = [tableView dequeueReusableCellWithIdentifier:@"id" forIndexPath:indexPath];
cell.textLabel.text = self.dataArr1[indexPath.row];
return cell;
}
else{

UITableViewCell * cell = [tableView dequeueReusableCellWithIdentifier:@"id2" forIndexPath:indexPath];
cell.textLabel.text = self.dataArr2[indexPath.row];
return cell;
}
}

//因为tableView继承与scrollView
所以可以使用scrollview 的协议方法
-(void)scrollViewDidScroll:(UIScrollView *)scrollView{
if (scrollView == self.tableView1) {
self.tableView2.contentOffset = self.tableView1.contentOffset;
}
else{
self.tableView1.contentOffset = self.tableView2.contentOffset;
}
}