ios学习笔记——UITableView

表视图是ios开发中使用最频繁的视图。一般情况下，我们都会选择以表视图的形式来展示数据。

一、UITableView的分类

---

　　表视图分为两大类：

• 普通表视图：（Plain）主要用于动态表，一般在单元格未知的情况下使用

　　

• 分类表视图：（Grouped）一般用于静态表，用于进行界面布局

　　

 

 

二、cell（单元格）

---

 　　这里说到表视图，不得不说表示图里面最重要的组成部分——cell（单元格）

　　cell由图标、标题和扩展视图组成，如图：

　　

 　　cell有四种样式，他们定义在UITableViewCellStyle枚举中，再初始化的时候决定cell的类型

    typedef NS_ENUM(NSInteger, UITableViewCellStyle) {
        UITableViewCellStyleDefault,    //默认样式，只有图标和主标题
        UITableViewCellStyleValue1,     //无图标带副标题样式1
        UITableViewCellStyleValue2,     //无图标带副标题样式1
        UITableViewCellStyleSubtitle    //带有副标题的样式
    };

　　我们在dataSource的代理方法中创建cell，通过代码创建简单的cell：

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
    //可重用cell的标识符
    static NSString * strID = @"tableView";
    //查找可重用的cell
    UITableViewCell * cell = [tableView dequeueReusableCellWithIdentifier:strID];
    if(!cell){
        cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:strID];
    }
    
    //在cell上显示内容
    cell.imageView.image = [UIImage imageNamed:@"gougou.jpg"];
    cell.textLabel.text = @"gougou";
    
    return cell;
}

 

三、UITableView的代理方法

---

 

 　　UITableView有两个代理：UITableViewDataSource和UITableViewDelegate，想要创建UITableView，需要用到这两个代理的代理方法。

• dataSource为UITableView提供数据

方法	说明
- (UITableViewCell *)tableView:(UITableView *)tableView          cellForRowAtIndexPath:(NSIndexPath *)indexPath	为UITableView提供数据，该方法是必须实现的方法
- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView	返回节的个数
- (NSInteger)tableView:(UITableView *)tableView  numberOfRowsInSection:(NSInteger)section	返回某个节的行数
- (NSArray *)sectionIndexTitlesForTableView:(UITableView *)tableView	提供UITableView节索引标题
- (NSString *)tableView:(UITableView *)tableView titleForHeaderInSection:(NSInteger)section	返回节头的标题
- (NSString *)tableView:(UITableView *)tableView titleForFooterInSection:(NSInteger)section	返回节脚的标题
- (void)tableView:(UITableView *)tableView commitEditingStyle:(UITableViewCellEditingStyle)editingStyle forRowAtIndexPath:(NSIndexPath *)indexPath	为删除或修改提供数据

•  UITableView的delegate方法主要用来设定表示图中节头和节脚的标题，并响应一些动作事件

方法	说明
- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath	设定cell的高度
- (UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section	为节头准备自定义视图
- (UIView *)tableView:(UITableView *)tableView viewForFooterInSection:(NSInteger)section	为节脚准备自定义视图
- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath	响应选择cell时调用的方法

 

四、创建UITableView

---

 

 　初始化Table，并实现table的代理函数

#import "JZViewController.h"
#import "JZTableViewCell.h"

@interface JZViewController() <UITableViewDataSource, UITableViewDelegate>

@property (nonatomic, strong) UITableView * table;
@property (nonatomic, strong) NSMutableArray * cellArray;

@end

@implementation JZViewController

- (void)viewDidLoad
{
    [super viewDidLoad];
    self.title = @"table";
    [self loadTwoSectionCell];
    [self initTableView];
}

- (void)initTableView
{
    //根据frame和style来创建tableView
    UITableView * tableView = [[UITableView alloc] initWithFrame:CGRectMake(0, 0, [UIScreen mainScreen].bounds.size.width, [UIScreen mainScreen].bounds.size.height) style:UITableViewStylePlain];
    tableView.separatorStyle = UITableViewCellSeparatorStyleNone;
    tableView.delegate = self;
    tableView.dataSource = self;
    self.table = tableView;
    [self.view addSubview:tableView];
    
    //头部视图
    UIImageView * imageView = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, [UIScreen mainScreen].bounds.size.width, 150)];
    imageView.image = [UIImage imageNamed:@"详情页头图默认.png"];
    tableView.tableHeaderView = imageView;
}

- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView
{
    return 3;
}

- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section
{
    if(section == 0){
        return 1;
    }else if(section == 1){
        return 4;
    }else if(section == 2){
        return 4;
    }
    
    return 0;
}

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
    static NSString * sjzID = @"sjz";
    JZTableViewCell * cell = [tableView dequeueReusableCellWithIdentifier:sjzID];
    if(!cell){
        cell = [[JZTableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:sjzID];
    }else{
        //这里必须要删除子控件，要不重用的时候，子控件依然会现实出来
        for(UIView * view in [cell.contentView subviews]){
            [view removeFromSuperview];
        }
    }
    
    [cell cellWithIndex:indexPath];
    
    NSLog(@"%p", cell);
    
    return cell;
}

- (void)loadTwoSectionCell
{
    NSMutableArray * arr = [NSMutableArray arrayWithObjects:@"45", @"90", @"90", @"7", nil];
    self.cellArray = arr;
}

- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath
{
    if(indexPath.section == 0){
        return 2 * ([UIScreen mainScreen].bounds.size.width / 4 + 15) + 7;
    }else{
        CGFloat cellHeight = [[self.cellArray objectAtIndex:indexPath.row] floatValue];;
        return cellHeight;
    }
}

@end

 

自定义cell：

#import <UIKit/UIKit.h>

@interface JZTableViewCell : UITableViewCell

- (void)cellWithIndex:(NSIndexPath *)indexPath;

@end

#import "JZTableViewCell.h"

@implementation JZTableViewCell

- (instancetype)initWithStyle:(UITableViewCellStyle)style reuseIdentifier:(NSString *)reuseIdentifier
{
    self = [super initWithStyle:style reuseIdentifier:reuseIdentifier];
    if(self){
        
    }
    return self;
}

- (void)cellWithIndex:(NSIndexPath *)indexPath
{
    if(indexPath.section == 0){
        [self cellForOneCell:indexPath];
    }else if(indexPath.section == 1){
        [self cellForTwoCell:indexPath];
    }else if(indexPath.section == 2){
        [self cellForThreeCell:indexPath];
    }
}

- (void)cellForOneCell:(NSIndexPath *)indexPath
{
    NSArray * imageArr = [NSArray arrayWithObjects:@"home_fastdepo_icon@2x.png", @"home_history_icon@2x.png", @"home_icon_notice@2x.png", @"home_myfocus_icon@2x.png", nil];
    NSArray * titleArr = [NSArray arrayWithObjects:@"电话", @"定时", @"闹铃", @"收藏", nil];
    CGFloat buttonW = [UIScreen mainScreen].bounds.size.width / 4;
    CGFloat buttonH = buttonW + 15;
    
    for(int i = 0; i < 8; i++){
        int x = i % 4;
        int y = i / 4;
        
        UIImageView * imageView = [[UIImageView alloc] initWithFrame:CGRectMake((buttonW - 58) / 2 + buttonW * x, 10 + buttonH * y, 58, 58)];
        imageView.image = [UIImage imageNamed:[imageArr objectAtIndex:x]];
        [self.contentView addSubview:imageView];
        
        NSString * title = [titleArr objectAtIndex:0];
        CGSize titleSize = [title sizeWithFont:[UIFont systemFontOfSize:13]];
        UILabel * label = [[UILabel alloc] initWithFrame:CGRectMake(buttonW * x, 10 + 58 + 5 + buttonH * y, buttonW, titleSize.height)];
        label.backgroundColor = [UIColor clearColor];
        label.text = [titleArr objectAtIndex:x];
        label.textAlignment = NSTextAlignmentCenter;
        label.font = [UIFont systemFontOfSize:13];
        [self.contentView addSubview:label];
        
        
        UIButton * button = [[UIButton alloc] initWithFrame:CGRectMake(buttonW * x, buttonH * y, buttonW, buttonH)];
        
        [self.contentView addSubview:button];
    }
    [self  addLineWithRect:CGRectMake(0, buttonH * 2, [UIScreen mainScreen].bounds.size.width, 7)];
}

- (void)cellForTwoCell:(NSIndexPath *)indexPath
{
    if(indexPath.row == 0){
        [self addLabelRect:CGRectMake(15, 0, [UIScreen mainScreen].bounds.size.width - 30, 45) text:@"联系人"];
        self.selectionStyle = UITableViewCellSelectionStyleNone;
    }else if (indexPath.row == 3){
        [self addLineWithRect:CGRectMake(0, 0, [UIScreen mainScreen].bounds.size.width, 7)];
        self.selectionStyle = UITableViewCellSelectionStyleNone;
    }else{
        NSArray * imageArr = [NSArray arrayWithObjects:@"哆啦A梦.jpg", @"大雄.png", nil];
        NSArray * nameArr = [NSArray arrayWithObjects:@"哆啦A梦", @"大雄", nil];
        NSArray * iphone = [NSArray arrayWithObjects:@"123456789", @"987654321", nil];
        NSArray * addArr = [NSArray arrayWithObjects:@"北京——海淀区", @"上海——虹桥区", nil];
        
        UIImageView * imageView = [[UIImageView alloc] initWithFrame:CGRectMake(15, 10, 50, 70)];
        imageView.image = [UIImage imageNamed:[imageArr objectAtIndex:indexPath.row - 1]];
        [self.contentView addSubview:imageView];
        
        NSString * name = @"联系人：";
        CGSize nameSize = [name sizeWithFont:[UIFont systemFontOfSize:13]];
        [self addLabelRect:CGRectMake(15 + 50 + 10, 10, nameSize.width, nameSize.height) text:name];
        [self addLabelRect:CGRectMake(75 + nameSize.width, 10, [UIScreen mainScreen].bounds.size.width, nameSize.height) text:[nameArr objectAtIndex:indexPath.row - 1]];
        
        NSString * address = @"地   址：";
        [self addLabelRect:CGRectMake(15 + 50 + 10, 10 + 25, nameSize.width, nameSize.height) text:address];
        [self addLabelRect:CGRectMake(75 + nameSize.width, 10 + 25, [UIScreen mainScreen].bounds.size.width, nameSize.height) text:[addArr objectAtIndex:indexPath.row - 1]];
        
        NSString * iphon = @"电   话：";
        [self addLabelRect:CGRectMake(15 + 50 + 10, 10 + 50, nameSize.width, nameSize.height) text:iphon];
        [self addLabelRect:CGRectMake(75 + nameSize.width, 10 + 50, [UIScreen mainScreen].bounds.size.width, nameSize.height) text:[iphone objectAtIndex:indexPath.row - 1]];
    }
}

- (void)cellForThreeCell:(NSIndexPath *)indexPath
{
    if(indexPath.row == 0){
        [self addLabelRect:CGRectMake(15, 0, [UIScreen mainScreen].bounds.size.width - 30, 45) text:@"闹铃"];
        self.selectionStyle = UITableViewCellSelectionStyleNone;
    }else if (indexPath.row == 3){
        [self addLineWithRect:CGRectMake(0, 0, [UIScreen mainScreen].bounds.size.width, 7)];
        self.selectionStyle = UITableViewCellSelectionStyleNone;
    }else{
        NSArray * imageArr = [NSArray arrayWithObjects:@"home_icon_notice@2x.png", @"home_icon_notice@2x.png", nil];
        NSArray * timeArr = [NSArray arrayWithObjects:@"16:40", @"6:30", nil];
        NSArray * iphone = [NSArray arrayWithObjects:@"工作日", @"周末", nil];
        
        UIImageView * imageView = [[UIImageView alloc] initWithFrame:CGRectMake(15, 20, 50, 50)];
        imageView.image = [UIImage imageNamed:[imageArr objectAtIndex:indexPath.row - 1]];
        [self.contentView addSubview:imageView];
        
        NSString * name = @"时   间：";
        CGSize nameSize = [name sizeWithFont:[UIFont systemFontOfSize:13]];
        [self addLabelRect:CGRectMake(15 + 50 + 10, 20, nameSize.width, nameSize.height) text:name];
        [self addLabelRect:CGRectMake(75 + nameSize.width, 20, [UIScreen mainScreen].bounds.size.width, nameSize.height) text:[timeArr objectAtIndex:indexPath.row - 1]];
        
        NSString * address = @"周   期：";
        [self addLabelRect:CGRectMake(15 + 50 + 10, 20 + 30, nameSize.width, nameSize.height) text:address];
        [self addLabelRect:CGRectMake(75 + nameSize.width, 20 + 30, [UIScreen mainScreen].bounds.size.width, nameSize.height) text:[iphone objectAtIndex:indexPath.row - 1]];
    }
}


- (void)addLabelRect:(CGRect)rect text:(NSString *)text
{
    UILabel * label = [[UILabel alloc] initWithFrame:rect];
    label.text = text;
    label.font = [UIFont systemFontOfSize:13];
    label.textAlignment = NSTextAlignmentLeft;
    label.backgroundColor = [UIColor clearColor];
    label.textColor = [UIColor blackColor];
    [self.contentView addSubview:label];
}

- (void)addLineWithRect:(CGRect)rect
{
    UIView * view = [[UIView alloc] initWithFrame:rect];
    view.backgroundColor = [UIColor colorWithRed:225/255.0 green:225/255.0 blue:225/255.0 alpha:1.0];
    [self.contentView addSubview:view];
}

@end

 

 运行，界面如下：