iOS: Customize Back Button Transition Animation

Question

I have a view controller (inherits from UIViewController) that has custom logic for presenting data. It can init a new view controller (of the same type) and display it using [self.navigationController pushViewController:next animated:NO] (where next is the newly instantiated controller), creating an experience of a "stack of views", using the navigation controller default back button to navigate up the stack.

Now, before calling pushViewController:animated: I am able to customize the transition animation by calling [self.navigationController.view.layer addAnimation:animation forKey:nil]. This works wonderfully for "going down the stack" of views.

But since navigation up the stack is done the default way with a default back button, the transition used is the default slide-fro-left animation which doesn't match my customized animation.

How can I customize this transition animation?

EDIT:

I took the ideas given here and came up with:

UIBarButtonItem *back = [[UIBackButtonItem alloc] initWithTitle:@"\U000025C0\U0000FE0E" style:UIBarButtonItemStylePlain target:self action:@selector(back:)];
[self.navigationItem setLeftBarButtonItem:back]

And the transition:

- (IBAction)back:(id)sender {
    CATransiotion *animation = [CATransition animation];
    animation.duration = 0.3f;
    amimation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionLinear];
    animation.type = kCATransitionMoveIn;
    [self.navigationController.view.layer addAnimation:animation forKey:nil];
    [self.navigationController popViewControllerAnimated:NO];
}

The only downside is the appearance of the new back button which I'm willing to live with.

Thanks for the answers :)

score 3 · Accepted Answer · answered Mar 24 '13 at 12:27

3

I guess you have to make your custom back button, and attach your animations to it, eg.

- (IBAction) back:(id)sender
{       
    [UIView transitionWithView:self.navigationController.view
                      duration:0.5
                       options:UIViewAnimationOptionTransitionFlipFromLeft
                    animations:^{ [self.navigationController popViewControllerAnimated:NO]; }
                    completion:NULL];
}

answered Mar 24 '13 at 12:27

Mindaugas

1,707
13
20

I think a custom back button is the way to go but I'm looking to do this in code. I'm kind of new to Objective C, but as far as I'm aware this has to do with building .xib files which I'm not using. – Itai Hanski Mar 24 '13 at 13:57

score 1 · Answer 2 · edited May 23 '17 at 11:44

This code got from this Queston.

For this type of transition I would really recommend a modal view controller, thats the way the system was designed.

But if you insist on using the navigation controller there is a way, though somewhat ugly.

[CATransaction begin];
[CATransaction setValue:(id)kCFBooleanTrue forKey:kCATransactionDisableActions];

CATransition *transition = [CATransition animation];
[transition setType:kCATransitionFade];
[self.navigationController.view.layer addAnimation:transition forKey:@"someAnimation"];

[self.navigationController popViewControllerAnimated:YES];
[CATransaction commit];

The CATransaction will disable all standard animations. The CATransition adds a fade transition to the navigation controller layer when views are swapped (in this case removing the viewcontroller view that is popped).

And also Refer this How to change the Push and Pop animations in a navigation based app

score 1 · Answer 3 · answered Nov 22 '13 at 14:21

I do it like this:

-(void)viewWillDisappear:(BOOL)animated {
CATransition *anim = [CATransition animation];
anim.duration = 1;
anim.type = @"cube";
anim.subtype = @"fromLeft";
[super viewWillDisappear:animated];
[self.navigationController.view.layer addAnimation:anim forKey:@"an"];

}

And it works well!

score 0 · Answer 4 · answered Mar 24 '13 at 22:02

If you are simply wanting to make the back button go back to the previous view controller. It is easier to do this without code. and instead just do the control drag from the back button to the previous view controller. (I prefer the modal action segue). This makes it simpler because it involves no code

iOS: Customize Back Button Transition Animation

4 Answers4