iOS上下拉隐藏与显示导航栏与tabBar
项目中有一个需求，在滑动列表中上拉隐藏导航栏与tabBar，下拉显示导航栏与tabBar的功能 ，开发中也踩了一些小坑，所以空闲时间我把这个功能点抽取出来供有需要的开发者参考，有不足之处请指出，谢谢。
参考文章：镇屌要逆袭的文章 http://www.jianshu.com/p/40fa40c65124
先看一下效果图：
做法不难,导航栏只要设置setNavigationBarHidden显示与隐藏就能达到想要的效果，而tabBar则需要改变frame来达到想要的效果。
直接上代码，看demo:
先在AppDelegate中创建UITabBarController与UINavigationController
- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {
// Override point for customization after application launch.
self.window = [[UIWindow alloc]initWithFrame:[UIScreen mainScreen].bounds];
self.window.rootViewController = self.tabBar;
[self.window makeKeyAndVisible];
return YES;
}
/*
* 创建控制器
*/
- (void)setupVC{
MYNavTabBarDemoVC *vc = [MYNavTabBarDemoVC new];
UITabBarItem *tabBarItem = [[UITabBarItem alloc] initWithTitle:@"首页" image:[UIImage imageNamed:@"home"] tag:0];
[tabBarItem setTitleTextAttributes:@{NSForegroundColorAttributeName: [UIColor blackColor]} forState:UIControlStateNormal];
[tabBarItem setTitleTextAttributes:@{NSForegroundColorAttributeName: [UIColor blackColor]} forState:UIControlStateSelected];
vc.tabBarItem = tabBarItem;
UINavigationController *nav = [[UINavigationController alloc]initWithRootViewController:vc];
self.tabBar = [UITabBarController new];
self.tabBar.viewControllers = @[nav];
}
主要代码在滑动的控制器中，下面看几个重要的方法设置。
1.要设置两个重要的属性 extendedLayoutIncludesOpaqueBars 与 edgesForExtendedLayout
- (void)viewWillAppear:(BOOL)animated{
[super viewWillAppear:animated];
self.extendedLayoutIncludesOpaqueBars = NO;
self.edgesForExtendedLayout = UIRectEdgeNone;
}
2.在scrollViewWillEndDragging代理中实现显示与隐藏导航栏与tabBar
#pragma mark 滑动隐藏导航栏与tabBar
-(void)scrollViewWillEndDragging:(UIScrollView *)scrollView withVelocity:(CGPoint)velocity targetContentOffset:(inout CGPoint *)targetContentOffset{
if(velocity.y>0){
[self.navigationController setNavigationBarHidden:YES animated:YES];
[self setTabBarHidden:YES];
}else{
[self.navigationController setNavigationBarHidden:NO animated:YES];
[self setTabBarHidden:NO];
}
}
/*
* 隐藏显示tabbar
*/
- (void)setTabBarHidden:(BOOL)hidden
{
UIView *tab = self.tabBarController.view;
tab.backgroundColor = [UIColor clearColor];
CGRect tabRect=self.tabBarController.tabBar.frame;
if ([tab.subviews count] < 2) {
return;
}
UIView *view;
if ([[tab.subviews objectAtIndex:0] isKindOfClass:[UITabBar class]]) {
view = [tab.subviews objectAtIndex:1];
} else {
view = [tab.subviews objectAtIndex:0];
}
view.backgroundColor = [UIColor clearColor];
if (hidden) {
view.frame = tab.bounds;
tabRect.origin.y=[[UIScreen mainScreen] bounds].size.height+self.tabBarController.tabBar.frame.size.height;
self.myTableView.frame = [UIScreen mainScreen].bounds;
[tab bringSubviewToFront:view];
[view sendSubviewToBack:self.tabBarController.tabBar];
[UITabBar appearance].translucent = YES;
} else {
view.frame = CGRectMake(tab.bounds.origin.x, tab.bounds.origin.y, tab.bounds.size.width, tab.bounds.size.height);
tabRect.origin.y=[[UIScreen mainScreen] bounds].size.height-self.tabBarController.tabBar.frame.size.height;
self.myTableView.frame = view.frame;
[tab bringSubviewToFront:self.tabBarController.tabBar];
[self.tabBarController.tabBar sendSubviewToBack:view];
[UITabBar appearance].translucent = NO;
}
[UIView animateWithDuration:0.5f animations:^{
self.tabBarController.tabBar.frame=tabRect;
}completion:^(BOOL finished) {
}];
}
到此，项目想要的上下拉隐藏与显示导航栏与tabBar的功能就实现了。以上只是我个人的实现方法，如果你有更好做法，欢迎骚扰交流。觉得有帮助，请start一个吧。如要转载，请求标明出处，谢谢。
