web-dev-qa-db-fra.com

Animer le texte UILabel entre deux nombres?

Je suis nouveau dans la programmation iPhone et Mac (développé pour Windows auparavant), et j'ai une question:

Comment animer la propriété text d'un UILabel entre deux nombres, par ex. de 5 à 8 dans un style Ease-Out? Est-ce possible avec CoreAnimation? Je recherche sur Google depuis une heure, mais je n'ai rien trouvé pour résoudre mon problème. Ce que je veux: animer l'argent des utilisateurs pour un jeu simple. Ça n'a pas l'air très sympa quand ça passe de 5 à 1 ou quelque chose comme ça sans animation.

Quelqu'un a une idée de comment faire ça?

Merci!

iosiphoneanimationtextuilabel
78
Markus Kasten

Vous pouvez utiliser les transitions automatiques. Cela fonctionne parfaitement 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;

Ce code fonctionne si myLabel est déjà affiché. Sinon, myLabel.layer sera nul et l'animation ne sera pas ajoutée à l'objet.

en Swift 4 ce serait:

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

Ça marche bien!

Objectif-C

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

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

} completion:nil];

rapide

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

J'ai trouvé un excellent moteur pour l'interpolation des valeurs avec une variété de fonctions de synchronisation différentes appelées PRTween . Installez les classes et créez du code le long de ces lignes:

- (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];
}

Fonctionne un régal pour moi. :)

7
jowie

Si vous voulez en quelque sorte qu'il compte de haut en bas avec le nouveau numéro en repoussant le numéro précédent (comme un ticker ou quelque chose):

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")
5
Adam Waite

Dans Swift 2.0, en utilisant la méthode UIView.transitionWithView():

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