iOS 爱奇艺客户端多个tabbar的几种技术实现

本文将讲解实现类似爱奇艺iOS客户端泡泡UI的几种实现以及几种实现可能出现的坑。

爱奇艺iOS客户端首页底部有5个按钮UITabBar实现，最右边一个是泡泡按钮，点击泡泡按钮将会push到一个带有UITabBar的界面(第一次见到这种设计)。

截止本文发表时爱奇艺iOS客户端版本为V9.10.0，已经改了泡泡界面，不再是push到一个带有UITabBar的界面。

前置条件

1、实现UITabBarControllerDelegate

@interface IQIYITabBarController ()<UITabBarControllerDelegate>

@end

@implementation IQIYITabBarController

- (void)viewDidLoad {
    [super viewDidLoad];
    // Do any additional setup after loading the view.
    self.delegate = self;
    
}

@end

2、实现 -tabBarController:shouldSelectViewController:方法

- (BOOL)tabBarController:(UITabBarController *)tabBarController shouldSelectViewController:(UIViewController *)viewController{
    
}

第一种实现 使用模态视图

使用模态视图并修改模态视图的弹出动画为push的形式

- (BOOL)tabBarController:(UITabBarController *)tabBarController shouldSelectViewController:(UIViewController *)viewController {
    
    //4是泡泡页面
    if ([viewController isEqual:[tabBarController.viewControllers objectAtIndex:4]]) {
        
        SecondTabBarController * vc = [[SecondTabBarController alloc] init];
        
        CATransition * ansition = [CATransition animation];
        [ansition setDuration:0.25f];
        [ansition setType:kCATransitionMoveIn];
        [ansition setSubtype:kCATransitionFromRight];
        [[UIApplication sharedApplication].keyWindow.layer addAnimation:ansition forKey:nil];
        [self presentViewController:vc animated:NO completion:nil];
        
        return NO;
    }
    
    return YES;
}

模态视图的返回

详情见文末的demo

- (void)viewDidLoad {
    [super viewDidLoad];
    // Do any additional setup after loading the view.
    
    self.view.backgroundColor = [UIColor groupTableViewBackgroundColor];
    
    UIBarButtonItem * leftBarButtonItem = [[UIBarButtonItem alloc] initWithTitle:@"返回" style:(UIBarButtonItemStyleDone) target:self action:@selector(back)];
    
    self.navigationItem.leftBarButtonItem = leftBarButtonItem;
}

- (void)back {
    
        CATransition * ansition = [CATransition animation];
        [ansition setDuration:0.25f];
        [ansition setType:kCATransitionMoveIn];
        [ansition setSubtype:kCATransitionFromLeft];
        [[UIApplication sharedApplication].keyWindow.layer addAnimation:ansition forKey:nil];
        [self dismissViewControllerAnimated:NO completion:nil];
}

效果如下图(gif图，如果不会动请刷新)

弊端

gif图可能看的不是很清楚。

弊端就是在push 或者 pop动画执行时会看到黑影闪过，如果要求不高的可以使用这个。

为了解决这个问题，我们引出第二种实现方案

第二种实现 使用UINavigationController push的形式

导航栏push的方式

还是先实现前置条件里的代码

接着实现以下代码

- (BOOL)tabBarController:(UITabBarController *)tabBarController shouldSelectViewController:(UIViewController *)viewController {
    
    //4是泡泡页面
    if ([viewController isEqual:[tabBarController.viewControllers objectAtIndex:4]]) {
        
        SecondTabBarController * vc = [[SecondTabBarController alloc] init];
        vc.hidesBottomBarWhenPushed = YES;
        
        
        UINavigationController * nav = tabBarController.viewControllers[tabBarController.selectedIndex];
        [nav pushViewController:vc animated:YES];
        
        return NO;
    }
    
    return YES;
}

注意事项

要在第二个TabBar里隐藏掉最外层的导航栏，否则将可能出现2个导航栏的效果

- (void)viewWillAppear:(BOOL)animated {
    [super viewWillAppear:animated];
    
    [self.navigationController setNavigationBarHidden:YES animated:animated];
}

- (void)viewWillDisappear:(BOOL)animated {
    [super viewWillDisappear:animated];
    
    [self.navigationController setNavigationBarHidden:NO animated:animated];
}

一定要使用-setNavigationBarHidden:animated:这个方法来显示隐藏导航栏，并且动画效果不要写YES或者NO要用animated，否则将会出现导航栏黑边闪一下或者手势时出现黑边的情况。