Styled Table View

Question

I saw this on this on the settings section of the Facebook app for iOS7 and I was wondering how the effect of this UITableView is achieved with the margins all around the section. I thought it could be done with UICollectionView with each cell having the look of having 2 or 3 "UITableViewCell's" in it. Is there a better way to achieve this though?

Thanks in advance

Facebook settings screenshot

That's how grouped table views looked until iOS 7. – rmaddy Jul 25 '14 at 18:20 — rmaddy, Jul 25 '14 at 18:20
Yeah, so how do I do this in iOS7 now? – jacobsieradzki Jul 25 '14 at 18:20 — jacobsieradzki, Jul 25 '14 at 18:20

score 2 · Answer 1 · edited May 23 '17 at 12:04

UITableView sections can either be "plain" or "grouped." The above is an example of "grouped" sections.

The inset margins were the common design until iOS7. That changed along w/other design conventions in order to maximize use of the screen. Sections in iOS7 can have upper/lower margins with headers and footers, but now extend to the left & right edges.

If you want to recreate the side margins, you can use autolayout to adjust the width of the entire tableView, as explained in this answer

score 0 · Answer 2 · answered Jul 25 '14 at 18:21

0

It's probably a slight modification to UITableView's UIViewTableStyleGrouped.

tableView.style = UITableViewStyleGrouped;

answered Jul 25 '14 at 18:21

esqew

42,425
27
92
132

Styled Table View

2 Answers2