cocoaanimationautolayoutnspopover

Animating Auto Layout changes concurrently with NSPopover contentSize change


I'm attempting to reproduce the iTunes 11 behavior of navigable views within a popover. I can't seem to find a way to get my animation to happen at the same time as the popover's contentSize change happens, though.

The basic setup I have is a custom view subclass MyPopoverNavigationView with two subviews: the old and new views that I want the popover to navigate between. The popover's contentViewController has a MyPopoverNavigationView instance as its view. I do this:

// Configure constraints how I want them to show the new popover view
[NSAnimationContext runAnimationGroup:^(NSAnimationContext *ctx) {
    [ctx setDuration:0.25];
    [ctx setAllowsImplicitAnimation:YES];
    [self layoutSubtreeIfNeeded];
} completionHandler:nil];

As far as I can tell from the Auto Layout WWDC 2012 videos, this is the recommended way to animate changes to views' frames as a result of constraint changes. It works, but the animation happens in two phases:

From setting some breakpoints, it looks like -layoutSubtreeIfNeeded eventually calls a private method on the popover called _fromConstraintsSetWindowFrame:, which does the popover size animation outside my animation group. My context's duration isn't respected, and my animations don't happen until the popover's size change is complete.

How can I get my views to animate together with the popover's size change?


Solution

  • Turns out the trick is to explicitly set the popover's contentSize property outside of the animation and completion blocks. The relevant snippet from the sample GitHub project I put together to figure it out looks like:

    // Configure constraints for post-navigation view layout
    [NSAnimationContext runAnimationGroup:^(NSAnimationContext *ctx) {
        [ctx setDuration:0.25];
        [ctx setAllowsImplicitAnimation:YES];
        [self layoutSubtreeIfNeeded];
    } completionHandler:^{
        // Tear down some leftover constraints from before the transition
    }];
    
    // Explicitly set popover's contentSize so its animation happens simultaneously
    containingPopover.contentSize = postTransitionView.frame.size;