UITableViewCell Accessory is too wide on iPad

Question

I am having a problem with my UITableViewCell's appearance on the iPad. This problem arose sometime between iOS 7 and now, but I don't know for sure when it started. On an iPod or iPhone my cells look fine (portrait or landscape), but on the iPad, the disclosure accessory is very wide. You can see an example in the image below. The tablecell has a green border and the contentview has a brown border. The content view is much smaller than it should be. Table cells without the disclosure accessory look fine.

I am using Xamarin, and I am creating this UI completely in code. Here is the code (I have omitted the code that lays out the inside of the cells ContentView since it isn't relevant:

protected void Draw()     {         Accessory = UITableViewCellAccessory.DisclosureIndicator;          Layer.BorderColor = UIColor.Green.CGColor;         Layer.BorderWidth = 1f;          Frame = new CGRect(0, 0, 320, 42);         ContentMode = UIViewContentMode.ScaleToFill;         AutoresizingMask = UIViewAutoresizing.FlexibleHeight | UIViewAutoresizing.FlexibleWidth;          ContentView.AutoresizingMask = UIViewAutoresizing.FlexibleWidth;         ContentView.MultipleTouchEnabled = true;         ContentView.ContentMode = UIViewContentMode.Center;         ContentView.ClipsToBounds = true;         ContentView.Layer.BorderColor = UIColor.Brown.CGColor;         ContentView.Layer.BorderWidth = 1f;      } 

I tried changing the size of the ContentView by overriding the cell's LayoutSubviews method. However, the ContentView was now as wide as the table, but the disclosure accessory didn't change and was now below the ContentView.

public override void LayoutSubviews()     {         base.LayoutSubviews();          //ContentView.Frame = new CGRect(0, 0, Frame.Size.Width, ContentView.Frame.Size.Height);     } 

Again, this isn't a problem at all on the iPhone or iPod. I don't understand what I should be doing different for the iPad to work properly.

Thanks. Zach Green

Edit - 10/21/2015 11:00 For the moment, I have made a very hacky change that is fixing the issue for me, but I know that future iOS updates will probably break this, so I would prefer a more iOS approved way to do this.

public override void LayoutSubviews()     {         base.LayoutSubviews();         //!! - Hack for ipad layout issue with disclosure indicator         if (Accessory == UITableViewCellAccessory.DisclosureIndicator && UIDevice.CurrentDevice.UserInterfaceIdiom == UIUserInterfaceIdiom.Pad)         {             ContentView.Frame = new CGRect(0, 0, Frame.Size.Width - 32, ContentView.Frame.Size.Height);              foreach (var view in Subviews.OfType<UIButton>())             {                 view.Frame = new CGRect(Frame.Size.Width - 24, view.Frame.Y, 8, view.Frame.Height);             }         }     } 

Answer 1

This is due to Apples new readable content margins in iOS9 intended to make content more readable in wider views (iPad Pro).

You can turn this feature off by setting

tableView.cellLayoutMarginsFollowReadableWidth = false 

in viewDidLoad

Answer 2

Try this code:

    protected void Draw()         {             Accessory = UITableViewCellAccessory.DisclosureIndicator;              Layer.BorderColor = UIColor.Green.CGColor;             Layer.BorderWidth = 1f;              Frame = new CGRect(0, 0, [UIApplication sharedApplication].keywindow.frame.size.width, 42);             ContentMode = UIViewContentMode.ScaleToFill;             AutoresizingMask = UIViewAutoresizing.FlexibleHeight | UIViewAutoresizing.FlexibleWidth;              ContentView.AutoresizingMask = UIViewAutoresizing.FlexibleWidth;             ContentView.MultipleTouchEnabled = true;             ContentView.ContentMode = UIViewContentMode.Center;             ContentView.ClipsToBounds = true;             ContentView.Layer.BorderColor = UIColor.Brown.CGColor;             ContentView.Layer.BorderWidth = 1f;          }  public override void LayoutSubviews()     {         base.LayoutSubviews();         //!! - Hack for ipad layout issue with disclosure indicator         if (Accessory == UITableViewCellAccessory.DisclosureIndicator && UIDevice.CurrentDevice.UserInterfaceIdiom == UIUserInterfaceIdiom.Pad)         {             ContentView.Frame = new CGRect(0, 0, [UIApplication sharedApplication].keywindow.frame.size.width - 32, ContentView.Frame.Size.Height);              foreach (var view in Subviews.OfType<UIButton>())             {                 view.Frame = new CGRect([UIApplication sharedApplication].keywindow.frame.size.width - 24, view.Frame.Y, 8, view.Frame.Height);             }         }     }