How do I animate tintColor to gray on a custom-drawn control when a sheet/alert is shown in iOS 7?

Question

In iOS 7, when a UIActionSheet is presented, the system controls all animate their tintColor to gray. When the sheet is dismissed, they animate back.

I have some controls with custom background images or drawRect implementations that use the tint color, and I'd like them to animate that change just like the system controls.

Apple added - (void)tintColorDidChange to UIView, but redrawing with the new color in this method doesn't animate the change — it just switches from full color to full gray immediately, which looks bad when other system controls around it are animating.

How can I make my custom-drawn controls animate the tintColor transition like Apple's?

Answer 1

You can do this with a Core Animation transition applied to the view layer:

//set up transition
CATransition *transition = [CATransition animation];
transition.type = kCATransitionFade;
transition.duration = 0.4;
[self.layer addAnimation:transition forKey:nil];

//now trigger a redraw of the background using the new colour
//and the transition will cover the redraw with a crossfade
self.flagToIndicateColorShouldChange = YES;
[self setNeedsDisplay];

EDIT: there may be a race condition between the animation and the redraw depending on exactly how you do the redraw. If you can post the original redraw code you tried that updated immediately (without animation) I can provide a more specific answer.