如何使用CrossDissolve幻灯片切换为Tab栏选项卡切换设置动画?

我正在尝试在类似于Facebook应用程序的UITabBarController上创建过渡效果。 我设法得到一个“滚动效果”工作Tab键切换,但我似乎无法弄清楚如何交叉溶解(或它至少不起作用)。

这是我目前的代码:

 import UIKit class ScrollingTabBarControllerDelegate: NSObject, UITabBarControllerDelegate { func tabBarController(_ tabBarController: UITabBarController, animationControllerForTransitionFrom fromVC: UIViewController, to toVC: UIViewController) -> UIViewControllerAnimatedTransitioning? { return ScrollingTransitionAnimator(tabBarController: tabBarController, lastIndex: tabBarController.selectedIndex) } } class ScrollingTransitionAnimator: NSObject, UIViewControllerAnimatedTransitioning { weak var transitionContext: UIViewControllerContextTransitioning? var tabBarController: UITabBarController! var lastIndex = 0 func transitionDuration(using transitionContext: UIViewControllerContextTransitioning?) -> TimeInterval { return 0.2 } init(tabBarController: UITabBarController, lastIndex: Int) { self.tabBarController = tabBarController self.lastIndex = lastIndex } func animateTransition(using transitionContext: UIViewControllerContextTransitioning) { self.transitionContext = transitionContext let containerView = transitionContext.containerView let fromViewController = transitionContext.viewController(forKey: UITransitionContextViewControllerKey.from) let toViewController = transitionContext.viewController(forKey: UITransitionContextViewControllerKey.to) containerView.addSubview(toViewController!.view) var viewWidth = toViewController!.view.bounds.width if tabBarController.selectedIndex < lastIndex { viewWidth = -viewWidth } toViewController!.view.transform = CGAffineTransform(translationX: viewWidth, y: 0) UIView.animate(withDuration: self.transitionDuration(using: (self.transitionContext)), delay: 0.0, usingSpringWithDamping: 1.2, initialSpringVelocity: 2.5, options: .transitionCrossDissolve, animations: { toViewController!.view.transform = CGAffineTransform.identity fromViewController!.view.transform = CGAffineTransform(translationX: -viewWidth, y: 0) }, completion: { _ in self.transitionContext?.completeTransition(!self.transitionContext!.transitionWasCancelled) fromViewController!.view.transform = CGAffineTransform.identity }) } } 

如果有人知道如何让这个工作,那将是很好的,现在已经尝试了几天没有进展……:/

编辑:我通过用以下代码替换UIView.animate块来进行交叉解散工作:

 UIView.transition(with: containerView, duration: 0.2, options: .transitionCrossDissolve, animations: { toViewController!.view.transform = CGAffineTransform.identity fromViewController!.view.transform = CGAffineTransform(translationX: -viewWidth, y: 0) }, completion: { _ in self.transitionContext?.completeTransition(!self.transitionContext!.transitionWasCancelled) fromViewController!.view.transform = CGAffineTransform.identity }) 

但是 ,动画真的很滞后,不可用:(

编辑2:对于试图使用这些片段的人,不要忘记连接UITabBarController的委托,否则什么都不会发生。

编辑3:我找到了一个完全符合我要求的Swift库: https : //github.com/Interactive-Studio/TransitionableTab

有一种更简单的方法可以做到这一点。 在tabbar委托中添加以下代码:

在Swift 2,3和4上工作

 class MySubclassedTabBarController: UITabBarController { override func viewDidLoad() { super.viewDidLoad() delegate = self } } extension MySubclassedTabBarController: UITabBarControllerDelegate { func tabBarController(_ tabBarController: UITabBarController, shouldSelect viewController: UIViewController) -> Bool { guard let fromView = selectedViewController?.view, let toView = viewController.view else { return false // Make sure you want this as false } if fromView != toView { UIView.transition(from: fromView, to: toView, duration: 0.3, options: [.transitionCrossDissolve], completion: nil) } return true } } 

编辑(4/23/18)由于这个答案越来越受欢迎,我更新了代码以删除强制解包,这是一种不好的做法,并添加了保护声明。

编辑(7/11/18) @AlbertoGarcía是对的。 如果您点击两次标签栏图标,则会出现空白屏幕。 所以我加了一个额外的支票

Interesting Posts