IOS UITableView的创建及常用协议

作者: Rootkits | 来源:发表于2016-08-12 20:27 被阅读0次

<h1> 1.UITableview的创建<h1>

<h6>打开Xcode,创建新工程,在默认的ViewController.h文件中声明属性,例如:定义一个名为tableView的视图对象;

#import <UIKit/UIKit.h>

@interface ViewController : UIViewController

@property (nonatomic , retain) UITableView *tableView;

@end

<h6>要实现Tableview必须要签订2个协议,<UITableViewDelegate,UITableViewDataSource>

UITableViewDelegate:数据视图的普通协议,作用是:处理数据视图事件.
UITableViewDataSource:数据视图的数据代理协议,作用是:处理视图的数据代理.

#import <UIKit/UIKit.h>

@interface ViewController : UIViewController<UITableViewDelegate,UITableViewDataSource>

@property (nonatomic , retain) UITableView *tableView;

@end

Tableview 有两个重要的组成部分section和row;
section(部分):可以理解为tableview显示时候的组;
row(行):可以理解为tableview显示时候的行;

TableView创建必须实现签订的协议的2个协议方法

(1) -(NSInteger)tableView:(UITableView *)tableView
numberOfRowsInSection:(NSInteger)section;
这个协议的作用是指定每个section返回多少个Row;

(2) -(UITableViewCell *) tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath;
这个协议的作用是指定每个组每个行返回那种TableViewCell(
cell就是TableView显示时候的格子;
)

选择实现协议 -(NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section;

此协议用来控制每个section 返回cell个数(如不重写该协议默认返回1个section);

//  ViewController.m
//  UITableView
//
//  Created by 黄威 on 16/8/12.
//  Copyright © 2016年 黄威. All rights reserved.
//

#import "ViewController.h"

@interface ViewController ()

@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];

    _tableView = [[UITableView alloc]initWithFrame:self.view.bounds style:UITableViewStyleGrouped];
    
    _tableView.delegate = self;
    _tableView.dataSource = self;
    
    //注册cell(TablewViewcell的重用机制需要使用);

    [self.tableView registerClass:[UITableViewCell class] forCellReuseIdentifier:@"reuse"];
    [self.view addSubview:_tableView];
    
    
}

- (void)didReceiveMemoryWarning {
    [super didReceiveMemoryWarning];
    // Dispose of any resources that can be recreated.
}

-(NSInteger)numberOfSectionsInTableView:(UITableView *)tableView{

    return 3;

}

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


    if (section == 0) {
        
        return 3;
        
    }else if(section == 1){
    
        return 2;
        
    }else{
    
        return 1;
    }

}


-(UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{


    UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:@"reuse" forIndexPath:indexPath];


    
    return cell;


}

完成以上代码即可完成一个最简单的Tableview的创建;

_tableView = [[UITableView alloc]initWithFrame:self.view.bounds style:UITableViewStyleGrouped];

Tableview style 有两种风格
UITableViewStylePlain:普通风格
UITableViewStyleGrouped:分组风格
区别如图:

屏幕快照 2016-08-12 下午8.31.09.png

TableView常用属性

属性名	意思
rowHeigh	行高
separatorStyle	分割线样式
separatorColor	分隔线颜色
tableHeaderView	置顶视图
tableFootView	置底视图

<h1>UITableView协议

<h6>定义一个数组 arrayData作为数据源;

#import <UIKit/UIKit.h>
@interface ViewController : UIViewController<UITableViewDelegate,UITableViewDataSource>
@property (nonatomic, retain) UITableView *tableView;
@property (nonatomic, retain) NSMutableArray *arrayData;
@end

在viewController.m文件中初始化数组,并对数组进行赋值操作;

    _arrayData = [NSMutableArray array];
    
    for (int i = 'A'; i < 'Z'; i++) {
         NSMutableArray *arrSmall = [[NSMutableArray alloc]init];
       for (int j = 1; j < 5 ; j++)  {
         NSString *str = [NSString stringWithFormat:@"%c%d",i,j];
          [arrSmall addObject:str]; }
            
            //生成一个2维数组
           [_arrayData addObject:arrSmall];
                                              }

在下面协议方法中设置返回section数量,返回的数量即数据源数组的个数self.arrayData.count;

(NSInteger)numberOfSectionsInTableView:(UITableView *)tableView ;

在下面协议方法中设置每个section返回单元格的数量,返回的数量即 [[self.arrayData objectAtIndex:section] count];

-(NSInteger)numberOfSectionsInTableView:(UITableView *)tableView{

  return self.arrayData.count;
}

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

    NSInteger numberRow = [[self.arrayData objectAtIndex:section] count];
    
    return numberRow;

}

系统的TableViewCell 默认的样式提供3个属性

属性名	意思
UIImageView *imageView	图片视图
UILabel *textLabel	标题标签
UILabel *detailTextLabel	副标题标签

/
使用系统UITableViewCell 在下面的协议中设置每一行返回的样式及内容;
-(UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath;



-(UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{

    UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:@"reuse" forIndexPath:indexPath];

    NSString *str = [NSString stringWithFormat:@"第%ld组---第%ld行",indexPath.section,indexPath.row];

    cell.textLabel.text = str;
    
    return cell;

}

运行模拟器,即可看到如下的结果

屏幕快照 2016-08-13 上午10.52.04.png

可以在下面协议中设置返回单元格的高度
-(CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath

例如:

-(CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath{
  
  return 150;
}

实际效果如下,可以看到单元格的高度变为150;

屏幕快照 2016-08-13 上午10.59.10.png

与之类似的还有以下两个协议,用来设置单元格分组头部和尾部的高度

- (CGFloat)tableView:(UITableView *)tableView heightForHeaderInSection:(NSInteger)section{

    return 40;
}

-(CGFloat)tableView:(UITableView *)tableView heightForFooterInSection:(NSInteger)section{

    return 20;
}

设置单元格头部和尾部的标题

-(NSString *)tableView:(UITableView *)tableView titleForHeaderInSection:(NSInteger)section{

     return @"这里是头部";

}
-(NSString *)tableView:(UITableView *)tableView titleForFooterInSection:(NSInteger)section{
    
     return @"这里是尾部";
    
}

效果如下:

屏幕快照 2016-08-13 上午11.10.58.png

设置单元格头部尾部视图

-(UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section{

    UIImage *image = [UIImage imageNamed:@"1.png"];
    
    UIImageView *imageView = [[UIImageView alloc]initWithImage:image];
    
    return imageView;

}

-(UIView *)tableView:(UITableView *)tableView viewForFooterInSection:(NSInteger)section{

    UIImage *image = [UIImage imageNamed:@"3.png"];
    
    UIImageView *imageView = [[UIImageView alloc]initWithImage:image];
    
    return imageView;

}

<h1>TableView编辑功能

<h6>增加编辑和导航按钮属性

#import <UIKit/UIKit.h>

@interface ViewController : UIViewController<UITableViewDelegate,UITableViewDataSource>

@property (nonatomic, retain) UITableView *tableView;

@property (nonatomic, retain) NSMutableArray *arrayData;

//添加编辑和导航按钮;

@property (nonatomic, retain) UIBarButtonItem *btnEdit;
@property (nonatomic, retain) UIBarButtonItem *btnFinish;
@property (nonatomic, retain) UIBarButtonItem *btnDelete;
//设置编辑状态;
@property (nonatomic, assign) BOOL isEdit;

@end

在AppDelegate.m中添加导航控制器

//  AppDelegate.m
//  UITableView
//
//  Created by 黄威 on 16/8/12.
//  Copyright © 2016年 黄威. All rights reserved.
//

#import "AppDelegate.h"
#import "ViewController.h"
@interface AppDelegate ()
@end
@implementation AppDelegate
- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {

    self.window = [[UIWindow alloc] initWithFrame:[UIScreen mainScreen].bounds];
    self.window.backgroundColor = [UIColor whiteColor];
    [self.window makeKeyAndVisible];
    
    ViewController *vc = [[ViewController alloc]init];
    
    UINavigationController *nav = [[UINavigationController alloc]initWithRootViewController:vc];
    
    self.window.rootViewController = nav;
    
    nav.title = @"TableView编辑";

    return YES;
}

开启TableView 编辑状态

[_tableView setEditing:YES];

编写3个编辑按钮并写出对应的点击事件

- (void)createNavButton{

    _btnEdit = [[UIBarButtonItem alloc]initWithTitle:@"编辑" style:UIBarButtonItemStylePlain target:self action:@selector(edit)];
    _btnFinish = [[UIBarButtonItem alloc]initWithTitle:@"完成" style:UIBarButtonItemStylePlain target:self action:@selector(finish)];
     _btnDelete = [[UIBarButtonItem alloc]initWithTitle:@"删除" style:UIBarButtonItemStylePlain target:self action:@selector(delete)];
    self.navigationItem.rightBarButtonItem = _btnEdit;
}

- (void)edit{

    _isEdit = YES;
    self.navigationItem.rightBarButtonItem = _btnFinish;
    [_tableView setEditing:YES];
    self.navigationItem.leftBarButtonItem = _btnDelete;

}

- (void)finish{

    _isEdit = NO;
    [_tableView setEditing:NO];
    self.navigationItem.leftBarButtonItem = nil;
    self.navigationItem.rightBarButtonItem = _btnEdit;

}

//单元格显示效果协议默认为删除

-(UITableViewCellEditingStyle)tableView:(UITableView *)tableView editingStyleForRowAtIndexPath:(NSIndexPath *)indexPath{

    //删除风格 UITableViewCellEditingStyleDelete;
    //None风格 UITableViewCellEditingStyleNone;
    //插入风格 UITableViewCellEditingStyleInsert;
    //多选风格 UITableViewCellEditingStyleDelete | UITableViewCellEditingStyleInsert;
//例如 :
    
    if (indexPath.section == 0){
        return UITableViewCellEditingStyleDelete;
    }
    else
        return UITableViewCellEditingStyleInsert;
    
}

//当手指在屏幕移动时可以显示编辑状态

-(void)tableView:(UITableView *)tableView commitEditingStyle:(UITableViewCellEditingStyle)editingStyle forRowAtIndexPath:(NSIndexPath *)indexPath{

//删除数据源对应数据
[_arrayData removeObjectAtIndex:indexPath.section];
//数据源更新
[tableView reloadData];
NSLog(@"delete");

}

//选中单元格时候调用此协议方法

-(void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath{
  NSLog(@"选中单元格%ld,%ld",indexPath.section,indexPath.row);
}

//取消选中时调用此协议方法

-(void)tableView:(UITableView *)tableView didDeselectRowAtIndexPath:(NSIndexPath *)indexPath{

    NSLog(@"取消选中单元格%ld,%ld",indexPath.section,indexPath.row);

}

IOS UITableView的创建及常用协议

相关文章

网友评论

延伸阅读

深度阅读

栏目导航

热点阅读