Как анимировать цвет фона UILabel?


Это выглядит, как это должно работать, но не. Цвет становится зеленым сразу.

self.labelCorrection.backgroundColor = [UIColor whiteColor];
[UIView animateWithDuration:2.0 animations:^{
    self.labelCorrection.backgroundColor = [UIColor greenColor];
}];
11 70

11 ответов:

Я не могу найти это нигде документально, но похоже backgroundColor собственность UILabel не анимируется, так как ваш код отлично работает с ванилью UIView. Этот хак, кажется, работает, однако, до тех пор, пока вы не установите цвет фона самого представления метки:

#import <QuartzCore/QuartzCore.h>

...

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

[UIView animateWithDuration:2.0 animations:^{
    theLabel.layer.backgroundColor = [UIColor greenColor].CGColor;
} completion:NULL];

Свифт

  1. (важно) установите цвет фона UILabel для очистки (либо в IB, либо в коде). Например:

    override func viewDidLoad() {
        super.viewDidLoad()
    
        myLabel.backgroundColor = UIColor.clear
    }
    
  2. анимация цвета фона слоя.

    @IBAction func animateButtonTapped(sender: UIButton) {
    
        UIView.animate(withDuration: 1.0, animations: {
            self.myLabel.layer.backgroundColor = UIColor.red.cgColor
        })
    }
    

отметим, что CGColor после UIColor.

результат

enter image description here

вы можете анимировать его, но я должен был сначала установить его (программно), чтобы очистить цвет по какой-то причине. Без этого анимация либо не работала, либо не была видна.

Я анимирую цвет фона UILabel в пользовательской ячейке таблицы. Вот код в методе willDisplayCell. Я бы не стал пытаться установить анимацию в cellForRow, так как большая часть макета обрабатывается таблицей.

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

вот моя анимация рутина:

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

Swift 3

чтобы анимировать цвет фона метки с белого на зеленый, установите метку следующим образом:

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

анимировать так:

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

чтобы вернуться в исходное состояние, так что вы можете анимировать снова, убедитесь, что вы удалите анимацию:

self.labelCorrection.layer.backgroundColor = UIColor.white.cgColor
self.labelCorrection.layer.removeAllAnimations()

сделайте цветную анимацию вручную, основываясь на обратном вызове NSTimer или CADisplayLink с некоторой разумной частотой кадров (скажем, 20 кадров в секунду). Вам нужно будет рассчитать свою собственную кривую изменения цвета в RGB или HSV на основе дробного времени, прошедшего за полное время анимации (2,0 секунды в вашем примере), или использовать массив из 40 промежуточных цветов.

недавно я столкнулся с этой проблемой еще раз, и после некоторых исследований я понял, что в основном ничего не изменилось (и, вероятно, не будет в обозримом будущем), поэтому я в конечном итоге использовал Facebook POP framework (и не только) для этого.

вы можете легко делать анимацию основных свойств как на виде, так и на слое, но кроме того, она обеспечивает плавный переход между цветами (и в основном все, что вы хотите, даже ваши пользовательские типы, с некоторым дополнительным кодированием). Так цвет фона, вы бы сделали что-то вроде этого:

   // 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")

Виола, теперь вы можете анимировать цвета фона на все, что имеет это свойство!

Он говорит в документах, что backgroundColor является анимируемым

http://developer.apple.com/library/ios/#documentation/uikit/reference/UIView_Class/UIView/UIView.html#//apple_ref/doc/uid/TP40006816-CH3-SW131

Не знаю с каких пор.

Если вы не хотите погружаться в Кварц, за ответ на один из ответов prev, создайте пустой UIView того же размера, что и UILabel, и поместите его в то же место, что и UILabel (и в порядке Z, под ним), и вы можете анимировать цвет фона этого UIView (я пробовал это, и это работает для меня).

пожалуйста, попробуйте это,

[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) {

 }];

это работает для меня.

вот ссылка:

анимация объекта блока, содержащего изменения для фиксации в представлениях. Это где вы программно изменение любых анимируемых свойств представления в иерархии представлений. Этот блок не принимает параметров и не имеет значение. Этот параметр не должен быть NULL

то, что я понимаю об этом, когда ваш вид вызывает блок анимации, тогда ваш цвет фона метки вида должен быть зеленый с тех пор. Затем, если вы не измените цвет фона метки на что-то другое, то он всегда будет зеленым. Вот что я думаю

Swift 4.1 Расширение UILabel:

добавить данное расширение в свой код:

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)
    }

}

вы должны использовать его так:

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

Теперь, если вы хотите восстановить исходный цвет, используйте его следующим образом:

// 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
})