Question

我想在表视图中的两个单元格之间留一个空格

我想要这样的细胞，

enter image description here

我该怎么做？

Answer 1

您无法直接设置单元格之间的距离，但您可以在截面中设置标题的高度以获得相同的结果。

1.设置所需的单元格数量：

- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView 
{
    return 3; // in your case, there are 3 cells
}

2.每个部分只返回1个单元格

- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section
{
    return 1;
}

3.设置标题中标题的高度以设置单元格之间的空间

- (CGFloat)tableView:(UITableView *)tableView heightForHeaderInSection:(NSInteger)section
{
    return 10.; // you can have your own choice, of course
}

4.设置标题的背景颜色以清除颜色，因此看起来不会很奇怪

- (UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section
{
    UIView *headerView = [[UIView alloc] init];
    headerView.backgroundColor = [UIColor clearColor];
    return headerView;
}

Answer 2

在TableView中获取两个单元格之间空间的最佳方法，以这种方式在numberofsections的委托方法中声明所需的部分数量

例如，您有10个对象的数组

- (NSInteger)numberOfSectionsInTableView:(UITableView *)tableView {
  return [array count]; //array count returns 10
}

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


    return 1;// this should be one because it will create space between two cells if you want space between 4 cells you can modify it.
}

然后重要的一点是在cellForRowAtIndexPath委托方法中你需要使用indexpath.section而不是indexpath.row

cell.textLabel.text=[NSString stringWithFormat:@"%@",[array objectAtIndex:indexPath.section]];

那就是检查你的tableview中两个单元格之间的空间。享受！

Answer 3

你也可以在UITableView中创建一个TableView的部分...这个方法是强制性的，所以创建部分，在每个部分你可以像你的图片一样创建单个单元格。

Answer 4

多个部分的答案可行，但它非常脆弱，并且不允许实际部分。相反，您应该创建一个自定义单元格，或者在底部和/或顶部只有间隙的自定义单元格原型。

使用IB中的支柱和弹簧来保持均匀的间隙，并使用heightForRowAtIndexPath返回包含间隙的高度。

Answer 5

目标 - C

 UIView* separatorLineView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 320, 3)];/// change size as you need.       
 separatorLineView.backgroundColor = [UIColor whiteColor];// you can also put image here
 [cell.contentView addSubview:separatorLineView];

Swift 3（这同样适用于Swift 4）

var separatorLineView = UIView(frame: CGRect(x: 0, y: 0, width: 320, height: 3))
/// change size as you need.       
separatorLineView.backgroundColor = UIColor.white
// you can also put image here
cell.contentView.addSubview(separatorLineView)

它对我有用。

Answer 6

如果有人在寻找 Swift 版本。你走了。

func tableView(tableView: UITableView, heightForHeaderInSection section: Int) -> CGFloat {
    return 10; // space b/w cells
}

func numberOfSectionsInTableView(tableView: UITableView) -> Int {
    return items.count // count of items
}

func tableView(tableView: UITableView, viewForHeaderInSection section: Int) -> UIView? {
    let header = UIView()
    header.backgroundColor = UIColor.clearColor()
    return header
}

func tableView(tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
    return 1
}

Answer 7

对于那些寻找在不使用剖面的情况下显示细胞间隙的替代方法的人，您可能希望显示其他颜色和高度，如下所示。使用clearColor作为间距。

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
{
    tableView.separatorStyle = UITableViewCellSeparatorStyleNone;

    if (indexPath.row % 2 == 1)
    {
        static NSString *CellIdentifier = @"cellID1";
        UITableViewCell *cell = (UITableViewCell *)[tableView dequeueReusableCellWithIdentifier:CellIdentifier];
        if (cell == nil) {
            cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault
                                            reuseIdentifier:CellIdentifier];
        }

        cell.backgroundColor = [UIColor colorWhite];

        return cell;

    } else {

        static NSString *CellIdentifier2 = @"cellID2";
        UITableViewCell *cell2 = (UITableViewCell *)[tableView dequeueReusableCellWithIdentifier:CellIdentifier2];
        if (cell2 == nil) {
            cell2 = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleDefault
                                            reuseIdentifier:CellIdentifier2];
        }
        cell2.backgroundColor = [UIColor clearColor];

        return cell2;
    }

}

- (CGFloat)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath
{
    if (indexPath.row % 2 == 1) {
        return 40.0;
    } else {
        return 2.0;
    }
}

Answer 8

在返回单元格之前，在cellForRowAtIndexPath UITableViewDelegate方法中添加这些行。

let separator = UIView(frame: CGRectMake(0, 0, cell!.bounds.size.width, 1))
separator.backgroundColor = UIColor.whiteColor()
cell.contentView.addSubview(separator)

Answer 9

有时，您可能真的希望将tableview分成行，并且有1个部分。例如，如果您需要在滚动该部分时显示该表视图的自定义标题，则可能会发生这种情况。

在这种情况下，我建议做的是返回比单元格中正常高度更大的浮动：

- (float)tableView:(UITableView *)tableView heightForRowAtIndexPath:(NSIndexPath *)indexPath

然后确保表样式为Plain，并且单元格分隔符为none。您可以在XIB文件本身或代码中执行此操作：

self.tableView.separatorStyle = UITableViewCellSeparatorStyleNone; self.tableView.style = UITableViewStylePlain;

也许还将单元格的选择样式添加到无（否则看起来您选择的不仅仅是单元格的可见部分）。

cell.selectionStyle = UITableViewCellSelectionStyleNone;

这会给出单元格之间空间的印象，但同时将它们保留为一个部分中的行（有时候就是你想要的那样）。

Answer 10

我使用了一种简单快捷的方法（使用故事板）

在控制器中添加UITableView
将分隔符样式设置为none（来自属性检查器）
将行的高度从所需高度
现在在单元格中添加一个图像，从左侧和右侧固定它，但留出5个点的空间（用于填充感觉）并将图像的背景设置为与单元格所需的背景相同

当加载表视图时，感觉单元格之间有空格。

Answer 11

对于像截图中的单元格之间的间距，不需要自定义单元格（无论如何，无论如何，如渐变bkg等等，无论如何这可能是一个好主意，但这无济于事你的细胞之间的间距）

要实现这种间距，只需在UITableView中使用不同的部分。

[编辑]一切都被解释为In Apple's TableView Programming Guide（这是值得一读的，因为它包含了很多关于表格视图的知识）

Answer 12

您在视觉上尝试实现的内容与在容器视图中添加每个单元格的内容相同，具有灰色背景，并且在单元格内具有该视图。我认为不需要在单元格之间添加空格。

Answer 13

*使用IOS 9 XCODE 7.3 *

实现此目的的最直接方法是将此代码添加到您的cellForRowAtIndexPath方法中。

    cell.separatorInset.left = 20.0
    cell.separatorInset.right = 20.0
    cell.separatorInset.top = 20.0
    cell.separatorInset.bottom = 20.0
    cell.layer.borderWidth = 3
    cell.layer.cornerRadius = 20.0
    cell.layer.borderColor = UIColor.flatSkyBlueColorDark().CGColor

然后转到你的故事板并点击tableview。转到标识检查器并将视图的背景颜色更改为方法中设置的任何边框颜色。瞧！使用这些值来获得所需的输出。希望这有帮助！

注意：如果使用Chameleon库，您必须在代码中设置视图的背景颜色，而不是通过故事板插件。由于某种原因，颜色似乎是阴影。

Answer 14

我不知道为什么所有的答案都很复杂。 KIS，只使用故事板我在表格内容中放置了一个UIView;现在UIView的高度小于Content View的高度，就是这样！

使用内容视图颜色和UIView颜色进行播放，以获得所需的结果。

Answer 15

使用 Swift ：

轻松解决方案

// Inside UITableViewCell subclass
override func layoutSubviews() {
    let f = contentView.frame
    let fr = UIEdgeInsetsInsetRect(f, UIEdgeInsetsMake(10, 10, 10, 10))
    contentView.frame = fr
}

或一行代码

override func layoutSubviews() {
    contentView.frame = UIEdgeInsetsInsetRect(contentView.frame, UIEdgeInsetsMake(10, 10, 10, 10))
}

<强>结果

Answer 16

我所做的只是通过创建一个比我想要的更大的单个自定义单元格（单元格+间隙/ 2）来模拟空间，然后将我所有单元格的内容放入内部 - 图。

然后将您单元格的最顶层视图作为背景颜色，将内部视图作为实际单元格。而且，当它实际上只是一个带边框的较大单元格时，你会产生在单元格之间留有空间的错觉。

Answer 17

在您的cellForRowAt

中

cell.layer.borderWidth = 2
cell.layer.cornerRadius = 10
cell.layer.borderColor = UIColor.systemBackground.cgColor

Answer 18

这是我使用Swift 3的方法：

在ViewDidLoad（）中，添加：

var sHTML = "";
var rawFile = new XMLHttpRequest();
rawFile.open("GET", "file://~/Templates/NewGridTemplate.txt", true);
      sHTML = rawFile.responseText;

在tableview“CellForRowAt”中，添加以下内容：

self.tableView.rowHeight = 500.0

Answer 19

使用xib文件并为其赋予顶部和底部约束的最佳方法。例如，在这里我给底部约束10，并确保给单元格完美的高度，如下所示。这里的代码“ joinTableViewCell”是xib文件的fileName。

enter image description here

extension JoinTableViewController: UITableViewDataSource,UITableViewDelegate {
    
    
    func tableView(_ tableView: UITableView, numberOfRowsInSection section: Int) -> Int {
        return 4
    }
    
    func tableView(_ tableView: UITableView, cellForRowAt indexPath: IndexPath) -> UITableViewCell {
        let cell = Bundle.main.loadNibNamed("joinTableViewCell", owner: self, options: nil)?.first as! joinTableViewCell
        cell.ImgView.layer.masksToBounds = true
        cell.ImgView.cornerRadius(cell.ImgView.bounds.width / 2)
        cell.lblName.text = "Christian Bell"
        cell.lblJoin.text = "Joined"+"\t"+"Sep 3"
        return cell
    }
    
    func tableView(_ tableView: UITableView, heightForRowAt indexPath: IndexPath) -> CGFloat {
        return 90
    }
    
    
    
}

Answer 20

1）首先在表格视图中创建2个部分。 2）创建一个空单元格。 3）使用要显示的数据创建单元格。 4）使用方法

（CGFloat）tableView：（UITableView *）tableView heightForRowAtIndexPath：（NSIndexPath *）indexPath { if（indexPath.section == 0）{

if（indexPath.row％2！= 1）{ 返回15.0; } else { 返回100; } } 其他
```
if (indexPath.row % 2 != 1) {
    return 100.0;
} else {
    return 15.0;
}
```

}

它会在细胞之间增加空间。它对我有用。

Answer 21

我用的是：

override func tableView(tableView: UITableView, heightForRowAtIndexPath indexPath: NSIndexPath) -> CGFloat {
    return 194.0;
}

override func tableView(tableView: UITableView, willDisplayCell cell: UITableViewCell, forRowAtIndexPath indexPath: NSIndexPath) {
    cell.contentView.backgroundColor = UIColor.clearColor()
    let whiteRoundedView : UIView = UIView(frame: CGRectMake(0, 0, self.view.frame.size.width, 185))

    whiteRoundedView.backgroundColor = UIColor( red: CGFloat(61.0/255.0), green: CGFloat(117.0/255.0), blue: CGFloat(147.0/255.0), alpha: CGFloat(1.0))

    whiteRoundedView.layer.masksToBounds = false
    whiteRoundedView.layer.cornerRadius = 3.0
    whiteRoundedView.layer.shadowOffset = CGSizeMake(-1, 1)
    whiteRoundedView.layer.shadowOpacity = 0.5
    cell.contentView.addSubview(whiteRoundedView)
    cell.contentView.sendSubviewToBack(whiteRoundedView)
}

从以下位置获取颜色代码RGB值：

Answer 22

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

    return __titlesArray.count;
}

- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section
{
    return 1;
}
-(CGFloat)tableView:(UITableView *)tableView heightForHeaderInSection:(NSInteger)section
{
    return 10;
}
-(UIView *)tableView:(UITableView *)tableView viewForHeaderInSection:(NSInteger)section
{
    UIView *header = [[UIView alloc]init];
    header.backgroundColor = [UIColor clearColor];
    return header;

}

Answer 23

我建议创建一个自定义的UITableViewCell基类，并使用如下所示的类

创建自定义UITableViewCell类
在新课程中创建一个UIView，这将作为＆＃39; baseContentView＆＃39;它将成为UITableViewCell.contentView＆＃39; UITableViewCell.contentView＆＃39;
调整顶部＆＃39;填充＆＃39; on＆＃39; baseContentView＆＃39; （这将是分隔符/间隙）来自父视图（UITableViewCell.contentView）
从此类继承所有自定义类，而不是UITableViewCell
将所有内容/子视图添加到＆＃39; baseContentView＆＃39;而不是“self.contentView＆＃39;

您可以使用＆＃39;填充＆＃39;根据您的需要。

Answer 24

您不必为每个单元格分配每个部分。只需在单元格内创建一个UIView（容器），用单元格视图对其进行边距处理。我们在该容器上布置标签，文本，图像等组件。

Answer 25

在Table View DataSource中，有两个方法，分别是段数和行数在部分返回3; 在行中返回1;

Answer 26

我已经检查了所有答案，但我认为这是最简单的方法：

 UIView * theContentView = [UIView alloc]initWithFrame:CGRectMake(0,gap,width,height)];
 theContentView.backgroundcolor = [UIColor lightGrayColor];//contentColor
 cell.backgroundcolor = [UIColor blackColor];//gapColor
 [cell addSubview: theContentView]

原型代码说你可以创建一个子视图来显示单元格的内容，剩下的就是你想要的差距。

如何在tableview中的两个单元格之间留出空间？

26 个答案: