UITableViewCells of different heights place their accessoryViews at different X positions

Question

My app has some table cells that vary in height. The cells can also have a UIButton set to be a detail disclosure button (round, blue with arrow) as their accessory view.

Depending on the height of the cell, the accessory view is positioned differently. At first I thought it was my layout code for my cell that was causing the problem, so I set up a quick independent test that uses vanilla UITableCells to remove the possibility that it could be my fault.

I set up a view in interface builder, and just added a view table cells to the view, set their heights to different values and then added a detail disclosure button to each. Nothing more, nothing less.

This is what I see:

UITableViewCells with different x values http://jasarien.com/jing/accessoryView_x_difference.png

I added the size guides (thanks to Xscope) so you can see the difference in the accessory view x positions.

The heights are:

• top 37px
• mid 68px
• bottom 44px (default, untouched height)

If I increase the height any heigher than 68px the accessory view doesn't move any further to the left.

Is this a bug? Is there any way I can prevent this from happening?

Here's the test project to reproduce.

TableViewCellHeightsTest.zip

Answer 1

I got the same problem when I downloaded your file. Instead of setting the detail disclosure buttons manually and assigning them to cells as outlets, delete all disclosure indicators and try setting them this way instead:

Answer 2

Note: I set the background color of the content view to blue for ease of view.

Figure 1 (accessory view height is 17.0)

I was facing this problem and had the luxury of 2 colleagues helping me figure out the cause.

We find out that when using the default UITableViewCell (In my case, of style UITableViewCellStyleDefault though I believe it applies to all other styles), if your accessory view's height is anything above the magic number 16.0, the x position of the accessory view start to differ with the variance of height of the cell.

Figure 2 (accessory view height is 16.0)

My colleague had implemented a custom UITableViewCell and using subviews to layout content and was able to avoid this problem.

So you have 3 options:

• Restrict your accessory view's height to 16.0 and below.
• Use a custom UITableViewCell and layout your own content as subviews.
• Use the default accessory type.

Figure 3 (default accessory type UITableViewCellAccessoryDetailDisclosureButton)