iOS 7 Custom TableView Is Under TabBar

Question

Im trying port my app to iOS7, but my custom TableViewController is showing the last row (cell) under the TabBar :(

Im searching a lot for it, but i dont find any solution. Can anyone help me?

My Custom Table View class

The error is shown in the blow screenshot (only is showing a part of last product because im draging to up to show the hidden product under the tabbar):

screenshot

Thanks.

score 35 · Answer 1 · answered Oct 08 '13 at 12:32

35

I've got the same problem and solved it using storyboard. At Tab Bar Controller, go to attribute inspector, Simulated Metrics, and set the Bottom Bar to Opaque Tab Bar. That's it! See image bellow for description. enter image description here

Saudações! (Greetings!)

answered Oct 08 '13 at 12:32

José Flávio

559
5
11

2

Opaque is just a workaround : Don't use it, it's ugly. – Matthieu Riegler Oct 28 '14 at 23:44
After I have changed to Opaque Tab Bar, I change back to None then it still work. – ittgung Aug 04 '17 at 07:57
You are a hero sir! – WingJammer Feb 25 '20 at 21:33

Wojtek · Accepted Answer · 2018-10-22T19:25:56.260

31

I found the answer to your question on another post, answered by dariaa, here:

Tab Bar covers TableView cells in iOS7

It worked great for me.

Please no credit for me, because I'm not the original guy who solved it.

In your custom TableViewController, add these two lines under [super viewDidLoad]:

- (void)viewDidLoad
{
    [super viewDidLoad];

    self.edgesForExtendedLayout = UIRectEdgeAll;
    self.tableView.contentInset = UIEdgeInsetsMake(0., 0., CGRectGetHeight(self.tabBarController.tabBar.frame), 0); 
}

edited Oct 22 '18 at 19:25

answered Oct 24 '13 at 22:16

Wojtek

436
5
7

Thanks, this fixed the issue with my tab bar. – Kunani Dec 17 '13 at 03:30

score 10 · Answer 3 · answered Feb 12 '17 at 18:44

10

My friends, I cannot tell you how badly I struggled from this. Not a single re-configuration of Story Board never helped me. The issue was exactly like in Original Post, I've managed to fix it using:

for swift 3

self.edgesForExtendedLayout = []

for objective-c

self.edgesForExtendedLayout = NO;

answered Feb 12 '17 at 18:44

An Se

870
11
24

2

Unbelievable, but this was the answer for my problem with a view under the tabbar. – Hola Soy Edu Feliz Navidad Nov 23 '17 at 15:30

score 8 · Answer 4 · answered Oct 28 '14 at 23:44

8

2 lines in viewDidLoad and that's it !

self.edgesForExtendedLayout = UIRectEdgeAll;
self.tableview.contentInset = UIEdgeInsetsMake(0.0f, 0.0f, CGRectGetHeight(self.tabBarController.tabBar.frame), 0.0f);

answered Oct 28 '14 at 23:44

Matthieu Riegler

31,918
20
95
134

2

`UIRectEdgeAll` is set by default – pxpgraphics Jan 29 '16 at 20:10

Raheel Sadiq · Answer 5 · 2013-10-04T05:52:28.343

6

In iOS 7 viewController uses full height. There is a property introduced as

self.automaticallyAdjustsScrollViewInsets = NO;

set it to no. then check, or set UIEdgeInset if is not set right after it.

UIEdgeInsetsMake(top, left, bottom, right)

See here https://developer.apple.com/library/ios/documentation/userexperience/conceptual/TransitionGuide/AppearanceCustomization.html

Edit: try also this

self.edgesForExtendedLayout = UIRectEdgeNone;

edited Oct 04 '13 at 05:52

answered Oct 04 '13 at 05:24

Raheel Sadiq

9,847
6
42
54

4

I put it (already tested if you see commented code). But nothing solved it :( – Paulo Coutinho Oct 05 '13 at 01:20

AmitP · Answer 6 · 2015-09-08T11:43:15.463

5

The root cause of this problem is that automaticallyAdjustsScrollViewInsets is effective only on the First scroll view in your VC's view Hierarchy. It is not documented by Apple, but it is the only way the VC will detect the scroll view needing to be modified unless you're using a UITableViewController.

So in order to fix your issue without manually adjusting the insets, do this:

Make sure "Adjust Scroll View Insets" is checked.
Make sure that the tableView is the first subview in the view Hierarchy. (Move it upwards above all other elements)

edited Sep 08 '15 at 11:43

answered Sep 08 '15 at 11:31

AmitP

5,353
4
35
27

Wow this made it possible to keep the translucent behaviour of the tabbar and still make the scrollview items to scroll above it. Thanks! – Peterdk May 17 '16 at 17:38

score 2 · Answer 7 · answered Oct 08 '13 at 15:28

UIViewController has two new properties to assist you : topLayoutGuide and bottomLayoutGuide. They return the height of the parent view controller's controls you need to avoid. In this case, bottomLayoutGuide will return the offset of the tab bar.

Your custom view controller is probably overriding a method and not invoking super's implementation where this would be done for you. I am guessing you are installing AutoLayout constraints or setting a view's frame manually to fill the view. You just need to include the value from [bottomLayoutGuide length] to your layout calculation. If you support rotation, you should update that value in willAnimateRotationToInterfaceOrientation:duration:.

score 1 · Answer 8 · edited Feb 19 '14 at 02:38

UINavigationController and UITabBarController both have a transparency flag that can be set programmatically or in the storyboard.

The UINavigationController also has two flags that control if the content extends under the top or bottom bar. Again you can set them programmatically or in the storyboard. This will apply to all subviews.

Each UIViewController can set its own preference in code. The property is called edgesForExtendedLayout and you can set up all combinations.

Using those properties will allow AutoLayout and Springs'n'Struts to adjust the views the way you want them regardless of the device.

There are a lot more new properties in UIViewController that you will want to have a look at.

score 1 · Answer 9 · edited Oct 14 '15 at 05:27

1

Try the following:

 if ([self respondsToSelector:@selector(edgesForExtendedLayout)])

 self.edgesForExtendedLayout = UIRectEdgeBottom;

edited Oct 14 '15 at 05:27

HaveNoDisplayName

8,291
106
37
47

answered Oct 14 '15 at 05:08

asolakhyan

51
4

score 1 · Answer 10 · answered Sep 09 '16 at 21:57

1

I've got the same problem. One solution to it is to make the ToolBar not Translucent. Here's how to do it:

First select the tool bar from the document viewer like here
Then uncheck Translucent like here

Hope this helps.

Thanks.

answered Sep 09 '16 at 21:57

Minas Kamel

56
6

score 0 · Answer 11 · answered Oct 05 '13 at 04:50

The problem was masked using:

-(void)viewDidLayoutSubviews
{
    [super viewDidLayoutSubviews];
    self.tableView.contentInset = UIEdgeInsetsMake(0, 0, 112, 0);
}

But it doesn't solve, because on each iPhone and on each app tableview i have a different space on bottom.

So this is a poor solution.

I dont know a way to solve it.

score 0 · Answer 12 · answered Oct 05 '13 at 13:24

0

I solved my problem now, changing my BaseTableViewController to inherit from UIViewController to UITableViewController.

But using a TableView inside a UIViewController is not solved :(

Thanks.

answered Oct 05 '13 at 13:24

Paulo Coutinho

705
1
7
15

score 0 · Answer 13 · answered Oct 18 '13 at 15:14

maybe is not a right answer, also for that reason I post this answer so you can tell me if this answer could be a possible solution.

In my case, I like the translucent effect, so I have added a footer in the table and I have modified the scrollIndicators.

- (void)viewDidLoad
{
    // Do any additional setup after loading the view.
    [super viewDidLoad];
    UIView *footer = [[UIView alloc]initWithFrame:CGRectMake(0, 0, self.agendaItemsTable.frame.size.width, self.tabBarController.tabBar.frame.size.height)];
    self.agendaItemsTable.tableFooterView = footer;
    self.agendaItemsTable.scrollIndicatorInsets = UIEdgeInsetsMake(0, 0, self.tabBarController.tabBar.frame.size.height, 0);

}

What do you think?

score 0 · Answer 14 · edited May 23 '17 at 12:02

0

I had the same problem, and the up-voted answers did not solve it. See my answer to a similar question, Tab Bar covers TableView cells in iOS7.

I solved the issue by manually setting the table view's frame in the table view controller's viewWillAppear: method to the height of the screen - (status bar height + nav bar height + tab bar height).

- (void)viewWillAppear:(BOOL)animated
{
    [super viewWillAppear:animated];

    // Adjust height of tableview (does not resize correctly in iOS 7)
    CGRect tableViewFrame = self.tableView.frame;
    tableViewFrame.size.height = [self heightForTableView];
    self.tableView.frame = tableViewFrame;
}

- (CGFloat)heightForTableView
{
    return CGRectGetHeight([[UIScreen mainScreen] bounds]) -
           (CGRectGetHeight([[UIApplication sharedApplication] statusBarFrame]) +
            CGRectGetHeight(self.navigationController.navigationBar.frame) +
            CGRectGetHeight(self.tabBarController.tabBar.frame));
}

If anyone finds a better solution to this problem, please share!

edited May 23 '17 at 12:02

Community

1
1

answered Feb 19 '14 at 02:50

Steph Sharp

11,462
5
44
81

2

You're using viewWillAppear incorrectly for starters here. It's a common mistake. This should go in viewWillLoad. viewWillAppear fires every time the view appears! You don't want view setup code in that method firing every time your view appears. Only dynamic code that changes should go in viewWillAppear, such as data that's getting updated on the fly. You can call view logic if it's relevant to data updating, such as a view refresh. But view setup should never go in viewWillAppear. – SmileBot Feb 24 '14 at 21:23
2

cocoanut: In my experience, the frames of some views haven't always been set in viewDidLoad, but they are set in viewWillAppear, so computing geometries in viewDidLoad results in incorrect values if they need to be based on views in the nib. – Jeff Jul 14 '14 at 05:44
1

@Jeff Agreed. I put this code in `viewWillAppear:` because there's no guarantee the frames will be set in `viewDidLoad`. – Steph Sharp Jul 14 '14 at 07:59
1

@cocoanut [This answer explains why you shouldn't put this code in viewDidLoad](http://stackoverflow.com/a/6758424/1367622). – Steph Sharp Jul 14 '14 at 08:00

score 0 · Answer 15 · edited May 23 '17 at 11:47

0

For those like xarly who want the translucent effect, and for an Autolayout solution (without setting frames), see my answer here https://stackoverflow.com/a/26419986/1158074

edited May 23 '17 at 11:47

Community

1
1

answered Oct 17 '14 at 07:52

Michael Pirotte

272
4
13

score 0 · Answer 16 · answered Apr 29 '18 at 03:08

I had a similar problem with collection view. Changing the collection view frame and content inset below fixed it for me...

    guard let cv = collectionView,
        let tabBar = tabBarController?.tabBar else { return }

    // Resize collection view for tab bar
    let adjustedFrame = CGRect(origin: cv.frame.origin,
                               size: CGSize(width: cv.frame.width, height: cv.frame.height - tabBar.frame.height))
    cv.frame = adjustedFrame

    // Adjust content inset for tab bar
    let adjustedContentInsets = UIEdgeInsetsMake(0, 0, tabBar.frame.height, 0)
    cv.contentInset = adjustedContentInsets
    cv.scrollIndicatorInsets = adjustedContentInsets

Good luck!

iOS 7 Custom TableView Is Under TabBar

16 Answers16

Linked