Animate the backgroundColor of a UITableViewCell with an accessoryView

Question

Currently, I'm working on a UITableViewController. In the cells of its UITableView it presents real-time data from a web service. When one of the underlying data items is updated (once every two minutes or so) I want the cell to "flash" briefly, so the user understands, that the data for that cell just has been updated.

Up to now, I used this code:

[UIView animateWithDuration:0.2 delay:0.0 options:UIViewAnimationOptionAllowUserInteraction|UIViewAnimationOptionCurveEaseInOut animations:^
{
    cell.contentView.backgroundColor = flashColor;
} completion:^(BOOL finished)
{
    [UIView animateWithDuration:1.0 delay:0.0 options:UIViewAnimationOptionAllowUserInteraction|UIViewAnimationOptionCurveEaseInOut animations:^
    {
        cell.contentView.backgroundColor = [UIColor clearColor];
    } completion: NULL];
}];

This worked great, until I wanted to provide a way for the user to "look inside" the data for a given cell and added Disclosure Indicators. Since the content area is shrunk by the framework to make room for the Disclosure Indicator, now the flash only highlights the left 90% of the cell, but the background color of the Disclosure Indicator does not change.

cell.accessoryView.backgroundColor = flashColor;

and

cell.backgroundView.backgroundColor = flashColor;

won't help to fix the animation.

I've read about - (void) setHighlighted: (BOOL)highlighted animated: (BOOL)animated , but that won't revert the highlighted state immediately after the flash, unless I write a bulk of nasty error-prone code that keeps it from flying apart. Also, I won't have any control over the animation itself.

Is there a way to keep the old animation effect with an accessory view present, or do I have to start doing the flash using the highlight method?

Best Regards, Chris

Answer 1

[UIView animateWithDuration:0.2 delay:0.0 options:UIViewAnimationOptionAllowUserInteraction|UIViewAnimationOptionCurveEaseInOut animations:^
{
    [cell setHighlighted:YES animated:YES];
} completion:^(BOOL finished)
{
    [UIView animateWithDuration:0.2 delay:0.0 options:UIViewAnimationOptionAllowUserInteraction|UIViewAnimationOptionCurveEaseInOut animations:^
    {
        [cell setHighlighted:NO animated:YES];
    } completion: NULL];
}];

Note that the cell will ignore the time set in animateWithDuration parameter, and always uses the iOS-default of 0.2 seconds. So it is a good idea to set that parameter to 0.2.

The solution is simple, but of course the original animation could not be preserved (fast highlight and slow fade out). On the other hand this is probably the more conservative and future-proof way to do it.

Thanks to David Rönnqvist!

Chris