Question

I’ve got an UILabel that displays users score. And score changes from time to time, is there a way to animate this change, to slowly increment this number from its current value to its result value?
Something like http://josheinstein.com/blog/index.php/2010/02/silverlight-animated-turbotax-number-display/ but for objective-c.

Answer 1

Use a CADisplayLink to change the text property of custom subclass of UILabel over some period of time. You’ll probably want to use a NSNumberFormatter for prettier output.

// Create instance variables/properties for: `from`, `to`, and `startTime` (also include the QuartzCore framework in your project)

- (void)animateFrom:(NSNumber *)aFrom toNumber:(NSNumber *)aTo {
    self.from = aFrom; // or from = [aFrom retain] if your not using @properties
    self.to = aTo;     // ditto

    self.text = [from stringValue];

    CADisplayLink *link = [CADisplayLink displayLinkWithTarget:self selector:@selector(animateNumber:)];

    startTime = CACurrentMediaTime();
    [link addToRunLoop:[NSRunLoop currentRunLoop] forMode:NSRunLoopCommonModes];
}

- (void)animateNumber:(CADisplayLink *)link {
    static float DURATION = 1.0;
    float dt = ([link timestamp] - startTime) / DURATION;
    if (dt >= 1.0) {
        self.text = [to stringValue];
        [link removeFromRunLoop:[NSRunLoop currentRunLoop] forMode:NSRunLoopCommonModes];
        return;
    }

    float current = ([to floatValue] - [from floatValue]) * dt + [from floatValue];
    self.text = [NSString stringWithFormat:@"%i", (long)current];
}