UITableView - 学习笔记(使用)

作者: degulade | 来源:发表于2016-03-09 01:47 被阅读803次

一个网管的iOS学习笔记，记录下自己这条路上的点点滴滴。都是一些很简单的笔记，不敢妄谈教学，纯粹只是为了记录自己在这条路上——前进着。

本来是分成3篇来写的，但是感觉这样太乱而杂了，所以索性整理成一篇。算是自己对UITableView这个控件的初步了解的学习吧。
这里分享2篇很全面也很实用的UITableView的博文：
1、 UITableView整理
2、 iOS开发之UITableView全面解析

开始任务：

模仿的Demo（简单模仿一下效果，加深对UITableView的了解程度而已，并不包含实际功能）：

模仿页面

Step1：分析

素材：
需要5个图标（#FFFFFF）和一张背景图片（毛玻璃）
内容：
这个界面一共有9行，即是：FirstName（名）、LastName（姓）、UserName（昵称）、Password（密码）、Re-Password（确认密码）、Email（邮箱）、Register（注册）、Login here（账号登录）

Step2：搭建基本页面

找素材：
谷歌、花瓣、知乎求助等等，小图标的@2x（2倍）图尺寸为为58*58。
关于iOS中尺寸的说明，可以点这里。
我这里已经收集整理好了素材，并且上传到了项目中：
准备好素材

搭建基本界面：
首先，实现,UITableView两个代理方法：UITableViewDelegate,UITableViewDataSource

//UITableView的代理方法
@interface ViewController ()<UITableViewDelegate,UITableViewDataSource>
@end

用代码新建一个TableView，添加代理方法、数据源以及为UITableView设置背景图片：

//代码创建一个TableView
- (void)createTableviews{
    //创建TableView，设置位置大小
    self.registerTableView = [[UITableView alloc]initWithFrame:CGRectMake(0, 0, [[UIScreen mainScreen] bounds].size.width, [[UIScreen mainScreen] bounds].size.height)];
    
    //给TableView设置背景图片
    UIImageView *backImageView = [[UIImageView alloc]initWithFrame:self.view.bounds];
    [backImageView setImage:[UIImage imageNamed:@"blurred_background"]];
    self.registerTableView.backgroundView = backImageView;
    
    //代理方法和数据源
    self.registerTableView.delegate = self;
    self.registerTableView.dataSource = self;
        
    //添加到视图中（在屏幕里显示这个TableView）
    [self.view addSubview:_registerTableView];
}

添加我们需要初步搭建这个界面需要的TableView的代理方法：

//返回多少个Section
- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView

//每组多少行数据
- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section

//设置行高
- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath

//cell显示的具体内容
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath

完整代码：

#import "ViewController.h"

@interface ViewController ()<UITableViewDelegate,UITableViewDataSource>
@property (strong, nonatomic) UITableView *registerTableView;

@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    // Do any additional setup after loading the view, typically from a nib.
    
    //调用自定义方法，创建tableView
    [self createTableviews];
}

//代码创建一个UITableView
- (void)createTableviews{
    
    //创建TableView
    self.registerTableView = [[UITableView alloc]initWithFrame:CGRectMake(0, 0, [[UIScreen mainScreen] bounds].size.width, [[UIScreen mainScreen] bounds].size.height)];
    
    //给UITableView设置背景图片
    UIImageView *backImageView = [[UIImageView alloc]initWithFrame:self.view.bounds];
    [backImageView setImage:[UIImage imageNamed:@"blurred_background"]];
    self.registerTableView.backgroundView = backImageView;
    
    //代理方法和数据源
    self.registerTableView.delegate = self;
    self.registerTableView.dataSource = self;
    
    //添加到视图中（在屏幕里显示这个TableView）
    [self.view addSubview:_registerTableView];
}

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

//返回多少个Section
- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView{
    return 1;//只有一组数据，所以只需要返回一个Section
}

//返回多少行
- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section{
    if (section == 0) {
        return 8;//需要8行数据
    }else{
        
        return 0;
    }
}

//设置行高
- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath{
    if (indexPath.section == 0) {
        
        return 80;//为了比较直观，设置的比较大
    }
    return 0;
}

//cell的内容
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{
    
    //创建cell，标识符为：myCell，类型为：UITableViewCellStyleDefault
    UITableViewCell *cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:@"myCell"];
    
    //让cell背景透明
    cell.backgroundColor = [UIColor clearColor];
    
    //让cell的字体为白色
    cell.textLabel.textColor = [UIColor whiteColor];
    //cell的字体和大小
    cell.textLabel.font = [UIFont fontWithName:@"Helvetica" size:18];

    
    if (indexPath.section == 0) {
        if (indexPath.row == 0) {//名
            //设置图标和文字内容
            cell.imageView.image = [UIImage imageNamed:@"firstName"];
            cell.textLabel.text = @"Your First Name";
            
        }else if (indexPath.row == 1){//姓
            cell.imageView.image = [UIImage imageNamed:@"lastName"];
            cell.textLabel.text = @"Your Last Name";
            
        }else if (indexPath.row == 2){//昵称
            cell.imageView.image = [UIImage imageNamed:@"userName"];
            cell.textLabel.text = @"Your User Name";
            
        }else if (indexPath.row == 3){//密码
            cell.imageView.image = [UIImage imageNamed:@"password"];
            cell.textLabel.text = @"Create Your Password";
            
        }else if (indexPath.row == 4){//确认密码
            cell.imageView.image = [UIImage imageNamed:@"password"];
            cell.textLabel.text = @"Re-enter Your Password";
            
        }else if (indexPath.row == 5){//邮箱
            cell.imageView.image = [UIImage imageNamed:@"email"];
            cell.textLabel.text = @"Enter Your Email";
        }
    }
    
    return cell;
}
@end

运行效果

搭建基本页面

现在基本界面完成，还要继续完善。

Step3：进一步完善

需求：正上方一个名为“Register”的标题，正下方一个名为“ Register”的按钮

添加一个“Register”的标题：

需要调用TableView的两个代理方法：

//组头部视图
- (UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section
//组头部的高度
- (CGFloat)tableView:(UITableView *)tableView heightForHeaderInSection:(NSInteger)section

给TableView添加标题的完整代码：

//组头部的高度（即这里的标题所在视图的高度）
- (CGFloat)tableView:(UITableView *)tableView heightForHeaderInSection:(NSInteger)section{
    return 80;
}

//自定义组头部视图（即标题内容）
- (UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section{
    
    //初始化一个UIImageView，（frame会被之后的label设置，所以可以随便设置，“CGRectMake(0, 0, 0, 0)”等同于“CGRectZero”）
    UIImageView *titleImage = [[UIImageView alloc]initWithFrame:CGRectMake(0, 0, 0, 0)];
    //image的背景颜色（clearColor即背景透明）
    titleImage.backgroundColor = [UIColor clearColor];
    
    //初始化一个UILabel，并设置位置大小（计算尺寸是一门技术活，我也不太懂，😄，所以这里随便设置了一下，记得宽度等于屏幕宽）
    UILabel *titleLabel = [[UILabel alloc]initWithFrame:CGRectMake(0, 30, [[UIScreen mainScreen] bounds].size.width, 30)];
    titleLabel.text = @"Register";
    //字体颜色
    titleLabel.textColor = [UIColor whiteColor];
    
    //字体的大小适应label的宽度（很关键的地方）
    titleLabel.adjustsFontSizeToFitWidth = YES;
    
    //字体：粗体，字号：30
    titleLabel.font = [UIFont boldSystemFontOfSize:22];
    //位置：居中对齐
    titleLabel.textAlignment = NSTextAlignmentCenter;
    
    //将label放入image的视图中（即显示出来）
    [titleImage addSubview:titleLabel];
    return titleImage;
}

运行效果：

添加一个“Register”的标题：

2.添加一个注册按钮（即“ Register”按钮）

其实基本思路和上一步一模一样：1⃣️只是viewForHeaderInSection换（组头部方法）成了viewForFooterInSection（组尾部方法），2⃣️UILabel（文本）换成了UIButton（按钮）

调用方法：组尾部高度和组尾部视图

//组尾部高度方法
- (CGFloat)tableView:(UITableView *)tableView heightForFooterInSection:(NSInteger)section
//组尾部视图方法
- (UIView *)tableView:(UITableView *)tableView viewForFooterInSection:(NSInteger)section

修改组尾部的视图内容，设置为一个绿色的按钮：

    //初始化一个button，类型为UIButtonTypeCustom（即自定义风格）
    UIButton *registerButton = [UIButton buttonWithType:UIButtonTypeCustom];
    //位置大小
    registerButton.frame = CGRectMake([[UIScreen mainScreen] bounds].size.width/10, 20, 300, 40);
    
    //设置button颜色（把@“#4FAC74”转成UIColor）
    registerButton.backgroundColor = [UIColor colorWithRed:79/255.f green:172/255.f blue:116/255.f alpha:1];
    [registerButton setTitle:@"REGISTER" forState:UIControlStateNormal];
    
    //设置button的圆角效果
    registerButton.layer.cornerRadius = registerButton.frame.size.height/8;
    registerButton.imageView.layer.masksToBounds = YES;

给TableView底部添加一个按钮完整代码：


//组尾部高度
- (CGFloat)tableView:(UITableView *)tableView heightForFooterInSection:(NSInteger)section{
    return 100;
}
//组尾部视图
- (UIView *)tableView:(UITableView *)tableView viewForFooterInSection:(NSInteger)section{
    
    UIImageView *buttonImage = [[UIImageView alloc]initWithFrame:CGRectMake(0, 0, 0, 0)];
    //image的背景颜色（clearColor即背景透明）
    buttonImage.backgroundColor = [UIColor clearColor];
    
    //初始化一个button，类型为UIButtonTypeCustom（即自定义风格）
    UIButton *registerButton = [UIButton buttonWithType:UIButtonTypeCustom];
    //位置大小（尺寸比例自行参考，我还不太懂。。。）
    registerButton.frame = CGRectMake([[UIScreen mainScreen] bounds].size.width/10, 20, 300, 40);
    
    //设置button颜色（把@“#4FAC74”转成UIColor）
    registerButton.backgroundColor = [UIColor colorWithRed:79/255.f green:172/255.f blue:116/255.f alpha:1];
    [registerButton setTitle:@"REGISTER" forState:UIControlStateNormal];
    
    //设置button的圆角效果
    registerButton.layer.cornerRadius = registerButton.frame.size.height/8;
    registerButton.imageView.layer.masksToBounds = YES;
    
    [buttonImage addSubview:registerButton];
    return buttonImage;
}

运行效果：

底部添加按钮

项目（目前）完整代码：


#import "ViewController.h"

@interface ViewController ()<UITableViewDelegate,UITableViewDataSource>
@property (strong, nonatomic) UITableView *registerTableView;

@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    // Do any additional setup after loading the view, typically from a nib.
    
    //调用自定义方法，创建tableView
    [self createTableviews];
}

//代码创建一个UITableView
- (void)createTableviews{
    
    //创建TableView
    self.registerTableView = [[UITableView alloc]initWithFrame:CGRectMake(0, 0, [[UIScreen mainScreen] bounds].size.width, [[UIScreen mainScreen] bounds].size.height)];
    
    //给UITableView设置背景图片
    UIImageView *backImageView = [[UIImageView alloc]initWithFrame:self.view.bounds];
    [backImageView setImage:[UIImage imageNamed:@"blurred_background"]];
    self.registerTableView.backgroundView = backImageView;
    
    //代理方法和数据源
    self.registerTableView.delegate = self;
    self.registerTableView.dataSource = self;
    
    //添加到视图中（在屏幕里显示这个TableView）
    [self.view addSubview:_registerTableView];
}

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

//返回多少个Section
- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView{
    return 1;//只有一组数据，所以只需要返回一个Section
}

//返回多少行
- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section{
    if (section == 0) {
        return 8;//需要8行数据
    }else{
        
        return 0;
    }
}

//设置行高
- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath{
    if (indexPath.section == 0) {
        
        return 80;//为了比较直观，设置的比较大
    }
    return 0;
}


//组头部的高度（即这里的标题所在视图的高度）
- (CGFloat)tableView:(UITableView *)tableView heightForHeaderInSection:(NSInteger)section{
    return 80;
}

//自定义组头部视图（即标题内容）
- (UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section{
    
    //初始化一个UIImageView，（frame会被之后的label设置，所以可以随便设置，“CGRectMake(0, 0, 0, 0)”等同于“CGRectZero”）
    UIImageView *titleImage = [[UIImageView alloc]initWithFrame:CGRectMake(0, 0, 0, 0)];
    //image的背景颜色（clearColor即背景透明）
    titleImage.backgroundColor = [UIColor clearColor];
    
    //初始化一个UILabel，并设置位置大小（计算尺寸是一门技术活，我也不太懂，😄，所以这里随便设置了一下，记得宽度等于屏幕宽）
    UILabel *titleLabel = [[UILabel alloc]initWithFrame:CGRectMake(0, 30, [[UIScreen mainScreen] bounds].size.width, 30)];
    titleLabel.text = @"Register";
    //字体颜色
    titleLabel.textColor = [UIColor whiteColor];
    
    //字体的大小适应label的宽度（很关键的地方）
    titleLabel.adjustsFontSizeToFitWidth = YES;
    
    //字体：粗体，字号：30
    titleLabel.font = [UIFont boldSystemFontOfSize:22];
    //位置：居中对齐
    titleLabel.textAlignment = NSTextAlignmentCenter;
    
    //将label放入image的视图中（即显示出来）
    [titleImage addSubview:titleLabel];
    return titleImage;
}

//组尾部高度
- (CGFloat)tableView:(UITableView *)tableView heightForFooterInSection:(NSInteger)section{
    return 100;
}
//组尾部视图
- (UIView *)tableView:(UITableView *)tableView viewForFooterInSection:(NSInteger)section{
    
    UIImageView *buttonImage = [[UIImageView alloc]initWithFrame:CGRectMake(0, 0, 0, 0)];
    //image的背景颜色（clearColor即背景透明）
    buttonImage.backgroundColor = [UIColor clearColor];
    
    //初始化一个button，类型为UIButtonTypeCustom（即自定义风格）
    UIButton *registerButton = [UIButton buttonWithType:UIButtonTypeCustom];
    //位置大小
    registerButton.frame = CGRectMake([[UIScreen mainScreen] bounds].size.width/10, 20, 300, 40);
    
    //设置button颜色（把@“#4FAC74”转成UIColor）
    registerButton.backgroundColor = [UIColor colorWithRed:79/255.f green:172/255.f blue:116/255.f alpha:1];
    [registerButton setTitle:@"REGISTER" forState:UIControlStateNormal];
    
    //设置button的圆角效果
    registerButton.layer.cornerRadius = registerButton.frame.size.height/8;
    registerButton.imageView.layer.masksToBounds = YES;
    
    [buttonImage addSubview:registerButton];
    return buttonImage;
}


//cell的内容
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{
    
    //创建cell，标识符为：myCell，类型为：UITableViewCellStyleDefault
    UITableViewCell *cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:@"myCell"];
    
    //让cell背景透明
    cell.backgroundColor = [UIColor clearColor];
    
    //让cell的字体为白色
    cell.textLabel.textColor = [UIColor whiteColor];
    //cell的字体和大小
    cell.textLabel.font = [UIFont fontWithName:@"Helvetica" size:18];

    
    if (indexPath.section == 0) {
        if (indexPath.row == 0) {//名
            //设置图标和文字内容
            cell.imageView.image = [UIImage imageNamed:@"firstName"];
            cell.textLabel.text = @"Your First Name";
            
        }else if (indexPath.row == 1){//姓
            cell.imageView.image = [UIImage imageNamed:@"lastName"];
            cell.textLabel.text = @"Your Last Name";
            
        }else if (indexPath.row == 2){//昵称
            cell.imageView.image = [UIImage imageNamed:@"userName"];
            cell.textLabel.text = @"Your User Name";
            
        }else if (indexPath.row == 3){//密码
            cell.imageView.image = [UIImage imageNamed:@"password"];
            cell.textLabel.text = @"Create Your Password";
            
        }else if (indexPath.row == 4){//确认密码
            cell.imageView.image = [UIImage imageNamed:@"password"];
            cell.textLabel.text = @"Re-enter Your Password";
            
        }else if (indexPath.row == 5){//邮箱
            cell.imageView.image = [UIImage imageNamed:@"email"];
            cell.textLabel.text = @"Enter Your Email";
        }
    }
    
    return cell;
}
@end

Step4：完善一些细节

现在，实现了添加标题和按钮：

实现注册页面（2）完成效果

但是因为不是太了解布局，也就是对于UI控件的布局距离位置还是不太熟悉，所以上图的两个控件都只是在iPhone6中看起来居中了而已，但其实并没有居中，也就是说当换成5s神马的机型，位置马上会偏移。

所有现在解决这个问题呢，我稍稍学了一下这个问题的解决方法，那就是调用当前UI控件的center属性，然后在center属性的CGPointMake中绑定一个父视图（比如当前屏幕）的x、y位置，这样就可以让这个UI控件一直居中。

    //x、y位置
    registerButton.center = CGPointMake([[UIScreen mainScreen] bounds].size.width/2, 50);

这样就可以保证这个按钮永远对齐着当前屏幕的中心位置：

5s运行效果

6s运行效果

无论屏幕尺寸如何变化，两个控件的位置始终处于正中间的位置。

2.在button按钮下面添加一段文字：

    //button下面添加一段一段文字
    UILabel *loginLabel = [[UILabel alloc]initWithFrame:CGRectMake(0, 0, 250, 20)];//宽高
    loginLabel.center = CGPointMake([[UIScreen mainScreen] bounds].size.width/2, 80);//x、y轴
    loginLabel.text = @"Already have an account?Login here";//文本
    loginLabel.textColor = [UIColor whiteColor];//字体颜色
    loginLabel.font = [UIFont boldSystemFontOfSize:22];//加粗，字体22
    loginLabel.adjustsFontSizeToFitWidth = YES;//自适应lable宽度
    [buttonImage addSubview:loginLabel];//添加到视图

button下放添加文字

将文字的"Login Here"变色

    //让“Login here”变成绿色
    NSMutableAttributedString *customStr = [[NSMutableAttributedString alloc]initWithString:loginLabel.text];//调用NSMutableAttributedString属性（自定义字符串）
    [customStr addAttribute:NSForegroundColorAttributeName value:[UIColor colorWithRed:79/255.f green:172/255.f blue:116/255.f alpha:1] range:NSMakeRange(24,loginLabel.text.length-24)];//设置颜色和要变色的部分
    loginLabel.attributedText = customStr;//将自定义的字符串传给LoginLabel

让字符串的一部分变色

step5：自定义cell内容

UITableView默认的cell的显示方式有4种：

//cell的四种样式  
       //UITableViewCellStyleDefault,       只显示图片和标题  
       //UITableViewCellStyleValue1,        显示图片，标题和子标题（子标题在右边）  
       //UITableViewCellStyleValue2,        标题和子标题  
       //UITableViewCellStyleSubtitle       显示图片，标题和子标题（子标题在下边）

但是，需要实现的效果是这样的：

模仿页面

所有默认的4种cell样式都不能实现这个效果，就必须要自定义cell的样式。

好吧，因为目前对自定义cell而言还是半知半解，所有就把cell的学习放到之后单独一篇学习笔记中吧。

这里关于UITableView的学习就到这里了。比较凌乱，但是自己还是get到一些实用的新技能。最主要最实在的还是边思考的同时又敲了代码，虽然并不算多，但是日积月累也可能是成长的一大步。

完整代码：

#import "ViewController.h"

@interface ViewController ()<UITableViewDelegate,UITableViewDataSource>
@property (strong, nonatomic) UITableView *registerTableView;

@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    // Do any additional setup after loading the view, typically from a nib.
    
    //调用自定义方法，创建tableView
    [self createTableviews];
}

//代码创建一个UITableView
- (void)createTableviews{
    
    //创建TableView
    self.registerTableView = [[UITableView alloc]initWithFrame:CGRectMake(0, 0, [[UIScreen mainScreen] bounds].size.width, [[UIScreen mainScreen] bounds].size.height)];
    
    //给UITableView设置背景图片
    UIImageView *backImageView = [[UIImageView alloc]initWithFrame:self.view.bounds];
    [backImageView setImage:[UIImage imageNamed:@"blurred_background"]];
    self.registerTableView.backgroundView = backImageView;
    
    //代理方法和数据源
    self.registerTableView.delegate = self;
    self.registerTableView.dataSource = self;
    
    //添加到视图中（在屏幕里显示这个TableView）
    [self.view addSubview:_registerTableView];
}

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

//返回多少个Section
- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView{
    return 1;//只有一组数据，所以只需要返回一个Section
}

//返回多少行
- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section{
    if (section == 0) {
        return 8;//需要8行数据
    }else{
        
        return 0;
    }
}

//设置行高
- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath{
    if (indexPath.section == 0) {
        
        return 80;//为了比较直观，设置的比较大
    }
    return 0;
}


//组头部的高度（即这里的标题所在视图的高度）
- (CGFloat)tableView:(UITableView *)tableView heightForHeaderInSection:(NSInteger)section{
    return 80;
}

//自定义组头部视图（即标题内容）
- (UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section{
    
    //初始化一个UIImageView，（frame会被之后的label设置，所以可以随便设置，“CGRectMake(0, 0, 0, 0)”等同于“CGRectZero”）
    UIImageView *titleImage = [[UIImageView alloc]initWithFrame:CGRectMake(0, 0, 0, 0)];
    //image的背景颜色（clearColor即背景透明）
    titleImage.backgroundColor = [UIColor clearColor];
    
    //初始化一个UILabel，并设置位置大小（计算尺寸是一门技术活，我也不太懂，😄，所以这里随便设置了一下，记得宽度等于屏幕宽）
    UILabel *titleLabel = [[UILabel alloc]initWithFrame:CGRectMake(0, 0, [[UIScreen mainScreen] bounds].size.width, 30)];
    titleLabel.center = CGPointMake([[UIScreen mainScreen] bounds].size.width/2, 50);
    
    titleLabel.text = @"Register";
    //字体颜色
    titleLabel.textColor = [UIColor whiteColor];
    
    //字体的大小适应label的宽度（很关键的地方）
    titleLabel.adjustsFontSizeToFitWidth = YES;
    
    //字体：粗体，字号：30
    titleLabel.font = [UIFont boldSystemFontOfSize:22];
    //位置：居中对齐
    titleLabel.textAlignment = NSTextAlignmentCenter;
    
    //将label放入image的视图中（即显示出来）
    [titleImage addSubview:titleLabel];
    return titleImage;
}

//组尾部高度
- (CGFloat)tableView:(UITableView *)tableView heightForFooterInSection:(NSInteger)section{
    return 100;
}
//组尾部视图
- (UIView *)tableView:(UITableView *)tableView viewForFooterInSection:(NSInteger)section{
    
    UIImageView *buttonImage = [[UIImageView alloc]initWithFrame:CGRectMake(0, 0, 0, 0)];
    //image的背景颜色（clearColor即背景透明）
    buttonImage.backgroundColor = [UIColor clearColor];
    
    //初始化一个button，类型为UIButtonTypeCustom（即自定义风格）
    UIButton *registerButton = [UIButton buttonWithType:UIButtonTypeCustom];
    //大小
    registerButton.frame = CGRectMake(0,0, 300, 40);
    //x、y位置
    registerButton.center = CGPointMake([[UIScreen mainScreen] bounds].size.width/2, 30);
    
    //设置button颜色（把@“#4FAC74”转成UIColor）
    registerButton.backgroundColor = [UIColor colorWithRed:79/255.f green:172/255.f blue:116/255.f alpha:1];
    [registerButton setTitle:@"REGISTER" forState:UIControlStateNormal];
    
    //设置button的圆角效果
    registerButton.layer.cornerRadius = registerButton.frame.size.height/8;
    registerButton.imageView.layer.masksToBounds = YES;
    
    [buttonImage addSubview:registerButton];
    
    //button下面添加一段一段文字
    UILabel *loginLabel = [[UILabel alloc]initWithFrame:CGRectMake(0, 0, 250, 20)];//宽高
    loginLabel.center = CGPointMake([[UIScreen mainScreen] bounds].size.width/2, 65);//x、y轴
    loginLabel.text = @"Already have an account?Login here";//文本
    loginLabel.textColor = [UIColor whiteColor];//字体颜色
    loginLabel.font = [UIFont boldSystemFontOfSize:22];//加粗，字体22
    loginLabel.adjustsFontSizeToFitWidth = YES;//自适应lable宽度
    [buttonImage addSubview:loginLabel];//添加到视图
    
    

    //让“Login here”变成绿色
    NSMutableAttributedString *customStr = [[NSMutableAttributedString alloc]initWithString:loginLabel.text];//调用NSMutableAttributedString属性（自定义字符串）
    [customStr addAttribute:NSForegroundColorAttributeName value:[UIColor colorWithRed:79/255.f green:172/255.f blue:116/255.f alpha:1] range:NSMakeRange(24,loginLabel.text.length-24)];//设置颜色和要变色的部分
    loginLabel.attributedText = customStr;//将自定义的字符串传给LoginLabel

    
    return buttonImage;
}


//cell的内容
- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{
    
    //创建cell，标识符为：myCell，类型为：UITableViewCellStyleDefault
    UITableViewCell *cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault reuseIdentifier:@"myCell"];
    
    //让cell背景透明
    cell.backgroundColor = [UIColor clearColor];
    
    //让cell的字体为白色
    cell.textLabel.textColor = [UIColor whiteColor];
    //cell的字体和大小
    cell.textLabel.font = [UIFont fontWithName:@"Helvetica" size:18];

    
    if (indexPath.section == 0) {
        if (indexPath.row == 0) {//名
            //设置图标和文字内容
            cell.imageView.image = [UIImage imageNamed:@"firstName"];
            cell.textLabel.text = @"Your First Name";
            
        }else if (indexPath.row == 1){//姓
            cell.imageView.image = [UIImage imageNamed:@"lastName"];
            cell.textLabel.text = @"Your Last Name";
            
        }else if (indexPath.row == 2){//昵称
            cell.imageView.image = [UIImage imageNamed:@"userName"];
            cell.textLabel.text = @"Your User Name";
            
        }else if (indexPath.row == 3){//密码
            cell.imageView.image = [UIImage imageNamed:@"password"];
            cell.textLabel.text = @"Create Your Password";
            
        }else if (indexPath.row == 4){//确认密码
            cell.imageView.image = [UIImage imageNamed:@"password"];
            cell.textLabel.text = @"Re-enter Your Password";
            
        }else if (indexPath.row == 5){//邮箱
            cell.imageView.image = [UIImage imageNamed:@"email"];
            cell.textLabel.text = @"Enter Your Email";
        }
    }
    
    return cell;
}
@end

下一篇，自动布局（（AutoLayout）的"深入"学习，加油!

UITableView - 学习笔记(使用)

开始任务：

Step1：分析

Step2：搭建基本页面

Step3：进一步完善

项目（目前）完整代码：

Step4：完善一些细节

step5：自定义cell内容

这里关于UITableView的学习就到这里了。比较凌乱，但是自己还是get到一些实用的新技能。最主要最实在的还是边思考的同时又敲了代码，虽然并不算多，但是日积月累也可能是成长的一大步。

相关文章

网友评论

延伸阅读

深度阅读

栏目导航

热点阅读