Update UILabel text animated

Question

I would like to animate the counting of digets in a text calculating upwards. The texts is in a UILabel similar like You have driven for 0.0km and that needs to be changed to You have driven for 143.6km with count animation. Is there any way I can update it animated?

Edit Here is some of my current code, concerning other animations I already have:

        if (animated)
        {
            [UIView beginAnimations:@"scaleAnimation" context:nil];
            [UIView setAnimationCurve:UIViewAnimationCurveEaseInOut];
            [UIView setAnimationDuration:animationDuration];
        }

        [...]

        // Amount pointer
        float xForRedBar = redBarFrame.size.width + redBarFrame.origin.x;

        CGRect pointerFrame = cell.amountBarPointer.frame;
        pointerFrame.origin.x = (xForRedBar - (pointerFrame.size.width/2));

        if (pointerFrame.origin.x < 12)
            pointerFrame.origin.x = 12;

        if (pointerFrame.origin.x >= (308 - (pointerFrame.size.width/2)))
            pointerFrame.origin.x = 308 - pointerFrame.size.width;

        [cell.amountBarPointer setFrame:pointerFrame];

        // Amount bar
        CGRect amountBarFrame = cell.amountBar.frame;
        amountBarFrame.origin.x = 9+(((302 - amountBarFrame.size.width)/100)*self.procentCompleted);

        [cell.amountBar setFrame:amountBarFrame];

        // Amount info text
        CGRect amountInfoFrame = cell.amountInfo.frame;
        amountInfoFrame.origin.x = amountBarFrame.origin.x + 2;

        [cell.amountInfo setFrame:amountInfoFrame];

        // Amount text
        [cell.amountInfo setText:[NSString stringWithFormat:NSLocalizedString(@"You have driven for %@km", nil), self.userAmount]];

        [...]

        if (self.procentCompleted == 0)
        {
            [cell.amountBar setAlpha:0];
            [cell.amountBarPointer setAlpha:0];
            [cell.amountInfo setAlpha:0];
        }
        else {
            [cell.amountBar setAlpha:1];
            [cell.amountBarPointer setAlpha:1];
            [cell.amountInfo setAlpha:1];
        }

        if (animated)
        {
            [UIView commitAnimations];
        }

So is your question how to change the number every `x` milliseconds until it has gone from value `a` to value `b`? The answer to that would be to use an `NSTimer`, like suggested by @rdelmar below. Or does your question have to do with the actual animation of the changes between any two numbers? — Mathew, Feb 12 '13 at 17:18
My question is to change is every `x` milliseconds until it has gone from value `a` to value `b`, however with easing.. hence I called it animated. I understand how it could be misunderstood. — Paul Peelen, Feb 13 '13 at 09:14

rdelmar · Accepted Answer · 2013-02-14T08:35:50.397

1

Sure, you can update it "animated", but you have to use a repeating timer, and add one (or whatever interval you want) to the count each time the timer's selector is called. Include a test for the final value, and invalidate the timer when you get there.

After Edit:

If you want the speed of the count to slow down toward the end, I wouldn't use a timer, I would use performSelector:withObject:afterDelay:. To make it repeat, you would call this method from within its selector. You would need to do some test to see if you're near the end of the count up, and then add a little bit of time to the delay with each pass. Something like this:

-(IBAction)countUp:(id)sender {
    [self performSelector:@selector(countUpLabel) withObject:nil afterDelay:.1];
}

-(void)countUpLabel {
    static float delay = .01;
    num+= 1;
    label.text = [NSString stringWithFormat:@"%d",num];
    if (num < 40) {
        [self performSelector:@selector(countUpLabel) withObject:nil afterDelay:.1];
    }else if (num > 35 && num <50) {
        [self performSelector:@selector(countUpLabel) withObject:nil afterDelay:.1 + delay];
        delay += 0.01;
    }
}

edited Feb 14 '13 at 08:35

answered Feb 12 '13 at 15:40

rdelmar

103,982
12
207
218

Doesn't sound so memory efficient... but I understand your suggestion. Maybe not worth it for a "nice to have" feature. – Paul Peelen Feb 13 '13 at 09:16
@PaulPeelen, I don't think this is particularly memory intensive, and it's the only way to see the numbers count up (if that's what you wanted). I'm not sure what you mean by "easing" -- you want it to slow down as it gets toward the end? – rdelmar Feb 13 '13 at 16:04
Correct. I want it to speed up at start and slow down towards the end. Same as `UIViewAnimationCurveEaseInOut` does to the animation. – Paul Peelen Feb 14 '13 at 08:20
@PaulPeelen, For a slow down, I would do it like I say in my edit. – rdelmar Feb 14 '13 at 08:25

Update UILabel text animated

1 Answers1