Изменение анимации текста в UILabel

Question

Я устанавливаю новое текстовое значение на UILabel. В настоящее время новый текст выглядит просто отлично. Тем не менее, я хотел бы добавить анимацию при появлении нового текста. Мне интересно, что я могу сделать, чтобы оживить появление нового текста.

Answer 1

Objective-C

Чтобы добиться перекрестного растворения true (старая метка исчезает , а новая метка исчезает), вы не хотите, чтобы исчезновение стало невидимым. Это приведет к нежелательному мерцанию, даже если текст остается неизменным .

Используйте этот подход вместо:

CATransition *animation = [CATransition animation];
animation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut];
animation.type = kCATransitionFade;
animation.duration = 0.75;
[aLabel.layer addAnimation:animation forKey:@"kCATransitionFade"];

// This will fade:
aLabel.text = "New"

Также см .: Анимировать текст UILabel между двумя числами?

Демонстрация в iOS 10, 9, 8:

---

Протестировано с Xcode 8.2.1 и 7.1 , ObjectiveC на iOS 10 до 8.0 .

► Чтобы загрузить полный проект, выполните поиск SO-3073520 in Swift Recipes .

Answer 2

Интересно, работает ли он и работает ли он отлично!

Objective-C

[UIView transitionWithView:self.label 
                  duration:0.25f 
                   options:UIViewAnimationOptionTransitionCrossDissolve 
                animations:^{

    self.label.text = rand() % 2 ? @"Nice nice!" : @"Well done!";

  } completion:nil];

Swift 3

UIView.transition(with: label,
              duration: 0.25,
               options: .transitionCrossDissolve,
            animations: { [weak self] in
                self?.label.text = (arc4random()() % 2 == 0) ? "One" : "Two"
         }, completion: nil)

Answer 3

Swift 4

Правильный способ исчезновения UILabel (или любого UIView в этом отношении) состоит в использовании Core Animation Transition.Это не будет мерцать и не исчезнет, ​​если содержимое не изменилось.

Переносимое и чистое решение состоит в использовании Extension в Swift (вызовите ранее измененные видимые элементы)

// Usage: insert view.fadeTransition right before changing content


extension UIView {
    func fadeTransition(_ duration:CFTimeInterval) {
        let animation = CATransition()
        animation.timingFunction = CAMediaTimingFunction(name:
            CAMediaTimingFunctionName.easeInEaseOut)
        animation.type = CATransitionType.fade
        animation.duration = duration
        layer.add(animation, forKey: CATransitionType.fade.rawValue)
    }
}

Вызов выглядит так:

// This will fade
aLabel.fadeTransition(0.4)
aLabel.text = "text"

---

► Найдите это решение на GitHub и дополнительных деталях Быстрые рецепты .

Answer 4

, начиная с iOS4, это можно сделать с помощью блоков:

[UIView animateWithDuration:1.0
                 animations:^{
                     label.alpha = 0.0f;
                     label.text = newText;
                     label.alpha = 1.0f;
                 }];

Answer 5

Вот код для этой работы.

[UIView beginAnimations:@"animateText" context:nil];
[UIView setAnimationCurve:UIViewAnimationCurveEaseIn];
[UIView setAnimationDuration:1.0f];
[self.lbl setAlpha:0];
[self.lbl setText:@"New Text";
[self.lbl setAlpha:1];
[UIView commitAnimations];

Answer 6

Решение для расширения UILabel

extension UILabel{

  func animation(typing value:String,duration: Double){
    let characters = value.map { $0 }
    var index = 0
    Timer.scheduledTimer(withTimeInterval: duration, repeats: true, block: { [weak self] timer in
        if index < value.count {
            let char = characters[index]
            self?.text! += "\(char)"
            index += 1
        } else {
            timer.invalidate()
        }
    })
  }


  func textWithAnimation(text:String,duration:CFTimeInterval){
    fadeTransition(duration)
    self.text = text
  }

  //followed from @Chris and @winnie-ru
  func fadeTransition(_ duration:CFTimeInterval) {
    let animation = CATransition()
    animation.timingFunction = CAMediaTimingFunction(name:
        CAMediaTimingFunctionName.easeInEaseOut)
    animation.type = CATransitionType.fade
    animation.duration = duration
    layer.add(animation, forKey: CATransitionType.fade.rawValue)
  }

}

Функция простого вызова от

uiLabel.textWithAnimation(text: "text you want to replace", duration: 0.2)

Спасибо за советы, ребята.Надеюсь, что это поможет в долгосрочной перспективе

Answer 7

Swift 2.0:

UIView.transitionWithView(self.view, duration: 1.0, options: UIViewAnimationOptions.TransitionCrossDissolve, animations: {
    self.sampleLabel.text = "Animation Fade1"
    }, completion: { (finished: Bool) -> () in
        self.sampleLabel.text = "Animation Fade - 34"
})

ИЛИ

UIView.animateWithDuration(0.2, animations: {
    self.sampleLabel.alpha = 1
}, completion: {
    (value: Bool) in
    self.sampleLabel.alpha = 0.2
})

Answer 8

Swift 4.2 версия решения SwiftArchitect выше (прекрасно работает):

    // Usage: insert view.fadeTransition right before changing content    

extension UIView {

        func fadeTransition(_ duration:CFTimeInterval) {
            let animation = CATransition()
            animation.timingFunction = CAMediaTimingFunction(name: CAMediaTimingFunctionName.easeInEaseOut)
            animation.type = CATransitionType.fade
            animation.duration = duration
            layer.add(animation, forKey: CATransitionType.fade.rawValue)
        }
    }

Вызов:

    // This will fade

aLabel.fadeTransition(0.4)
aLabel.text = "text"

Answer 9

Системные значения по умолчанию 0,25 для duration и .curveEaseInEaseOut для timingFunction часто предпочтительнее для согласованности анимаций и могут быть опущены:

let animation = CATransition()
label.layer.add(animation, forKey: nil)
label.text = "New text"

, что аналогично написанию этого:

let animation = CATransition()
animation.duration = 0.25
animation.timingFunction = .curveEaseInEaseOut
label.layer.add(animation, forKey: nil)
label.text = "New text"

Answer 10

Решение Swift 4.2 (ответ 4.0 и обновление для новых перечислений для компиляции)

extension UIView {
    func fadeTransition(_ duration:CFTimeInterval) {
        let animation = CATransition()
        animation.timingFunction = CAMediaTimingFunction(name:
            CAMediaTimingFunctionName.easeInEaseOut)
        animation.type = CATransitionType.fade
        animation.duration = duration
        layer.add(animation, forKey: CATransitionType.fade.rawValue)
    }
}

func updateLabel() {
myLabel.fadeTransition(0.4)
myLabel.text = "Hello World"
}