項目中有一個需求，在滑動列表中上拉隱藏導航欄與tabBar，下拉顯示導航欄與tabBar的功能 ，開發中也踩了一些小坑，所以空閑時間我把這個功能點抽取出來供有需要的開發者參考，有不足之處請指出，謝謝。
參考文章：鎮屌要逆襲的文章? http://www.lxweimin.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一個吧。如要轉載，請求標明出處，謝謝。
