ios - Animar texto UILabel entre dos números?

iphone animation

Question

Soy nuevo en la programación de iPhone y Mac (desarrollada para Windows anteriormente), y tengo una pregunta:

¿Cómo puedo animar la propiedad de text de un UILabel entre dos números, por ejemplo, de 5 a 80 en un estilo de Ease-Out? ¿Es posible con CoreAnimation ? He estado buscando en Google durante una hora, pero no he encontrado nada para resolver mi problema. Lo que quiero: anima el dinero de los usuarios para un juego simple. No se ve muy bien cuando va de 50 a 100 o algo así sin animación.

¿Alguien tiene una idea de cómo hacer eso?

¡Gracias!

Answer 1

¡Funciona bien!

C objetivo

[UIView transitionWithView:self.label 
                  duration:.5f 
                   options:UIViewAnimationOptionCurveEaseInOut | 
                           UIViewAnimationOptionTransitionCrossDissolve 
                animations:^{

    self.label.text = rand() % 2 ? @"111!" : @"42";

} completion:nil];

Rápido

UIView.transitionWithView(label, duration: 0.25, options: [.CurveEaseInOut, .TransitionCrossDissolve], animations: {
    self.label.text = (arc4random() % 2 == 0) ? "111" : "222"
}, completion: nil)

Answer 2

En Swift 2.0, utilizando el método UIView.transitionWithView() :

UIView.transitionWithView(self.payPeriodSummaryLabel,
        duration: 0.2,
        options: [.CurveEaseInOut, .TransitionCrossDissolve],
        animations: { () -> Void in
            self.label.text = "your text value"
        }, completion: nil)

Answer 3

Encontré un gran motor para valores de interpolación con una variedad de diferentes funciones de temporización llamadas github.com/shu223/TweenDemo/tree/… . Instale las clases y cree algún código en estas líneas:

- (IBAction)tweenValue
{
    [[PRTween sharedInstance] removeTweenOperation:activeTweenOperation];
    PRTweenPeriod *period = [PRTweenPeriod periodWithStartValue:0.0 endValue:100.0 duration:1.0];
    activeTweenOperation = [[PRTween sharedInstance] addTweenPeriod:period
                                                             target:self
                                                           selector:@selector(update:)
                                                     timingFunction:&PRTweenTimingFunctionCircOut];
}

- (void)update:(PRTweenPeriod*)period
{
    self.animatingView.center = CGPointMake(period.tweenedValue + 100.0, 200.0);
    self.valueLabel.text = [NSString stringWithFormat:@"%.2f", period.tweenedValue];
}

Funciona un placer para mí. :)

Answer 4

Puedes usar las transiciones automáticas. Está funcionando perfectamente bien:

// Add transition (must be called after myLabel has been displayed)
 CATransition *animation = [CATransition animation];
animation.duration = 1.0;
animation.type = kCATransitionFade;
animation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];
[myLabel.layer addAnimation:animation forKey:@"changeTextTransition"];

// Change the text
myLabel.text = newText;

Este código funciona si myLabel ya se muestra. Si no, myLabel.layer será nulo y la animación no se agregará al objeto.

en Swift 4 que sería:

let animation: CATransition = CATransition()
animation.duration = 1.0
animation.type = kCATransitionFade
animation.timingFunction = CAMediaTimingFunction(name: kCAMediaTimingFunctionEaseInEaseOut)
myLabel.layer.add(animation, forKey: "changeTextTransition")

Answer 5

Si desea que cuente hacia arriba y hacia abajo con el nuevo número empujando el número anterior (como un ticker o algo así):

let animation = CATransition()
animation.removedOnCompletion = true
animation.duration = 0.2
animation.type = kCATransitionPush
animation.subtype = newValue > value ? kCATransitionFromTop : kCATransitionFromBottom
animation.timingFunction = CAMediaTimingFunction(name: kCAMediaTimingFunctionEaseOut)
valueLabel.layer.addAnimation(animation, forKey:"changeTextTransition")