iPhone: Comment changer d'onglet avec une animation?
Je change d'onglet par programme dans une application pilotée par une barre d'onglets utilisant UITabBarController.selectedIndex. Le problème que j'essaie de résoudre est de savoir comment animer la transition entre les vues. c'est à dire. de la vue de l'onglet en cours à la vue de l'onglet sélectionné.
La première idée était d'utiliser UITabBarControllerDelegate, mais il semble que cela ne soit pas appelé lors du changement de tabulation par programme. J'envisage maintenant le UITabBarDelegate.didSelectItem: en tant que hook possible pour définir une animation de transition.
Quelqu'un a-t-il réussi à animer les transitions? Si oui comment?
Mise à jour 04/2016: Je voulais juste mettre à jour ceci pour dire merci à tous pour tous les votes. Veuillez également noter que cela a été écrit à l'époque ... avant ARC, avant les contraintes, avant ... beaucoup de choses! Veuillez donc en tenir compte lorsque vous décidez d’utiliser ces techniques. Il peut y avoir des approches plus modernes. Oh, et si vous en trouvez un. S'il vous plaît ajouter une réponse afin que tout le monde puisse voir. Merci.
Quelques temps plus tard ...
Après de nombreuses recherches, j'ai proposé deux solutions efficaces. Les deux fonctionnent et font l'animation entre les onglets.
Solution 1: transition de la vue (simple)
C'est la plus simple et utilise une méthode de transition UIView prédéfinie. Avec cette solution, nous n'avons pas besoin de gérer les vues car la méthode fait le travail pour nous.
// Get views. controllerIndex is passed in as the controller we want to go to.
UIView * fromView = tabBarController.selectedViewController.view;
UIView * toView = [[tabBarController.viewControllers objectAtIndex:controllerIndex] view];
// Transition using a page curl.
[UIView transitionFromView:fromView
toView:toView
duration:0.5
options:(controllerIndex > tabBarController.selectedIndex ? UIViewAnimationOptionTransitionCurlUp : UIViewAnimationOptionTransitionCurlDown)
completion:^(BOOL finished) {
if (finished) {
tabBarController.selectedIndex = controllerIndex;
}
}];
Solution 2: scroll (plus complexe)
Une solution plus complexe, mais vous donne plus de contrôle de l'animation. Dans cet exemple, nous obtenons les vues à glisser. Avec celui-ci, nous devons gérer nous-mêmes les vues.
// Get the views.
UIView * fromView = tabBarController.selectedViewController.view;
UIView * toView = [[tabBarController.viewControllers objectAtIndex:controllerIndex] view];
// Get the size of the view area.
CGRect viewSize = fromView.frame;
BOOL scrollRight = controllerIndex > tabBarController.selectedIndex;
// Add the to view to the tab bar view.
[fromView.superview addSubview:toView];
// Position it off screen.
toView.frame = CGRectMake((scrollRight ? 320 : -320), viewSize.Origin.y, 320, viewSize.size.height);
[UIView animateWithDuration:0.3
animations: ^{
// Animate the views on and off the screen. This will appear to slide.
fromView.frame =CGRectMake((scrollRight ? -320 : 320), viewSize.Origin.y, 320, viewSize.size.height);
toView.frame =CGRectMake(0, viewSize.Origin.y, 320, viewSize.size.height);
}
completion:^(BOOL finished) {
if (finished) {
// Remove the old view from the tabbar view.
[fromView removeFromSuperview];
tabBarController.selectedIndex = controllerIndex;
}
}];
Cette solution dans Swift:
extension TabViewController: UITabBarControllerDelegate {
public func tabBarController(tabBarController: UITabBarController, shouldSelectViewController viewController: UIViewController) -> Bool {
let fromView: UIView = tabBarController.selectedViewController!.view
let toView : UIView = viewController.view
if fromView == toView {
return false
}
UIView.transitionFromView(fromView, toView: toView, duration: 0.3, options: UIViewAnimationOptions.TransitionCrossDissolve) { (finished:Bool) in
}
return true
}
}
ce qui suit est mon tentative d’utiliser la forme de code drekka dans la méthode delegate (UITabBarControllerDelegate)
- (BOOL)tabBarController:(UITabBarController *)tabBarController shouldSelectViewController:(UIViewController *)viewController {
NSArray *tabViewControllers = tabBarController.viewControllers;
UIView * fromView = tabBarController.selectedViewController.view;
UIView * toView = viewController.view;
if (fromView == toView)
return false;
NSUInteger fromIndex = [tabViewControllers indexOfObject:tabBarController.selectedViewController];
NSUInteger toIndex = [tabViewControllers indexOfObject:viewController];
[UIView transitionFromView:fromView
toView:toView
duration:0.3
options: toIndex > fromIndex ? UIViewAnimationOptionTransitionFlipFromLeft : UIViewAnimationOptionTransitionFlipFromRight
completion:^(BOOL finished) {
if (finished) {
tabBarController.selectedIndex = toIndex;
}
}];
return true;
}
Ma solution pour iOS7.0 ou supérieure.
Vous pouvez spécifier un contrôleur d'animation personnalisé dans le délégué de la barre d'onglets.
Implémentez un contrôleur d'animation comme ceci:
@interface TabSwitchAnimationController : NSObject <UIViewControllerAnimatedTransitioning>
@end
@implementation TabSwitchAnimationController
- (NSTimeInterval)transitionDuration:(id <UIViewControllerContextTransitioning>)transitionContext
{
return 0.2;
}
- (void)animateTransition:(id <UIViewControllerContextTransitioning>)transitionContext
{
UIViewController* fromVC = [transitionContext viewControllerForKey:UITransitionContextFromViewControllerKey];
UIViewController* toVC = [transitionContext viewControllerForKey:UITransitionContextToViewControllerKey];
UIView* toView = toVC.view;
UIView* fromView = fromVC.view;
UIView* containerView = [transitionContext containerView];
[containerView addSubview:toView];
toView.frame = [transitionContext finalFrameForViewController:toVC];
// Animate by fading
toView.alpha = 0.0;
[UIView animateWithDuration:[self transitionDuration:transitionContext]
delay:0.0
options:UIViewAnimationOptionCurveEaseOut | UIViewAnimationOptionAllowUserInteraction
animations:^{
toView.alpha = 1.0;
}
completion:^(BOOL finished) {
toView.alpha = 1.0;
[fromView removeFromSuperview];
[transitionContext completeTransition:YES];
}];
}
@end
Puis utilisez-le dans votre UITabBarControllerDelegate:
- (id <UIViewControllerAnimatedTransitioning>)tabBarController:(UITabBarController *)tabBarController
animationControllerForTransitionFromViewController:(UIViewController *)fromVC
toViewController:(UIViewController *)toVC
{
return [[TabSwitchAnimationController alloc] init];
}
Au lieu d'utiliser tabBarController:shouldSelectViewController: est préférable d'implémenter tabBarController:animationControllerForTransitionFromViewController:toViewController:
TransitioningObject.Swift
import UIKit
class TransitioningObject: NSObject, UIViewControllerAnimatedTransitioning {
func animateTransition(transitionContext: UIViewControllerContextTransitioning) {
let fromView: UIView = transitionContext.viewForKey(UITransitionContextFromViewKey)!
let toView: UIView = transitionContext.viewForKey(UITransitionContextToViewKey)!
transitionContext.containerView().addSubview(fromView)
transitionContext.containerView().addSubview(toView)
UIView.transitionFromView(fromView, toView: toView, duration: transitionDuration(transitionContext), options: UIViewAnimationOptions.TransitionCrossDissolve) { finished in
transitionContext.completeTransition(true)
}
}
func transitionDuration(transitionContext: UIViewControllerContextTransitioning) -> NSTimeInterval {
return 0.25
}
}
TabBarViewController.Swift
import UIKit
class TabBarViewController: UITabBarController, UITabBarControllerDelegate {
override func viewDidLoad() {
super.viewDidLoad()
self.delegate = self
}
// MARK: - Tabbar delegate
func tabBarController(tabBarController: UITabBarController, animationControllerForTransitionFromViewController fromVC: UIViewController, toViewController toVC: UIViewController) -> UIViewControllerAnimatedTransitioning? {
return TransitioningObject()
}
}
Je pense que vous pouvez facilement réaliser des transitions pour UITabBarControlelr en utilisant CATransition; Cela résoudra également les effets secondaires de l’utilisation de transitionFromView: toView:
Utilisez ceci dans votre classe TabBarController personnalisée étendue à partir de UITabBarController.
- (void)tabBarController:(UITabBarController *)tabBarController didSelectViewController (UIViewController*)viewController {
CATransition *animation = [CATransition animation];
[animation setType:kCATransitionFade];
[animation setDuration:0.25];
[animation setTimingFunction:[CAMediaTimingFunction functionWithName:
kCAMediaTimingFunctionEaseIn]];
[self.view.window.layer addAnimation:animation forKey:@"fadeTransition"];
}
J'espère que cela t'aides :)
J'ai écrit un post après avoir essayé les différentes réponses ici.
Le code est dans Swift, et vous pouvez modifier l'onglet avec animation avec un programme en appelant animateToTab.
func animateToTab(toIndex: Int) {
let tabViewControllers = viewControllers!
let fromView = selectedViewController!.view
let toView = tabViewControllers[toIndex].view
let fromIndex = tabViewControllers.indexOf(selectedViewController!)
guard fromIndex != toIndex else {return}
// Add the toView to the tab bar view
fromView.superview!.addSubview(toView)
// Position toView off screen (to the left/right of fromView)
let screenWidth = UIScreen.mainScreen().bounds.size.width;
let scrollRight = toIndex > fromIndex;
let offset = (scrollRight ? screenWidth : -screenWidth)
toView.center = CGPoint(x: fromView.center.x + offset, y: toView.center.y)
// Disable interaction during animation
view.userInteractionEnabled = false
UIView.animateWithDuration(0.5, delay: 0.0, usingSpringWithDamping: 1, initialSpringVelocity: 0, options: UIViewAnimationOptions.CurveEaseOut, animations: {
// Slide the views by -offset
fromView.center = CGPoint(x: fromView.center.x - offset, y: fromView.center.y);
toView.center = CGPoint(x: toView.center.x - offset, y: toView.center.y);
}, completion: { finished in
// Remove the old view from the tabbar view.
fromView.removeFromSuperview()
self.selectedIndex = toIndex
self.view.userInteractionEnabled = true
})
}
Si vous voulez que tous les changements de tabulation aient une animation, alors raccordez-la à UITabBarControllerDelegate comme ceci:
func tabBarController(tabBarController: UITabBarController, shouldSelectViewController viewController: UIViewController) -> Bool {
let tabViewControllers = tabBarController.viewControllers!
guard let toIndex = tabViewControllers.indexOf(viewController) else {
return false
}
// Our method
animateToTab(toIndex)
return true
}
Ma solution dans Swift:
Créez une classe TabBar personnalisée et définissez-la dans votre TabBar de storyboard
class MainTabBarController: UITabBarController, UITabBarControllerDelegate {
override func viewDidLoad() {
super.viewDidLoad()
self.delegate = self
// Do any additional setup after loading the view.
}
func tabBarController(tabBarController: UITabBarController, shouldSelectViewController viewController: UIViewController) -> Bool {
let tabViewControllers = tabBarController.viewControllers!
let fromView = tabBarController.selectedViewController!.view
let toView = viewController.view
if (fromView == toView) {
return false
}
let fromIndex = tabViewControllers.indexOf(tabBarController.selectedViewController!)
let toIndex = tabViewControllers.indexOf(viewController)
let offScreenRight = CGAffineTransformMakeTranslation(toView.frame.width, 0)
let offScreenLeft = CGAffineTransformMakeTranslation(-toView.frame.width, 0)
// start the toView to the right of the screen
if (toIndex < fromIndex) {
toView.transform = offScreenLeft
fromView.transform = offScreenRight
} else {
toView.transform = offScreenRight
fromView.transform = offScreenLeft
}
fromView.tag = 124
toView.addSubview(fromView)
self.view.userInteractionEnabled = false
UIView.animateWithDuration(0.5, delay: 0.0, usingSpringWithDamping: 1, initialSpringVelocity: 0, options: UIViewAnimationOptions.CurveEaseOut, animations: {
toView.transform = CGAffineTransformIdentity
}, completion: { finished in
let subViews = toView.subviews
for subview in subViews{
if (subview.tag == 124) {
subview.removeFromSuperview()
}
}
tabBarController.selectedIndex = toIndex!
self.view.userInteractionEnabled = true
})
return true
}
}
J'ai utilisé la solution de @ Mofumofu et l'ai mise à niveau vers Swift 1.2. J'ai également implémenté une animation haut/bas. Cela signifie que le nouveau ViewController monte et pousse l'ancien vers le haut si le nouvel index du contrôleur de la vue est supérieur à le vieil est sinon la direction est bas.
class TabScrollPageAnimationController: NSObject, UIViewControllerAnimatedTransitioning {
let tabBarController: UITabBarController
init(tabBarController: UITabBarController) {
self.tabBarController = tabBarController
}
func transitionDuration(transitionContext: UIViewControllerContextTransitioning) -> NSTimeInterval {
return 0.5
}
func animateTransition(transitionContext: UIViewControllerContextTransitioning) {
if let fromVC = transitionContext.viewControllerForKey(UITransitionContextFromViewControllerKey),
let toVC = transitionContext.viewControllerForKey(UITransitionContextToViewControllerKey) {
let fromView = fromVC.view
let toView = toVC.view
let containerView = transitionContext.containerView()
var directionUpwardMultiplier: CGFloat = 1.0
if let vcs = tabBarController.viewControllers as? [UIViewController],
let fIndex = find(vcs, fromVC),
let tIndex = find(vcs, toVC) {
directionUpwardMultiplier = (fIndex < tIndex) ? +1.0 : -1.0
}
containerView.clipsToBounds = false
containerView.addSubview(toView)
var fromViewEndFrame = fromView.frame
fromViewEndFrame.Origin.y -= (containerView.frame.height * directionUpwardMultiplier)
let toViewEndFrame = transitionContext.finalFrameForViewController(toVC)
var toViewStartFrame = toViewEndFrame
toViewStartFrame.Origin.y += (containerView.frame.height * directionUpwardMultiplier)
toView.frame = toViewStartFrame
toView.alpha = 0.0
UIView.animateWithDuration(transitionDuration(transitionContext), delay: 0.0, usingSpringWithDamping: 1.0, initialSpringVelocity: 0.0, options: UIViewAnimationOptions.CurveEaseInOut, animations: { () -> Void in
toView.alpha = 1.0
toView.frame = toViewEndFrame
fromView.alpha = 0.0
fromView.frame = fromViewEndFrame
}, completion: { (completed) -> Void in
toView.alpha = 1.0
fromView.removeFromSuperview()
transitionContext.completeTransition(completed)
containerView.clipsToBounds = true
})
}
}
}
Dans le ViewController du conteneur:
extension XYViewController: UITabBarControllerDelegate {
func tabBarController(tabBarController: UITabBarController, animationControllerForTransitionFromViewController fromVC: UIViewController, toViewController toVC: UIViewController) -> UIViewControllerAnimatedTransitioning? {
return TabScrollPageAnimationController(tabBarController: tabBarController)
}
}
Voici ma solution Swift 3:
Je substitue selectedIndex de mon UITabBarViewController comme ceci:
override var selectedIndex: Int{
get{
return super.selectedIndex
}
set{
animateToTab(toIndex: newValue)
super.selectedIndex = newValue
}
}
Ensuite, j'utilise cette fonction qui imite une animation Push/pop native:
func animateToTab(toIndex: Int) {
guard let tabViewControllers = viewControllers, tabViewControllers.count > toIndex, let fromViewController = selectedViewController, let fromIndex = tabViewControllers.index(of: fromViewController), fromIndex != toIndex else {return}
view.isUserInteractionEnabled = false
let toViewController = tabViewControllers[toIndex]
let Push = toIndex > fromIndex
let bounds = UIScreen.main.bounds
let offScreenCenter = CGPoint(x: fromViewController.view.center.x + bounds.width, y: toViewController.view.center.y)
let partiallyOffCenter = CGPoint(x: fromViewController.view.center.x - bounds.width*0.25, y: fromViewController.view.center.y)
if Push{
fromViewController.view.superview?.addSubview(toViewController.view)
toViewController.view.center = offScreenCenter
}else{
fromViewController.view.superview?.insertSubview(toViewController.view, belowSubview: fromViewController.view)
toViewController.view.center = partiallyOffCenter
}
UIView.animate(withDuration: 0.5, delay: 0, usingSpringWithDamping: 1, initialSpringVelocity: 0, options: .curveEaseIn, animations: {
toViewController.view.center = fromViewController.view.center
fromViewController.view.center = Push ? partiallyOffCenter : offScreenCenter
}, completion: { finished in
fromViewController.view.removeFromSuperview()
self.view.isUserInteractionEnabled = true
})
}
J'espère que ça aide :)
Vous pouvez animer en fonction de l'élément sélectionné - Dans cet exemple, nous basculonsFromLeft si l'index sélectionné est> supérieur à celui de l'index précédemment sélectionné et inversonsFromRight si celui-ci est <inférieur à celui de l'indice précédent. Ceci est Swift 4: implémente la méthode UITabBarControllerDelegate
func tabBarController(_ tabBarController: UITabBarController, shouldSelect viewController: UIViewController) -> Bool {
let fromView: UIView = tabBarController.selectedViewController!.view
let toView: UIView = viewController.view
if fromView == toView {
return false
}
if let tappedIndex = tabBarController.viewControllers?.index(of: viewController) {
if tappedIndex > tabBarController.selectedIndex {
UIView.transition(from: fromView, to: toView, duration: 0.5, options: UIViewAnimationOptions.transitionFlipFromLeft, completion: nil)
} else {
UIView.transition(from: fromView, to: toView, duration: 0.5, options: UIViewAnimationOptions.transitionFlipFromRight, completion: nil)
}
}
return true
}
cela peut être résolu de deux manières
1 - Ecrivez ceci une fois dans votre fichier AppDelegate.m. N'oubliez pas d'inclure UITabBarControllerDelegate en utilisant <> après le signe deux-points (:) dans votre AppDelegate.h
-(void)tabBarController:(UITabBarController *)tabBarControllerThis didSelectViewController:(UIViewController *)viewController
{
[UIView transitionWithView:viewController.view
duration:0.1
options:UIViewAnimationOptionAllowUserInteraction | UIViewAnimationOptionTransitionCrossDissolve
animations:^(void){
} completion:^(BOOL finished){
[UIView beginAnimations:@"animation" context:nil];
[UIView setAnimationDuration:0.7];
[UIView setAnimationBeginsFromCurrentState:YES];
[UIView setAnimationTransition:UIViewAnimationTransitionFlipFromLeft
forView:viewController.view
cache:NO];
[UIView commitAnimations];
}];
}
2 - Ecrivez ceci dans chacun de vos fichiers ViewController.m
-(void)viewWillAppear:(BOOL)animated
{
[UIView transitionWithView:self.view
duration:1.0
options:UIViewAnimationOptionAllowUserInteraction | UIViewAnimationOptionTransitionCrossDissolve
animations:^(void){
[super viewWillAppear:YES];
} completion:^(BOOL finished){
}];
}
espérons que cette aide ...!
un correctif pour l'animation nerveuse ...
UIView * fromView = self.view.superview;
la réponse de Drekka est vraiment géniale. J'ai légèrement modifié la transition de défilement pour que l'animation ressemble davantage à l'animation Push d'Apple. J'ai ajouté une animation supplémentaire à la fin de la première animation pour que cet effet de glissement apparaisse correctement.
// Disable interaction during animation to avoids bugs.
self.tabBarController.view.userInteractionEnabled = NO;
// Get the views.
UIView * fromView = tabBarController.selectedViewController.view;
UIView * toView = [[tabBarController.viewControllers objectAtIndex:controllerIndex] view];
// Get the size of the view area.
CGRect viewSize = fromView.frame;
BOOL scrollRight = controllerIndex > tabBarController.selectedIndex;
// Add the to view to the tab bar view.
[fromView.superview addSubview:toView];
[fromView.superview addSubview:fromView];
self.tabBarController.selectedIndex = 0;
// Position it off screen.
toView.frame = CGRectMake((scrollRight ? (viewSize.size.width *.25) : -(viewSize.size.width * .25 )), viewSize.Origin.y, viewSize.size.width, viewSize.size.height);
[UIView animateWithDuration:0.25
animations: ^{
// Animate the views on and off the screen.
[UIView setAnimationCurve:UIViewAnimationCurveEaseInOut];
fromView.frame = CGRectMake(viewSize.size.width * .95, viewSize.Origin.y, viewSize.size.width, viewSize.size.height);
toView.frame = CGRectMake((viewSize.Origin.x * .90), viewSize.Origin.y, viewSize.size.width, viewSize.size.height);
}
completion:^(BOOL finished) {
if (finished) {
// Being new animation.
[UIView animateWithDuration:0.2
animations: ^{
[UIView setAnimationCurve:UIViewAnimationCurveLinear];
fromView.frame = CGRectMake(viewSize.size.width, viewSize.Origin.y, viewSize.size.width, viewSize.size.height);
toView.frame = CGRectMake((viewSize.Origin.x), viewSize.Origin.y, viewSize.size.width, viewSize.size.height);
}
completion:^(BOOL finished) {
if (finished) {
// Remove the old view from the tabbar view.
[fromView removeFromSuperview];
// Restore interaction.
self.tabBarController.view.userInteractionEnabled = YES;
}
}];
}
}];
réponse de @ samwize mis à jour pour Swift 5:
Si vous voulez que tous les changements d'onglet aient l'animation, utilisez un UITabBarControllerDelegate et implémentez cette méthode:
func tabBarController(_ tabBarController: UITabBarController, shouldSelect viewController: UIViewController) -> Bool {
let tabViewControllers = tabBarController.viewControllers!
guard let toIndex = tabViewControllers.indexOf(value:viewController) else {
return false
}
animateToTab(toIndex: toIndex, fadeOutFromView: false, fadeInToView: false)
return true
}
Modifiez par programmation l'onglet avec animation en appelant animateToTab:
func animateToTab(toIndex: Int, fadeOutFromView: Bool, fadeInToView: Bool) {
let tabViewControllers = viewControllers!
let fromView = selectedViewController!.view
let toView = tabViewControllers[toIndex].view
let fromIndex = tabViewControllers.indexOf(value:selectedViewController!)
guard fromIndex != toIndex else {return}
// Add the toView to the tab bar view
fromView!.superview!.addSubview(toView!)
// Position toView off screen (to the left/right of fromView)
let screenWidth = UIScreen.main.bounds.width
let scrollRight = toIndex > fromIndex!;
let offset = (scrollRight ? screenWidth : -screenWidth)
toView!.center = CGPoint(x: fromView!.center.x + offset, y: toView!.center.y)
// Disable interaction during animation
view.isUserInteractionEnabled = false
if fadeInToView {
toView!.alpha = 0.1
}
UIView.animate(withDuration: 0.5, delay: 0.0, usingSpringWithDamping: 1, initialSpringVelocity: 0, options: [.curveEaseOut], animations: {
if fadeOutFromView {
fromView!.alpha = 0.0
}
if fadeInToView {
toView!.alpha = 1.0
}
// Slide the views by -offset
fromView!.center = CGPoint(x: fromView!.center.x - offset, y: fromView!.center.y);
toView!.center = CGPoint(x: toView!.center.x - offset, y: toView!.center.y);
}, completion: { finished in
// Remove the old view from the tabbar view.
fromView!.removeFromSuperview()
self.selectedIndex = toIndex
self.view.isUserInteractionEnabled = true
})
}
@samwize Réponse traduite en Swift - 2 bravo sur celui-ci, crée un effet de gauche à droite:
func animateToTab(toIndex: Int) {
let tabViewControllers = viewControllers!
let fromView = selectedViewController!.view
let toView = tabViewControllers[toIndex].view
let fromIndex = tabViewControllers.index(of: selectedViewController!)
guard fromIndex != toIndex else {return}
// Add the toView to the tab bar view
fromView?.superview!.addSubview(toView!)
// Position toView off screen (to the left/right of fromView)
let screenWidth = screenSize.width
let scrollRight = toIndex > fromIndex!
let offset = (scrollRight ? screenWidth : -screenWidth)
toView?.center = CGPoint(x: (fromView?.center.x)! + offset, y: (toView?.center.y)!)
// Disable interaction during animation
view.isUserInteractionEnabled = false
UIView.animate(withDuration: 0.5, delay: 0.0, usingSpringWithDamping: 1, initialSpringVelocity: 0, options: UIViewAnimationOptions.curveEaseOut, animations: {
// Slide the views by -offset
fromView?.center = CGPoint(x: (fromView?.center.x)! - offset, y: (fromView?.center.y)!);
toView?.center = CGPoint(x: (toView?.center.x)! - offset, y: (toView?.center.y)!);
}, completion: { finished in
// Remove the old view from the tabbar view.
fromView?.removeFromSuperview()
self.selectedIndex = toIndex
self.view.isUserInteractionEnabled = true
})
}
Je voulais utiliser une transition d'inversion entre deux contrôleurs de vue enfant sur une presse à boutons et l'ai réalisée comme suit:
-(IBAction)flipViewControllers:(id)sender{
NSUInteger index = self.selectedIndex;
index++;
if(index >= self.childViewControllers.count){
index = 0;
}
self.selectedIndex = index;
[UIView beginAnimations:nil context:nil];
[UIView setAnimationDuration:0.75];
[UIView setAnimationTransition:index % 2 ? UIViewAnimationTransitionFlipFromLeft : UIViewAnimationTransitionFlipFromRight
forView:self.view
cache:YES];
[UIView commitAnimations];
}
J'ai également défini la couleur d'arrière-plan sur noir, dans mon cas, c'est ce que j'ai fait en définissant le paramètre navigationController.view.backgroundColor, mais dans votre cas, il peut s'agir du paramètre window.backgroundColor qui peut facilement être défini dans le délégué de l'application.
Voici mon code de travail (pour 3 onglets, je ne l'ai pas essayé depuis plus !!) pour animer les transitions entre les onglets. Il est principalement basé sur la solution de drekka, mais déjà implémenté dans la méthode des délégués de la barre d'onglets, il devrait donc faire l'affaire si vous ne faites que copier/coller .. (on ne sait jamais!)
-(BOOL)tabBarController:(UITabBarController *)tabBarController shouldSelectViewController:(UIViewController *)viewController {
// Important! We validate that the selected tab is not the current tab, to avoid misplacing views
if (tabBarController.selectedViewController == viewController) {
return NO;
}
// Find the selected view's index
NSUInteger controllerIndex = 0;
for (UIViewController *vc in tabBarController.viewControllers) {
if (vc == viewController) {
controllerIndex = [tabBarController.viewControllers indexOfObject:vc];
}
}
CGFloat screenWidth = SCREEN_SIZE.width;
// Note: We must invert the views according to the direction of the scrolling ( FROM Left TO right or FROM right TO left )
UIView * fromView = tabBarController.selectedViewController.view;
UIView * toView = viewController.view;
[fromView.superview addSubview:toView];
CGRect fromViewInitialFrame = fromView.frame;
CGRect fromViewNewframe = fromView.frame;
CGRect toViewInitialFrame = toView.frame;
if ( controllerIndex > tabBarController.selectedIndex ) {
// FROM left TO right ( tab0 to tab1 or tab2 )
// The final frame for the current view. It will be displaced to the left
fromViewNewframe.Origin.x = -screenWidth;
// The initial frame for the new view. It will be displaced to the left
toViewInitialFrame.Origin.x = screenWidth;
toView.frame = toViewInitialFrame;
} else {
// FROM right TO left ( tab2 to tab1 or tab0 )
// The final frame for the current view. It will be displaced to the right
fromViewNewframe.Origin.x = screenWidth;
// The initial frame for the new view. It will be displaced to the right
toViewInitialFrame.Origin.x = -screenWidth;
toView.frame = toViewInitialFrame;
}
[UIView animateWithDuration:0.2 animations:^{
// The new view will be placed where the initial view was placed
toView.frame = fromViewInitialFrame;
// The initial view will be place outside the screen bounds
fromView.frame = fromViewNewframe;
tabBarController.selectedIndex = controllerIndex;
// To prevent user interaction during the animation
[[UIApplication sharedApplication] beginIgnoringInteractionEvents];
} completion:^(BOOL finished) {
// Before removing the initial view, we adjust its frame to avoid visual lags
fromView.frame = CGRectMake(0, 0, fromView.frame.size.width, fromView.frame.size.height);
[fromView removeFromSuperview];
[[UIApplication sharedApplication] endIgnoringInteractionEvents];
}];
return NO;
}
Cela fonctionne pour moi dans Swift 3:
func tabBarController(_ tabBarController: UITabBarController, shouldSelect viewController: UIViewController) -> Bool {
if let fromView = tabBarController.selectedViewController?.view, let toView = viewController.view {
if fromView == toView {
return false
}
UIView.transition(from: fromView, to: toView, duration: 0.2, options: .transitionCrossDissolve) { (finished) in
}
}
return true
}