iOS – Animation glitch example

A short while ago we were running into an interesting animation glitch. The actual solution is quite simple.
Here’s what the glitch was about. A table view could be toggled into an edit mode. On performing this toggle a label would be animated out of the view and hidden. The strange thing was, that this label was resizing it’s font size right the second before the actual animation started.
Fortunately we were able to fix this problem.As it turned out, the actual label was a label with a dynamic font size. Check the “adjustsFontSizeToFitWidth” property on a UILabel.
During the animation. The label was not only moved but also resized by just a few pixels.
I’ve created an example demonstrating just this problem on the second view controller of my example project at https://github.com/xebia/ios-DemoForBlog.
Check the file XSDSecondViewController for details.
The basic problem is shown in this code snippet:
[sourcecode language=”c”]
-(IBAction) animateButtonPressed:(id)sender {
NSLog(@"%@", sender);
[UIView animateWithDuration:2.0 animations:^{
CGRect frame = animatedLabel.frame;
if(frame.origin.x != 10) {
frame.origin.x = 10;
} else {
frame.origin.x = 100;
}
if (self.shouldGlitch) {
if (frame.size.width == 150.0) {
frame.size.width = 155.0;
} else {
frame.size.width = 150.0;
}
}
animatedLabel.frame = frame;
}];
}
[/sourcecode]
The shouldGlitch property is a BOOL toggled by an on screen switch. Download the code an try it, second tab after you start the application.