10

I have a UITableView which contains x amount of cells. However, I want to have 20 px distance between each cell. My tableview only contains one section.

I have googled around and searched the forum, but I couldn't find anything that works for my purpose.

Is it possible to set content offset to the cell, or the imageview inside the cell?

Can someone please help me?

Magnus
  • 1,444
  • 5
  • 22
  • 31
  • Are the cells created by a xib file, or in code? – bneely Feb 12 '12 at 22:29
  • How do you expect it to look? How many cells are there on average? – bneely Feb 12 '12 at 22:32
  • There are about 30 cells. I want row2 to be 20px under row1, row3 to be 20px under row2. Catch my drift? – Magnus Feb 12 '12 at 22:35
  • What are you expecting to see between each cell? You say that the tableView:heightForRowAtIndexPath: method doesn't do what you want, so please clarify the look you are trying to achieve. – bneely Feb 12 '12 at 22:37
  • I have the tableview over a uiimageview, i just want there to be 20px between each cell, so that parts of the image shows between the cells. So basically nothing inbetween, except "air". – Magnus Feb 12 '12 at 22:40
  • Sure. Any idea how I can accomplish it? – Magnus Feb 12 '12 at 22:42
  • Have you tried setting a custom image as the UITableView backgroundView, then using a grouped tableview with one cell per section? – bneely Feb 12 '12 at 22:43
  • That's what I was trying to avoid doing :P I thought there might be an easier way to do it. – Magnus Feb 12 '12 at 22:48
  • @Magnus: How hard can it be? Just make `numberOfSectionsInTableView:` return what `tableView:numberOfRowsInSection:` would normally return. Then make `tableView:numberOfRowsInSection:` return 1. In `tableView:cellForRowAtIndexPath:`, use `indexPath.section` instead of `indexPath.row`. – Emile Cormier Feb 12 '12 at 22:59
  • Its a duplicate question of [http://stackoverflow.com/questions/7189523/how-to-give-space-between-two-cells-in-tableview](http://stackoverflow.com/questions/7189523/how-to-give-space-between-two-cells-in-tableview) Check this link for the best answer.! – obaid Oct 24 '12 at 08:11
  • UICollectionView was introduced to handle a lot of rudimentary issues surrounding UITableView, this being one of them. As a result, developers can directly specify minimum line spacing and cell spacing for each item in a UICollectionView to satisfy their layout requirements. – noobular Dec 03 '14 at 02:40

3 Answers3

8

one alternate solution of this problem is just implement the method tableview:heightForFooterInSection like 

-(CGFloat)tableView:(UITableView *)tableView heightForFooterInSection:(NSInteger)section{

    return 5;
}

And then implement the tableView:ViewForFooterInSection like below //Returns a transparent footer actually.

-(UIView *)tableView:(UITableView *)tableView viewForFooterInSection:(NSInteger)section{ 

    UIView *view = [[UIView alloc]init]; 
    [view setAlpha:0.0F]; 
    return view; 

}
Gyanendra Singh
  • 1,483
  • 12
  • 15
  • The only downside of this is it adds extra space between the sections, and not between the rows. And if you do need to group rows in several sections, then this solution does not work. – Zorayr Dec 24 '13 at 18:51
7

Based on the follow-up in comments above, it sounds like you should use the UITableView backgroundView property to set your custom background image, then use a grouped table view with one cell per section. To me, this sounds like the quickest and easiest way to implement the type of UI you're describing.

Relevant portions of UITableView API documentation:

@property(nonatomic, readwrite, retain) UIView *backgroundView
...
- (NSInteger)numberOfRowsInSection:(NSInteger)section

And UITableViewDataSource protocol:

- (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
bneely
  • 9,083
  • 4
  • 38
  • 46
  • that's what I ended up doing. Thanks man! – Magnus Feb 12 '12 at 22:55
  • 2
    I think this is a pretty bad solution if you need to present a single array as a single section with its own section header, and another array in another section with another section header. – Matthew Quiros Jul 30 '13 at 03:53
-3

In your UITableViewDelegate, add this following method:

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

From there you can control the total height of each cell independently. Don't do this for large tables, however, as it slows things down.

kamprath
  • 2,220
  • 1
  • 23
  • 28
  • 3
    Already tried this. This just changes the height for each cell, not distance between cells – Magnus Feb 12 '12 at 22:30
  • You should create cell layouts that have the padding and appearance you are looking for. – kamprath Feb 12 '12 at 22:32
  • This method is common practice for the problem you described. If you already tried it, you should mention it in the original question. – bneely Feb 12 '12 at 22:33
  • 4
    @bneely OP explained what he wanted quite well, "...I want to have 20 px distance between each cell. My tableview only contains one section." Notice the between each cell, not cell height. – TigerCoding Feb 12 '12 at 23:06
  • @Javy You have to manually create the aesthetic of distance between each cell by setting cell height and then creating the appearance of margins and padding with the cell such that you get the desired look of distance between each cell. – kamprath Feb 14 '12 at 17:24