TKSubmitTransition 开源项目教程
项目介绍
TKSubmitTransition 是一个用于实现加载动画和过渡动画的 Swift 库,灵感来源于 Dribbble。该项目提供了一个自定义的 UIButton,可以在点击后显示加载动画,并在加载完成后过渡到下一个 UIViewController。
项目快速启动
安装
使用 Cocoapods
# Swift 5
pod 'TKSubmitTransition', :git => 'https://github.com/entotsu/TKSubmitTransition.git'
# Swift 4
pod 'TKSubmitTransition', :git => 'https://github.com/entotsu/TKSubmitTransition.git', :branch => 'swift4'
# Swift 3
pod 'TKSubmitTransition', :git => 'https://github.com/entotsu/TKSubmitTransition.git', :tag => '2.0'
# Swift 2 & Below
pod 'TKSubmitTransition', '~> 0.2'
手动安装
将 SubmitTransition/Classes
目录下的所有文件拖到你的项目中。
使用
在 Storyboard 中使用
- 在 Storyboard 中拖入一个 UIButton。
- 在 Identity Inspector 中将自定义类设置为
TKSubmitTransition
。 - 通过 Storyboard 设置按钮的属性。
- 在你的视图控制器中创建一个 IBOutlet。
代码中使用
import SubmitTransition
class YourViewController: UIViewController {
var btn: TKTransitionSubmitButton!
override func viewDidLoad() {
super.viewDidLoad()
btn = TKTransitionSubmitButton(frame: CGRect(x: 0, y: 0, width: self.view.frame.size.width - 64, height: 44))
btn.center = self.view.center
btn.frame.bottom = self.view.frame.height - 60
btn.setTitle("Sign in", for: .normal)
btn.titleLabel?.font = UIFont.systemFont(ofSize: 17)
btn.addTarget(self, action: #selector(didPressButton), for: .touchUpInside)
self.view.addSubview(btn)
}
@objc func didPressButton() {
btn.startLoadingAnimation()
// 模拟加载完成后过渡到下一个视图控制器
DispatchQueue.main.asyncAfter(deadline: .now() + 2) {
self.btn.startFinishAnimation {
let nextViewController = NextViewController()
nextViewController.transitioningDelegate = self
self.present(nextViewController, animated: true, completion: nil)
}
}
}
}
extension YourViewController: UIViewControllerTransitioningDelegate {
func animationController(forPresented presented: UIViewController, presenting: UIViewController, source: UIViewController) -> UIViewControllerAnimatedTransitioning? {
return TKFadeInAnimator()
}
}
应用案例和最佳实践
应用案例
- 登录页面:在用户点击登录按钮后,显示加载动画,加载完成后过渡到主页面。
- 表单提交:在用户提交表单后,显示加载动画,加载完成后显示提交成功的提示。
最佳实践
- 动画时长:确保加载动画的时长与实际加载时间相匹配,避免用户等待时间过长。
- 过渡效果:选择合适的过渡效果,使界面切换更加平滑。
- 错误处理:在加载失败时,提供友好的错误提示,并允许用户重新尝试。
典型生态项目
TKSubmitTransition 可以与其他 UI 动画库和过渡效果库结合使用,例如:
- Hero:一个用于实现流畅过渡效果的库。
- NVActivityIndicatorView:一个包含多种加载指示器的库。
通过结合这些库,可以进一步增强应用的用户体验和视觉效果。