我们知道动画对于UI是怎么说都不为过,往往只需加一点点动画效果,那么一点点灵动轻巧的触动,用户感觉就会完全不一样。
这里我将向大家展示如何通过派生UITextField类实现占位符动画显示效果。
这里有2个关键点:
1.怎么显示动画? 2.如何让占位符显示动画?
一.怎么显示动画?我们不想闭门造车,只想草舟借箭 ;)
所以本猫决定采用LTMorphingLabel这个github上很棒的动画类来解决怎么显示动画这个问题。
至于LTMorphingLabel的动画效果及使用简介,大家可到我写的这篇博文中观赏:
Swift借助CocoaPods库实现UI功能上的串串烧
二.如何让占位符显示动画?下一步就是如何让UITextField的占位符显示动画?通过Xcode的View继承体系查看,其实UITextField的占位符也是UILabel。
我们只需要在找到它之后将其替换为LTMorphingLabel对象就可以了。
看似很简单,但要注意的是,需要将原来UILabel的属性复制过来,这样才能保证显示动画的同时外观不那么唐突。
首先我们先找到UITextField的占位符对象:
if let placeholderLabel = self.value(forKey: "_placeholderLabel") as? UILabel{ //TODO:将placeholderLabel替换为LTMorphingLabel }
然后新建一个LTMorphingLabel对象,复制placeholderLabel的属性:
let frame = placeholderLabel.frame morphingPlaceholderLabel = LTMorphingLabel(frame: frame) morphingPlaceholderLabel.text = placeholderLabel.text morphingPlaceholderLabel.backgroundColor = placeholderLabel.backgroundColor morphingPlaceholderLabel.font = placeholderLabel.font morphingPlaceholderLabel.textColor = UIColor.lightGray //设置动画类型 morphingPlaceholderLabel.morphingEffect = .scale
将原来的Label替换为morphingPlaceholderLabel:
self.addSubview(morphingPlaceholderLabel) self.setValue(morphingPlaceholderLabel, forKey: "_placeholderLabel")
最后别忘了将原有的Label删除:
placeholderLabel.removeFromSuperview()
我们需要找到替换Label的时机:
override public func layoutSubviews() { super.layoutSubviews() initPlaceholderLable() }
为了不造成多次重复替换,我们设置一个标志:
guard isPlaceHolderInited == false else {return} isPlaceHolderInited = true
现在我们只需要在使用动画的地方创建我们的UITextField派生类,就可以实现占位符显示动画的效果啦 ;)