生成UILabel的文本变化

我想在UILabel中设置animation文字的变化。

例如:旧文本向上移动,新文本从底部移入。

我已经意识到,我需要标签。 一个是旧的,一个是新的文本。 第二个UILabel位于第一个之下。 然后两个animation。

但是,如何切断第一个标签,使其通过框架顶部的animation?

使用UIView扩展

你不需要多个标签。 您可以使用单个标签在适当的位置进行animation处理:
– 利用内置CALayeranimation和UIView扩展
– 在故事板中,将UILabel放入带有剪辑子视图标记(脚注)UIView
pushTransition适用于大多数UIView

1.扩展

 // Usage: insert view.pushTransition right before changing content extension UIView { func pushTransition(_ duration:CFTimeInterval) { let animation:CATransition = CATransition() animation.timingFunction = CAMediaTimingFunction(name: kCAMediaTimingFunctionEaseInEaseOut) animation.type = kCATransitionPush animation.subtype = kCATransitionFromTop animation.duration = duration layer.add(animation, forKey: kCATransitionPush) } } 

Swift 2及更早版本(请参阅Steve self.layer.addAnimation(animation, forKey: kCATransitionPush) 的评论):使用self.layer.addAnimation(animation, forKey: kCATransitionPush)

2. pushTransition调用

 if let aLabel = label { aLabel.pushTransition(0.4) aLabel.text = "\(count)" count += 1 } 

3.在行动

你甚至可以控制曲线,持续时间和方向

CALayer动画


(†)剪切是达到预期效果的重要步骤。

►在GitHub上find这个解决scheme和Swift Recipes的更多细节。

Objective-C的

Swift UIView扩展可以通过Interface Extension在Objective-C中解决。

1. Interface Extension

 @interface UIView (SO33632266) - (void)pushTransition:(CFTimeInterval)duration; @end @implementation UIView (SO33632266) // Usage: insert [view pushTransition:]; right before changing content - (void)pushTransition:(CFTimeInterval)duration { CATransition *animation = [CATransition new]; animation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut]; animation.type = kCATransitionPush; animation.subtype = kCATransitionFromTop; animation.duration = duration; [self.layer addAnimation:animation forKey:kCATransitionPush]; } @end 

2. pushTransition调用

 [aLabel pushTransition:0.4]; aLabel.text = [[NSString alloc] initWithFormat:@"%ld", (long) ++self.count]; 

3.在行动

UILabel动画


一次性: 接口扩展:

 CATransition *animation = [CATransition animation]; animation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut]; animation.type = kCATransitionPush; animation.subtype = kCATransitionFromTop; animation.duration = 0.4; [aLabel.layer addAnimation:animation forKey:@"kCATransitionPush"]; 

调用:

 aLabel.text = [[NSString alloc] initWithFormat:@"%ld", (long) ++self.count]; 

QuartzCore为animation转换操作提供了一个CATransition类。 CATransition有以下定义:

CATransition类实现图层的过渡animation。 您可以从一组预定义的转换中指定转换效果,或者通过提供自定义的CIFilter实例来指定转换效果。


为了通过向上推动旧文本来使标签的文本转换成animation,必须创build一个CATransition的实例,并将其type设置为CATransition ,并将其type设置为kCATransitionFromTop

 let animation = CATransition() animation.timingFunction = CAMediaTimingFunction(name: kCAMediaTimingFunctionEaseInEaseOut) animation.type = kCATransitionPush animation.subtype = kCATransitionFromTop animation.duration = 1 

然后,您可以通过将animation添加到标签的图层来为标签的文本转换设置animation效果:

 label.layer.add(animation, forKey: nil) label.text = "Some new content" 

下面的Swift 3 Playground代码显示了一个可能的实现,以便使用CATransitionanimationUILabel的文本转换:

 import UIKit import PlaygroundSupport class ViewController: UIViewController { let label: UILabel = { $0.frame.origin = CGPoint(x: 50, y: 50) $0.text = "Bob" $0.sizeToFit() return $0 }(UILabel()) let animation: CATransition = { $0.timingFunction = CAMediaTimingFunction(name: kCAMediaTimingFunctionEaseInEaseOut) $0.type = kCATransitionPush $0.subtype = kCATransitionFromTop $0.duration = 1 return $0 }(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