Анимация изменения текста в UILabel
Я устанавливаю новое текстовое значение UILabel
. В настоящее время новый текст выглядит просто отлично. Однако я хотел бы добавить некоторую анимацию, когда появится новый текст. Мне интересно, что я могу сделать, чтобы оживить внешний вид нового текста.
10 ответов:
С
достижения правда переход перекрестного растворения (старая метка исчезает пока новый ярлык увядая внутри), вы не хотите увядать к невидимому. Это приведет к нежелательное мерцание, даже если текст не изменился.
использовать этот подход вместо:
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 on iOS 10 до 8.0.
► скачать полный проект для поиска SO-3073520 на Быстрые Рецепты.
интересно, если он работает, и он работает отлично!
С
[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)
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: kCAMediaTimingFunctionEaseInEaseOut) animation.type = kCATransitionFade animation.duration = duration layer.add(animation, forKey: kCATransitionFade) } }
ссылка выглядит так:
// This will fade aLabel.fadeTransition(0.4) aLabel.text = "text"
► найти это решение на GitHub и дополнительные сведения о Быстрые Рецепты.
так как iOS4 это, очевидно, может быть сделано с блоками:
[UIView animateWithDuration:1.0 animations:^{ label.alpha = 0.0f; label.text = newText; label.alpha = 1.0f; }];
вот код, чтобы сделать эту работу.
[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];
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 })
это метод расширения C# UIView, основанный на коде @SwiftArchitect. Когда используется автоматический макет и элементы управления должны перемещаться в зависимости от текста метки, этот вызывающий код использует Супервизор метки в качестве представления перехода вместо самой метки. Я добавил лямбда-выражение для действия, чтобы сделать его более герметично.
public static void FadeTransition( this UIView AView, double ADuration, Action AAction ) { CATransition transition = new CATransition(); transition.Duration = ADuration; transition.TimingFunction = CAMediaTimingFunction.FromName( CAMediaTimingFunction.Linear ); transition.Type = CATransition.TransitionFade; AView.Layer.AddAnimation( transition, transition.Type ); AAction(); }
телефонный код:
labelSuperview.FadeTransition( 0.5d, () => { if ( condition ) label.Text = "Value 1"; else label.Text = "Value 2"; } );
если вы хотите сделать это в
Swift
С задержкой попробуйте это:delay(1.0) { UIView.transitionWithView(self.introLabel, duration: 0.25, options: [.TransitionCrossDissolve], animations: { self.yourLabel.text = "2" }, completion: { finished in self.delay(1.0) { UIView.transitionWithView(self.introLabel, duration: 0.25, options: [.TransitionCrossDissolve], animations: { self.yourLabel.text = "1" }, completion: { finished in }) } }) }
используя следующую функцию, созданную @matt -https://stackoverflow.com/a/24318861/1982051:
func delay(delay:Double, closure:()->()) { dispatch_after( dispatch_time( DISPATCH_TIME_NOW, Int64(delay * Double(NSEC_PER_SEC)) ), dispatch_get_main_queue(), closure) }
который станет этим в Swift 3
func delay(_ delay:Double, closure:()->()) { let when = DispatchTime.now() + delay DispatchQueue.main.after(when: when, execute: closure) }
в соответствии с вашими вкусами и потребностями, вы можете выбрать один из три следующих фрагмента кода для того, чтобы оживить ваш
UILabel
текст меняется с некоторым перекрестным растворением анимации:1. Используя
transition(with:duration:options:animations:completion:)
import UIKit import PlaygroundSupport class ViewController: UIViewController { let label: UILabel = { .frame.origin = CGPoint(x: 50, y: 50) .text = "Bob" .sizeToFit() return }(UILabel()) override func viewDidLoad() { super.viewDidLoad() view.backgroundColor = .white view.addSubview(label) let tapGesture = UITapGestureRecognizer(target: self, action: #selector(toggle(_:))) view.addGestureRecognizer(tapGesture) } func toggle(_ sender: UITapGestureRecognizer) { let animation = { self.label.text = self.label.text == "Bob" ? "Dan" : "Bob" } UIView.transition(with: label, duration: 1, options: .transitionCrossDissolve, animations: animation, completion: nil) } } let controller = ViewController() PlaygroundPage.current.liveView = controller
2. Используя
CATransition
иCATransition
' stype
свойстваimport UIKit import PlaygroundSupport class ViewController: UIViewController { let label: UILabel = { .frame.origin = CGPoint(x: 50, y: 50) .text = "Bob" .sizeToFit() return }(UILabel()) let animation: CATransition = { .timingFunction = CAMediaTimingFunction(name: kCAMediaTimingFunctionEaseInEaseOut) .type = kCATransitionFade .duration = 1 return }(CATransition()) override func viewDidLoad() { super.viewDidLoad() view.backgroundColor = .white view.addSubview(label) let tapGesture = UITapGestureRecognizer(target: self, action: #selector(toggle(_:))) view.addGestureRecognizer(tapGesture) } func toggle(_ sender: UITapGestureRecognizer) { label.layer.add(animation, forKey: nil) label.text = label.text == "Bob" ? "Dan" : "Bob" label.sizeToFit() } } let controller = ViewController() PlaygroundPage.current.liveView = controller
3. Используя
CATransition
иadd(_:forKey:)
key
параметрimport UIKit import PlaygroundSupport class ViewController: UIViewController { let label: UILabel = { .frame.origin = CGPoint(x: 50, y: 50) .text = "Bob" .sizeToFit() return }(UILabel()) let animation: CATransition = { .timingFunction = CAMediaTimingFunction(name: kCAMediaTimingFunctionEaseInEaseOut) .duration = 1 return }(CATransition()) override func viewDidLoad() { super.viewDidLoad() view.backgroundColor = .white view.addSubview(label) let tapGesture = UITapGestureRecognizer(target: self, action: #selector(toggle(_:))) view.addGestureRecognizer(tapGesture) } func toggle(_ sender: UITapGestureRecognizer) { label.layer.add(animation, forKey: kCATransitionFade) label.text = label.text == "Bob" ? "Dan" : "Bob" label.sizeToFit() } } let controller = ViewController() PlaygroundPage.current.liveView = controller
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"