How can I animate a UITableViewCell's colors?

Question

I want to allow the user to switch between a few color palettes in the application, IE how XCode and other text editors allow you to switch between light and dark backgrounds. I'm able to do all this simply enough, but now I'm trying to wrap the change in a simple animation block so the color changes fade in. Everything works great with the exception of my table view cells. The colors change, but they don't animate.

[UIView animateWithDuration:0.5 animations:^{
    self.tableView.backgroundColor = [UIColor whiteColor];

    for (UITableViewCell *cell in self.tableView.visibleCells)
    {
        cell.textLabel.textColor = [UIColor blueColor];
    }
}];

I'm attempting not to reload the entire table, as that will cause a lot of things to layout again which I don't want. Frankly, I've tried it a couple times and it doesn't work anyway.

For what it's worth, my UITableView is grouped, though I don't think that's really effecting my solution.

The answers listed here are interesting, but I don't believe are relevant to my problem - I am changing text color which never animates: Animating UITableViewCell's backgroundColor in block animation

I'm pretty sure text color is not an animate-able property. Is the tableview backgroundcolor animating properly? — Dan F, Feb 04 '13 at 14:50
That would explain it; yes, the background color is animating properly, though the edges around my rounded/grouped cells change immediately. Is there documentation somewhere that says that UILabel.textcolor isn't animatable? — Mike, Feb 04 '13 at 14:53
In the [`UIView` Class Reference](http://developer.apple.com/library/ios/#documentation/uikit/reference/uiview_class/uiview/uiview.html) there is a section under "Animations" that outlines what properties can be animated. In short, if it isn't a base `UIView` property, you can't animate it — Dan F, Feb 04 '13 at 15:00

score 0 · Answer 1 · answered Feb 04 '13 at 15:00

The problem is that text properties are not animatable. In order to animate your changes I would recommend adding a custom view in your table cell's contentView than you can use a view transition animation to swap the old view for the new one (with the new colours set). This will mean doing your own layout for the view you put into the contentView since you're not using one of the predefined styles any more.

See docs here: http://developer.apple.com/library/ios/#documentation/userexperience/conceptual/tableview_iphone/TableViewCells/TableViewCells.html

score 0 · Accepted Answer · answered Feb 04 '13 at 15:18

Thanks guys, @shadowhorst link was really helpful. I was able to accomplish what I wanted by using a cross-dissolve transition instead of the animateWithDuration method. The code is below -

[UIView transitionWithView:self.tableView
                  duration:0.25
                   options:UIViewAnimationOptionTransitionCrossDissolve | UIViewAnimationOptionAllowAnimatedContent
                animations:^{
                    self.tableView.backgroundColor = [UIColor whiteColor];;

                    for (UITableViewCell *cell in self.tableView.visibleCells)
                    {
                        cell.textLabel.textColor = [UIColor blueColor];
                    }
                }
                completion:nil];

I did notice that there are still some artifacts around the edges of my grouped cells, which is why I dropped the duration of my animation down to a quarter of a second.

Why not simply reload the visible rows with a fade? `[tableView reloadRowsAtIndexPaths:[tableView indexPathsForVisibleRows] withRowAnimation: UITableViewRowAnimationFade];`. — rmaddy, Feb 04 '13 at 15:45
Can I animate those rows at the same time as the tableview's background color? — Mike, Feb 04 '13 at 16:16
Probably not. I missed that detail. My suggestion would only work for the rows, not the table's background. — rmaddy, Feb 04 '13 at 16:19

How can I animate a UITableViewCell's colors?

2 Answers2

Linked