What can prevent Auto Layout constraints from being respected during animations?

Question

I'm trying to snap a view to a UITabBarController's tabBar (UITabBar) to never hide it (the way Apple does it in the 'Featured' tab of the tvOS App Store).

I can make it work by setting up my constraints in a UIViewController that's directly contained in a UITabBarController. When the tab bar is hidden and shown, the view (in my case, a UICollectionView) follows perfectly with the animation. But it doesn't work as well when my UIViewController is in a UINavigationController. It eventually updates, but while the UITabBar is animating (hiding and showing), it doesn't update.

Here's how I set my constraints using NSLayoutConstraints: UIView *targetView = self.collectionView;

NSLayoutConstraint *constraint1 = [NSLayoutConstraint constraintWithItem:targetView attribute:NSLayoutAttributeTop relatedBy:NSLayoutRelationEqual toItem:self.tabBarController.tabBar attribute:NSLayoutAttributeBottom multiplier:1 constant:0];  
NSLayoutConstraint *constraint2 = [NSLayoutConstraint constraintWithItem:targetView attribute:NSLayoutAttributeLeft relatedBy:NSLayoutRelationEqual toItem:self.view attribute:NSLayoutAttributeLeft multiplier:1 constant:0];  
NSLayoutConstraint *constraint3 = [NSLayoutConstraint constraintWithItem:targetView attribute:NSLayoutAttributeHeight relatedBy:NSLayoutRelationEqual toItem:self.view attribute:NSLayoutAttributeHeight multiplier:1 constant:0];  
NSLayoutConstraint *constraint4 = [NSLayoutConstraint constraintWithItem:targetView attribute:NSLayoutAttributeWidth relatedBy:NSLayoutRelationEqual toItem:self.view attribute:NSLayoutAttributeWidth multiplier:1 constant:0];  

[self.view.window addConstraint:constraint1];  
[self.view addConstraints:@[constraint2, constraint3, constraint4]];  

Here's how I set those same constraints with Masonry (both have the same result, but this is much more readable):

[self.containerView mas_makeConstraints:^(MASConstraintMaker *make) {
        make.left.width.height.equalTo(self.view);
        make.top.equalTo(self.tabBarController.tabBar.mas_bottom);
    }]; 

Here's a sample project demonstrating my issue: https://www.dropbox.com/s/bxbi0gyidxhu2bz/SampleMovingWithTabBar.zip?dl=1

Is this a bug or is it expected behavior ?

I'm trying to implement this "view not hiding under the tab bar" behavior in another more complex app and I get the same odd behavior. Though in this case there are no UINavigationController involved. The view is directly in a UIViewController (which is part of the viewControllers array of the UITabBarController).

What can prevent Auto Layout constraints from being respected during animations ?

This how what my View Controller hierarchy looks like in the demo project I linked to (the View Controller that is within the UINavigationController is the one that does not animate when showing/hiding the tab bar):

<UITabBarController 0x7fca42d10bb0>, state: appeared, view: <UILayoutContainerView 0x7fca42f848b0>
   | <FirstViewController 0x7fca42d11340>, state: disappeared, view: <UIView 0x7fca42f96510>
   | <UINavigationController 0x7fca43812000>, state: appeared, view: <UILayoutContainerView 0x7fca42d46200>
   |    | <FirstViewController 0x7fca42f347f0>, state: appeared, view: <UIView 0x7fca42f8bd90>

Answer 1

Whenever you use CoreAnimation API's for animations at that time layout constraints do not respect constraints during transient Animations.

When you use NSLayoutconstraint's property like constant for animation then auto layout does respect constraints during transient animations.

CoreAnimations API's include UIView's block based animations. If you interested in further reading then here is the wwdc video

However, looking at your code, I don't think that's your problem. You want to respect layout constraints while UITabbar is animating. You just need to set your constraints in viewDidLayoutSubviews instead of videDidAppear and you should be all set with the existing code.

EDIT ---

I got some additional details about the problem. So first of all it's not an bug by apple. UITabBar is only responsible of it's direct children view controller. It's doesn't have any information about it's sub structure. You are responsible for chaining that responsibility.

The way to fix this is to listen to transitions calls of your UIViewController and animate accordingly.

This is the magic code. Add this to your view controller.

-(void)didUpdateFocusInContext:(UIFocusUpdateContext *)context withAnimationCoordinator:(UIFocusAnimationCoordinator *)coordinator{

    NSString *prevFocusViewClassName = NSStringFromClass([context.previouslyFocusedView class]);
    NSString *nextFocusedView = NSStringFromClass([context.nextFocusedView class]);

    // The tabbar is going to disappear
    if ([prevFocusViewClassName isEqualToString:kUITabBarButtonClassName] &&
        ![nextFocusedView isEqualToString:kUITabBarButtonClassName]) {
        [self.view layoutIfNeeded];

        [coordinator addCoordinatedAnimations:^{
            [self.view layoutIfNeeded];
        } completion:nil];
        // The tabbar is going to appear
    } else if (![prevFocusViewClassName isEqualToString:kUITabBarButtonClassName] &&
               [nextFocusedView isEqualToString:kUITabBarButtonClassName]) {
        [self.view layoutIfNeeded];

        [coordinator addCoordinatedAnimations:^{
            [self.view layoutIfNeeded];
        } completion:nil];
    }

}

I have fixed your code with expected output https://www.dropbox.com/s/c8jdw367a3bnb42/SampleMovingWithTabBar-2.zip?dl=0