How to give space between two cells in tableview?

Question

I want a space between two cell in table view,

I want cell like this,

<

Answer 1

If someone looking for Swift version. Here you go.

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.userInteractionEnabled = false
    header.backgroundColor = UIColor.clearColor()
    return header
}

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

Answer 2

For spacing between cells like the ones in your screenshot, there is no need for custom cells (for their look anyway, like the gradient bkg and so on, this could anyway be a good idea, but this won't help for your spacing between cells)

To achieve this kind of spacing, simply use different sections in your UITableView.

[EDIT] Everything is explained In Apple's TableView Programming Guide (and that's worth reading it, as it contains a lot of stuff you should know about tableviews)

Answer 3

best way to do that use xib file and give top and bottom constraint to it. for example, here I give bottom constraint 10 and make sure give perfect height to cell as shown as given below.here in code 'joinTableViewCell' is fileName of xib file.

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 4

I don't know why all the answers that complicated. KIS, only using storyboard I've put a UIView inside the tableCell Content View; now the UIView height is less than Content View height, and that's it!

Play with the Content View color and the UIView color to get the desired result.

Answer 5

you can't set distance between cells directly, but you can set the height for header in section to achieve the same result.

1.set the numbers of cell you need as sections:

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

2.return only 1 cell for each section

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

3.set the height for header in section to set space between cells

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

4.set the header's background color to clear color, so it won't look weird

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

Answer 6

You don't have to assign each section for each cell. Just create a UIView (container) inside your cell, margin it with cell's view. And we layout components like label, text, image on that container.