Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

UINavigationBar change Tint color with animation

Is it possible to change the tint with animation for a smoother effect?

This doesn't work for me:

[UIView beginAnimations:nil context:nil];
[self.navigationController.navigationBar setTintColor:[UIColor greenColor]];
[UIView commitAnimations];

I a not sure if it is even possible using native apple components as I guess they will be using CG to generate the gradient ... just want to find out before I'll start building my own solution ...

Cheers guys :)

like image 352
Ondrej Rafaj Avatar asked Feb 18 '11 14:02

Ondrej Rafaj


3 Answers

You wouldn't believe the length I went through to actually make that possible; it annoyed me to no end that this isn't a stock iOS feature and that transition of tintColor look ugly while the animation to push/pop a viewController is so smooth.

There'a lot of code that checks when to fade, and I've even written a class called PSPDFNavigationAppearanceSnapshot to preserve the navigation state when being popped. (I got that idea from the awesome NimbusKit)

The actual animation is pretty easy:

[self.navigationController.navigationBar.layer addAnimation:PSPDFFadeTransition() forKey:nil];

CATransition *PSPDFFadeTransition(void) {
    return PSPDFFadeTransitionWithDuration(0.25f);
}

CATransition *PSPDFFadeTransitionWithDuration(CGFloat duration) {
    CATransition *transition = [CATransition animation];
    transition.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];
    transition.type = kCATransitionFade;
    transition.duration = duration;
    return transition;
}

You can compact that code even more; it's a snipped from my iOS PDF library PSPDFKit and I use the fade in various places, thus the helper functions.

like image 101
steipete Avatar answered Oct 15 '22 10:10

steipete


You can't animate bar tint - the list of properties (for a UIView) that can be animated in this way is here.

I don't think you can do that at all unless you want to overlay a bar that has a neutral tint with a UIView whose background color is changing. backgroundColor is one of the properties that can be animated. But you may have to get sneaky if you want to put a UIView on top of the navigation bar, I don't know of a way to do that.

Another thought - subclassing and doing the drawing yourself in drawRect?

like image 23
Adam Eberbach Avatar answered Oct 15 '22 10:10

Adam Eberbach


We find the solution in another thread : Transition Color navBar

The solution was animating the attribut barTinTColor. Here is the code :

 self.navigationController.navigationBar.barTintColor = [UIColor redColor];
 [UIView animateWithDuration:5.0f animations:^{
    self.navigationController.navigationBar.barTintColor = [UIColor blueColor];
} completion:^(BOOL finished) {
}];
like image 42
Pull Avatar answered Oct 15 '22 10:10

Pull