Soy nuevo en la programación de iPhone y Mac (desarrollado para Windows antes), y tengo una pregunta:
¿Cómo puedo animar la text
propiedad de UILabel
entre dos números, por ejemplo, del 5 al 80 en un estilo Ease-Out? ¿Es posible con CoreAnimation
? He estado buscando en Google durante una hora, pero no he encontrado nada que solucione mi problema. Lo que quiero: Animar el dinero de los usuarios para un juego simple. No se ve muy bien cuando pasa de 50 a 100 o algo así sin animación.
¿Alguien tiene una idea de cómo hacer eso?
¡Gracias!
Respuestas:
Puede utilizar las transiciones automáticas. Funciona 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 eso sería:
let animation: CATransition = CATransition() animation.duration = 1.0 animation.type = kCATransitionFade animation.timingFunction = CAMediaTimingFunction(name: kCAMediaTimingFunctionEaseInEaseOut) myLabel.layer.add(animation, forKey: "changeTextTransition")
fuente
removedOnCompletion
queNO
en el caso deCATransition
, cada cambio en la década de etiquetatext
será animado.changeTextTransition
. Es simplemente una cadena que identifica la animación , lo que significa que es una cadena que puede usar más adelante para identificar una animación que agregó anteriormente. Si no necesita poder identificar su animación más adelante, solo puede especificarnil
.¡Funciona bien!
C objetivo
[UIView transitionWithView:self.label duration:.5f options:UIViewAnimationOptionCurveEaseInOut | UIViewAnimationOptionTransitionCrossDissolve animations:^{ self.label.text = rand() % 2 ? @"111!" : @"42"; } completion:nil];
Swift 2
UIView.transitionWithView(label, duration: 0.25, options: [.CurveEaseInOut, .TransitionCrossDissolve], animations: { self.label.text = (arc4random() % 2 == 0) ? "111" : "222" }, completion: nil)
Rápido 3, 4, 5
UIView.transition(with: label, duration: 0.25, options: [.curveEaseInOut, .transitionCrossDissolve], animations: { self.label.text = (arc4random() % 2 == 0) ? "111" : "222" }, completion: nil)
fuente
image
de aUIImageView
Encontré un gran motor para la interpolación de valores con una variedad de funciones de temporización diferentes llamado PRTween . Instale las clases y cree código siguiendo 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 muy bien para mí. :)
fuente
Si desea que cuente hacia arriba y hacia abajo con el nuevo número eliminando 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")
fuente
En Swift 2.0, usando el
UIView.transitionWithView()
método:UIView.transitionWithView(self.payPeriodSummaryLabel, duration: 0.2, options: [.CurveEaseInOut, .TransitionCrossDissolve], animations: { () -> Void in self.label.text = "your text value" }, completion: nil)
fuente
otra alternativa simple
extension UILabel { func countAnimation(upto: Double) { let from: Double = text?.replace(string: ",", replacement: ".").components(separatedBy: CharacterSet.init(charactersIn: "-0123456789.").inverted).first.flatMap { Double($0) } ?? 0.0 let steps: Int = 20 let duration = 0.350 let rate = duration / Double(steps) let diff = upto - from for i in 0...steps { DispatchQueue.main.asyncAfter(deadline: .now() + rate * Double(i)) { self.text = "\(from + diff * (Double(i) / Double(steps)))" } } } }
fuente