Comment animer la couleur d'arrière-plan d'un UILabel?

Cela semble comme il se doit le travail, mais ne le fait pas. La couleur vire au vert à la fois.

self.labelCorrection.backgroundColor = [UIColor whiteColor];
[UIView animateWithDuration:2.0 animations:^{
    self.labelCorrection.backgroundColor = [UIColor greenColor];
}];
  • Pour les futurs lecteurs, ce n'est pas spécifique à UILabel, mais la condition est que d'un point de vue doit commencer avec une couleur d'arrière-plan, même si la couleur est claire. Vous n'avez pas besoin d'animer sur la couche, la UIView.backgroundColor fonctionne très bien, à condition ci-dessus.
InformationsquelleAutor Michiel de Mare | 2010-09-21
  1. 140

    Je ne le trouve pas documenté n'importe où, mais il semble que l' backgroundColor propriété de UILabel n'est pas animables, que votre code fonctionne très bien avec la vanille,UIView. Ce hack semble fonctionner, cependant, aussi longtemps que vous n'avez pas à définir la couleur d'arrière-plan de l'étiquette de la vue elle-même:

    #import <QuartzCore/QuartzCore.h>

...

theLabel.layer.backgroundColor = [UIColor whiteColor].CGColor;

[UIView animateWithDuration:2.0 animations:^{
    theLabel.layer.backgroundColor = [UIColor greenColor].CGColor;
} completion:NULL];
    • Cela fonctionne, merci! Je voudrais encore savoir pourquoi une UIView œuvres, et un UILabel n'est pas, après tout, un UILabel est une UIView.
    • D'accord. Je ne peux que supposer, à ce point qu'Apple a choisi de faire de ces propriétés de non-animés pour UILabel. FWIW, UIButton se comporte de la même manière que l'étiquette.
    • Curieusement, au moins la frame propriété ne semble pas être animables trop si le UILabel vient d'un xib. Il fonctionne si elle est créée par programme, même si... bizarre.
    • UITextFields comportent de la même façon—pas d'animation.
    • fantastique!!!! Vous êtes un génie!
    • Tout ce que je obtenir un arrière-plan blanc avec ce sur iOS 6.
    • voyageur: vous devez définir le backgroundColor de la UILabel à ClearColor ou bien il va juste animer les trucs derrière l'étiquette, si cela fait sens. Aussi, cela fonctionne, mais est hackish, provoquer les coins de l'arrondi UILabel montrer tout son animation, et il est de mauvaise qualité =/
    • Savez-vous pourquoi c'est le cas ?
    • Je vais avoir un fond blanc sur iOS 7 ainsi.
    • Testé et confirmé sur UITextView. M'a sauvé! 🙂
    • Je viens de remarquer que même si vous définissez la couleur d'arrière-plan de la couche UILabel, il peut ne fonctionne toujours pas. J'ai d'abord été réglage de la backgroundColor de mon UILabel dans ma méthode init, puis animer la couche, mais il ne fonctionne pas, il nous faut donc être prudent lors de l'initialisation de la UILabel : nous devons définir sa calque backgroundColor, pas son backgroundColor.
    • Il ressemble il est maintenant animables, mais cela ne fonctionne toujours pas 🙁 Aussi, j'ai toujours pensé que vous ne pouvez animer layer's en utilisant les propriétés CAAnimation et pas UIView animate... fonctions. Ai-je vivre dans un mensonge?

    InformationsquelleAutor bosmacs
  2. 18

    Swift

    1. (important) Définir la UILabel de l'arrière-plan de couleur claire (soit au bureau de l'IB ou dans le code). Par exemple:

      override func viewDidLoad() {
    super.viewDidLoad()

    myLabel.backgroundColor = UIColor.clear
}

    2. Animer la couche de couleur d'arrière-plan.

      @IBAction func animateButtonTapped(sender: UIButton) {

    UIView.animate(withDuration: 1.0, animations: {
        self.myLabel.layer.backgroundColor = UIColor.red.cgColor
    })
}

    Noter que CGColor est ajouté après le UIColor.

    Résultat

    Comment animer la couleur d'arrière-plan d'un UILabel?

    InformationsquelleAutor Suragch
  3. 7

    Vous POUVEZ l'animer, mais j'ai eu d'abord de la définir (par programmation) à clearColor pour une raison quelconque. Sans que l'animation soit ne fonctionne pas ou n'était pas visible.

    Je suis de l'animation de la couleur d'arrière-plan d'un UILabel dans un tableau personnalisé de la cellule. Voici le code dans le willDisplayCell méthode. Je ne voudrais pas essayer de mettre de l'animation dans cellForRow, puisque beaucoup de la mise en page obtient bricolé avec par la table.

    - (void)tableView:(UITableView *)tableView willDisplayCell:(UITableViewCell *)cell forRowAtIndexPath:(NSIndexPath *)indexPath
{
        ((RouteListCell *)cell).name.backgroundColor = [UIColor clearColor];
        [((RouteListCell *)cell).name backgroundGlowAnimationFromColor:[UIColor whiteColor] toColor:[UIColor redColor] clearAnimationsFirst:YES];
}

    Voici mon animation de routine:

    -(void) backgroundGlowAnimationFromColor:(UIColor *)startColor toColor:(UIColor *)destColor clearAnimationsFirst:(BOOL)reset;
{
    if (reset)
    {
        [self.layer removeAllAnimations];
    }

    CABasicAnimation *anAnimation = [CABasicAnimation animationWithKeyPath:@"backgroundColor"];
    anAnimation.duration = 1.00;
    anAnimation.repeatCount = HUGE_VAL;
    anAnimation.autoreverses = YES;
    anAnimation.fromValue = (id) startColor.CGColor; //[NSNumber numberWithFloat:1.0];
    anAnimation.toValue = (id) destColor.CGColor; //[NSNumber numberWithFloat:0.10];
    [self.layer addAnimation:anAnimation forKey:@"backgroundColor"];
}
    InformationsquelleAutor software evolved
  4. 7

    Swift 3

    Pour animer votre étiquette de couleur d'arrière-plan en blanc, vert, configurer votre étiquette comme ceci:

    self.labelCorrection.backgroundColor = UIColor.clear
self.labelCorrection.layer.backgroundColor = UIColor.white.cgColor

    Animer comme ceci:

    UIView.animate(withDuration: 2.0) { 
    self.labelCorrection.layer.backgroundColor = UIColor.green.cgColor
}

    Pour revenir à l'état initial, de sorte que vous pouvez animer de nouveau, assurez-vous de supprimer les animations:

    self.labelCorrection.layer.backgroundColor = UIColor.white.cgColor
self.labelCorrection.layer.removeAllAnimations()
    InformationsquelleAutor Mike Taverne
  5. 2

    Ne l'animation de couleur manuellement, à partir d'un NSTimer ou CADisplayLink de rappel à certains raisonnables taux de trame (disons 20 fps). Vous devrez calculer votre propre changement de couleur de la courbe RVB ou HSV basé sur la fraction de temps écoulé sur l'ensemble de l'animation de temps (2,0 secondes dans votre exemple), ou d'utiliser une gamme de 40 couleurs intermédiaires.

    InformationsquelleAutor hotpaw2
  6. 2

    S'il vous plaît essayer ce,

    [UIView transitionWithView:yourView duration:0.2 options:UIViewAnimationOptionTransitionNone animations:^{

[yourView setBackgroundColor:[UIColor colorWithRed:0.8588 green:0.8588 blue:0.8588 alpha:1]];
    }completion:^(BOOL finished) {

 }];

    Cela fonctionne pour moi.

    InformationsquelleAutor Techie
  7. 2

    Je suis récemment tombé sur ce problème une fois de plus et après quelques recherches, j'ai compris que, fondamentalement, rien n'a changé (et ne sera probablement pas dans un avenir prévisible), donc j'ai fini par utiliser Facebook POP-cadre (non seulement) pour que les.

    Vous pouvez le faire facilement des animations de propriétés de base à la fois de la vue et de la couche, mais en outre, il offre une transition en douceur entre les couleurs (et en gros tout ce que vous voulez, même vos types personnalisés, avec certains de codage supplémentaire). Donc pour la couleur d'arrière-plan, vous voulez faire quelque chose comme ceci:

       //Create spring animation (there are more types, if you want)
   let animation = POPSpringAnimation(propertyNamed: kPOPViewBackgroundColor)

   //Configure it properly
   animation.autoreverses = false
   animation.removedOnCompletion = true
   animation.fromValue = UIColor.yourBeginningColor()
   animation.toValue = UIColor.yourFinalColor()

   //Add new animation to your view - animation key can be whatever you like, serves as reference
   label.pop_addAnimation(animation, forKey: "YourAnimationKey")

    Alto, maintenant, vous pouvez animer les couleurs de fond sur tout ce qui a la propriété!

    InformationsquelleAutor Jiri Trecak
  9. 1

    Si vous ne voulez pas plonger vers le bas dans le Quartz, pour répondre à l'une des prev réponses, créer un vide UIView de la même taille que UILabel et le placer dans le même endroit que la UILabel (et dans l'ordre Z, en vertu de l') et que vous pourrez animer que UIView la couleur d'arrière-plan (j'ai essayé, et ça marche pour moi).

    InformationsquelleAutor DavidN
  10. 0

    Voici la référence:

    les animations d'Un objet contenant un bloc
    les changements de commettre les points de vue.
    C'est là que vous par programme
    modifier toutes les propriétés animables de
    le point de vue de votre point de vue de la hiérarchie. Cette
    bloc ne prend aucun paramètre et n'a pas de
    valeur de retour. Ce paramètre ne doit pas
    NULLE

    Ce que je comprends sur ce est quand votre affichage de l'animation à bloc, puis votre étiquette de vue la couleur de fond est engagé pour être le vert depuis ce temps. Alors, si vous ne modifiez pas l'étiquette de la couleur d'arrière-plan en quelque chose d'autre, alors il sera toujours vert. C'est ce que je suppose

    InformationsquelleAutor vodkhang
  11. 0

    Swift 4.1 UILabel Extension:

    Ajouter cette extension à votre code:

    extension UILabel {

    /** Animates the background color of a UILabel to a new color. */
    func animateBackgroundColor(to color : UIColor?, withDuration : TimeInterval, completion : ((Bool) -> Void)? = nil) {
        guard let newColor = color else { return }
        self.backgroundColor = .clear
        UIView.animate(withDuration: withDuration, animations: {
            self.layer.backgroundColor = newColor.cgColor
        }, completion: completion)
    }

}

    Vous devriez l'utiliser comme ceci:

    myUILabel.animateBackgroundColor(to: .red, withDuration: 0.5)

    Maintenant, si vous souhaitez restaurer la couleur d'origine, l'utiliser comme ceci:

    //Storing the orignal color:
let originalColor = myUILabel.backgroundColor

//Changing the background color:
myUILabel.animateBackgroundColor(to: .red, withDuration: 0.5)

//... Later:

//Restoring the original color:
myUILabel.animateBackgroundColor(to: originalColor, withDuration: 0.5, completion: {
    (value: Bool) in
    myUILabel.backgroundColor = originalColor
})
    InformationsquelleAutor ThiagoAM