Tip
今天我要給大家分享一個(gè)關(guān)于在實(shí)際開(kāi)發(fā)中對(duì)NavBar的顯示和隱藏處理：
首先我們來(lái)看一下效果圖：
像這種效果我們?cè)诤芏嗟?APP 中都可以見(jiàn)到放闺，尤其是在個(gè)人中心的模塊當(dāng)中耗式，接下來(lái)我就來(lái)講解一下具體是如何實(shí)現(xiàn)的：
實(shí)現(xiàn)思路
給 NavBar 的背景顏色設(shè)置成透明色谨设，來(lái)后把底部的這條分割線去掉掠廓，接著自已寫(xiě)一個(gè) VIew 放到上面婆瓜，最后監(jiān)聽(tīng)滾動(dòng)
具體步驟
第一步：
項(xiàng)目的基本搭建,如下圖這樣啄糙，這沒(méi)什么好說(shuō)的放刨， so easy...
設(shè)置背景顏色設(shè)置成透明色：
/** 1.0 給 nav 設(shè)置透明顏色的背景圖片 */
[self.navigationController.navigationBar setBackgroundImage:[self createImageWithColor:[UIColor clearColor]] forBarMetrics:UIBarMetricsDefault];
- (UIImage *)createImageWithColor:(UIColor *)color {
CGRect rect = CGRectMake(0.0f, 0.0f, 1.0f, 1.0f);
UIGraphicsBeginImageContext(rect.size);
CGContextRef context = UIGraphicsGetCurrentContext();
CGContextSetFillColorWithColor(context, [color CGColor]);
CGContextFillRect(context, rect);
UIImage *theImage = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
return theImage;
}
效果如下：
第二步：去掉底部這條分割線
/** 2.0 去掉底部的那條分割線 */
self.navigationController.navigationBar.shadowImage = [UIImage new];
效果如下：
第三步：自定義 view 放到上面去
/** 3.0 添加一個(gè)自定義的 view */
UIView *navView = [[UIView alloc] init];
[self.view addSubview:navView];
navView.frame = CGRectMake(0, 0, [UIScreen mainScreen].bounds.size.width, 64);
navView.backgroundColor = [UIColor orangeColor];
self.navView = navView;
效果如下：
第四步：監(jiān)聽(tīng)滾動(dòng) scrollview 的代理方法
- (void)scrollViewDidScroll:(UIScrollView *)scrollView
{
CGFloat offsetY = scrollView.contentOffset.y;
if (offsetY > 0 ) {
self.navView.alpha = 1;
self.navigationItem.title = @"zwl";
} else {
self.navView.alpha = 0;
self.navigationItem.title = @"";
}
}
到了這里工秩，就大功告成了，其實(shí)只要搞清楚實(shí)現(xiàn)思路就一點(diǎn)都不難进统。助币。。
自已曾爬過(guò)的坑
一開(kāi)始在接到這個(gè)需求的時(shí)候沒(méi)有想到這種實(shí)現(xiàn)方案螟碎，而是直接對(duì) NavBar 設(shè)置背景色或是 hidden 屬性來(lái)控制眉菱，這樣一來(lái)的話當(dāng)你跳轉(zhuǎn)到二級(jí)界面或是從二級(jí)界面再跳轉(zhuǎn)回來(lái)會(huì)有很多問(wèn)題。掉分。俭缓。。酥郭。而當(dāng)采取上面這種方案時(shí)所有的問(wèn)題都迎刃而解了华坦。。不从。
