ios软件开发 设置cell之间的间距

这两天在项目中遇到一个问题，就是需要将cell之间留出一点间距，一般我们在创建出cell都会有分割线加以区分，所以自己想了一下cell之间的间距如何实现。cell之间的间距实现方法我想到的有两种，首先来说第一种：

一、利用UITableCell的UILayer里面的borderWidth属性来设置cell之间的间距。代码实现如下

<pre name="code" class="objc">#import "ViewController.h"

@interface ViewController ()<UITableViewDelegate, UITableViewDataSource>

{
    NSArray *colorArray;
}

@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    
    self.view.backgroundColor = [UIColor whiteColor];
    
    //设置cell之间的间隔方法
    //第一种:利用系统初始化cell的类UITableViewCell 通过设置CGLayer的borderWidth属性来改变cell之间的间隔
    //初始化表视图
    UITableView *tableView = [[UITableView alloc] initWithFrame:self.view.frame style:UITableViewStylePlain];
    tableView.delegate = self;
    tableView.dataSource = self;
    [self.view addSubview:tableView];
    
    [self colorArr];
   
}

#pragma mark ---隐藏状态栏
- (BOOL)prefersStatusBarHidden{
    return YES;
}

#pragma mark ---颜色数组
- (void)colorArr{
     colorArray = @[[UIColor colorWithRed:1.000 green:0.435 blue:0.812 alpha:1.000],[UIColor colorWithRed:0.800 green:0.400 blue:1.000 alpha:1.000],[UIColor colorWithRed:0.400 green:0.800 blue:1.000 alpha:1.000],[UIColor colorWithRed:0.400 green:1.000 blue:0.800 alpha:1.000],[UIColor colorWithRed:0.800 green:1.000 blue:0.400 alpha:1.000],[UIColor colorWithRed:1.000 green:0.800 blue:0.400 alpha:1.000],[UIColor colorWithRed:1.000 green:0.400 blue:0.400 alpha:1.000],[UIColor colorWithRed:1.000 green:0.800 blue:0.400 alpha:1.000],[UIColor colorWithRed:0.400 green:0.800 blue:1.000 alpha:1.000],[UIColor colorWithRed:1.000 green:0.435 blue:0.812 alpha:1.000]];
}

#pragma mark ---tableDelegate
- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section{
    //返回12行
    return 12;
}

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

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{
    static NSString *cellID = @"cellID";
    
    UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:cellID];
    
    if (!cell) {
        
        cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleValue1 reuseIdentifier:cellID];
        
        //cell选中样式为无
        cell.selectionStyle = UITableViewCellSelectionStyleNone;
        
        //cell背景颜色随机产生
        int index = arc4random()%colorArray.count;
        cell.backgroundColor = colorArray[index];
        
        //设置cell的拐角
        cell.layer.cornerRadius = 5;
        cell.layer.masksToBounds = YES;
        
        //设置cell之间的间距
        //根据需求可以设置不同的间距
        cell.layer.borderWidth = 2;
        cell.layer.borderColor = [UIColor whiteColor].CGColor;
        
    }
 
    return cell;
}

效果：

          没有设置cell之间的间距                                  设置了cell之间的间距

<img src="https://img-blog.youkuaiyun.com/20150920124412520?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQv/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center" width="300" height="400" alt="" />           <img src="https://img-blog.youkuaiyun.com/20150920124531763?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQv/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center" width="300" height="400" alt="" />

第二种实现办法：通过自定义cell实现

代码如下

1、自定义cell实现方法里面

<pre name="code" class="objc">#import "CustoTableViewCell.h"
#define S_WIDTH CGRectGetWidth([UIScreen mainScreen].bounds)

@interface CustoTableViewCell()
{
    NSArray *colorArray;
   
}
@end

@implementation CustoTableViewCell


- (instancetype)initWithStyle:(UITableViewCellStyle)style reuseIdentifier:(NSString *)reuseIdentifier{
    
    self = [super initWithStyle:style reuseIdentifier:reuseIdentifier];
    if (self) {
        
     colorArray = @[[UIColor colorWithRed:1.000 green:0.435 blue:0.812 alpha:1.000],[UIColor colorWithRed:0.800 green:0.400 blue:1.000 alpha:1.000],[UIColor colorWithRed:0.400 green:0.800 blue:1.000 alpha:1.000],[UIColor colorWithRed:0.400 green:1.000 blue:0.800 alpha:1.000],[UIColor colorWithRed:0.800 green:1.000 blue:0.400 alpha:1.000],[UIColor colorWithRed:1.000 green:0.800 blue:0.400 alpha:1.000],[UIColor colorWithRed:1.000 green:0.400 blue:0.400 alpha:1.000],[UIColor colorWithRed:1.000 green:0.800 blue:0.400 alpha:1.000],[UIColor colorWithRed:0.400 green:0.800 blue:1.000 alpha:1.000],[UIColor colorWithRed:1.000 green:0.435 blue:0.812 alpha:1.000]];
        
        //背景颜色随机产生
        int index = arc4random()%colorArray.count;
 
        UIView *view = [[UIView alloc] initWithFrame:CGRectMake(0, 0, S_WIDTH, 58)];
        view.backgroundColor = colorArray[index];
        [self.contentView addSubview:view];
    }
    
    return self;
}

2、ViewController.m里面

<span style="color:#333333;"></span><pre name="code" class="objc">#import "ViewController.h"
#import "CustoTableViewCell.h"

@interface ViewController ()<UITableViewDelegate, UITableViewDataSource>

@end

@implementation ViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    
    self.view.backgroundColor = [UIColor whiteColor];
    
    //设置cell之间的间隔方法
    //第一种:利用系统初始化cell的类UITableViewCell 通过设置CGLayer的borderWidth属性来改变cell之间的间隔
    //初始化表视图
    UITableView *tableView = [[UITableView alloc] initWithFrame:self.view.frame style:UITableViewStylePlain];
    tableView.delegate = self;
    tableView.dataSource = self;
    [self.view addSubview:tableView];
   
}

#pragma mark ---隐藏状态栏
- (BOOL)prefersStatusBarHidden{
    return YES;
}


#pragma mark ---tableDelegate
- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section{
    //返回12行
    return 12;
}

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

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath{
    static NSString *cellID = @"cellID";
    
    CustoTableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:cellID];
    
    if (!cell) {
        
        cell = [[CustoTableViewCell alloc] initWithStyle:UITableViewCellStyleValue1 reuseIdentifier:cellID];
        
        //cell选中样式为无
        cell.selectionStyle = UITableViewCellSelectionStyleNone;
        
        //取消分割线
        tableView.separatorStyle = UITableViewCellSeparatorStyleNone;
               
        //设置cell的拐角
        cell.layer.cornerRadius = 5;
        cell.layer.masksToBounds = YES;

    }
    
    return cell;
}

实现效果如图

<span style="color:#333333;"><img src="https://img-blog.youkuaiyun.com/20150920130915269?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQv/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center" width="300" height="400" alt="" />
</span>