Grouped UITableView and Horizontal Fields

Question

I have a grouped UITableView that was really designed to look beautiful in portrait mode for the iPhone. There is auto-creation in its cell subzones, so they are stretched in landscape mode, but this makes it much less aesthetic - the cells just look too wide for their contents.

Now I am making this a universal application, but on the iPad the automation causes even more stretching and looks simply unacceptable.

It would be ideal if I could make groups of UITableView cells a fixed width (or maximum width), or if I could somehow control horizontal margins.

Having not received support for this in UITableView, I made several quick attempts to subclass it to limit its size during layout and, alternatively, introduce a container view to make UITableView only autoresist only vertically. Both approaches work, but create new problems: scrolling does not work when scrolling through fields, and now I have to make a transparent UITableView background (which contradicts Apple's recommendations), since now there is a background gap between the UITableView frame and the field.

Has anyone found a trick to solve my problem (i.e. limit the width of groups in a UITableView, causing the fields to expand to fill the width of the view) or an open source solution?

Answer 1

Good news! I finally found a way to achieve this satisfactorily with just a few code changes:

• Cell compression by subclassing UITableViewCell and overriding -setFrame as per the solution of this article:
  How to set cell width in UITableView in grouped style
• And to add vertical padding, using the contentInset property of a UITableView (inherited from UIScrollView) works very well.

Answer 2

You can always keep the standard table view and provide custom backgrounds with transparent sides for the table view cell so that they look smaller than them.

Cocoa Love has a great article on how to do this: A simple custom UITableView drawing .

The main point of the article is that you need to create six different versions of the background and specify the correct one when tableView:cellForRowAtIndexPath: requests a cell. You will need one with rounded corners at the top (for the first row), one with rounded corners at the bottom (for the bottom row of the section) and one with all four corners rounded (if there is only one line in the section). Then you will need the same three, but customized for the “selected” version of each line.