在開發(fā)的過(guò)程中我們經(jīng)常會(huì)實(shí)現(xiàn)這樣的功能，在導(dǎo)航條下有個(gè)UISegmentControl翘单，用于切換不同視圖吨枉，像下面這樣：
但是這種效果并不是非常好看，因?yàn)閷?dǎo)航+ UISegmentControl+底部切換的視圖哄芜，整個(gè)界面就被分割成了多個(gè)部分东羹，不夠美觀。
細(xì)心的童鞋會(huì)發(fā)現(xiàn)App Store排行榜頁(yè)面也是有UISegmentControl切換的忠烛，但是UISegmentControl和導(dǎo)航條卻像是一體的。
于是我想實(shí)現(xiàn)這樣的效果权逗。
我在網(wǎng)上查了一下資料美尸，實(shí)現(xiàn)了類似的效果，思路如下：
1.隱藏導(dǎo)航條底部的細(xì)線斟薇；
2.在導(dǎo)航條底部添加一個(gè)toolbar师坎，toolbar中放上UISegmentControl
隱藏細(xì)線的方法如下：
先在導(dǎo)航條的子視圖中找到這條細(xì)線，然后在進(jìn)入當(dāng)前頁(yè)面時(shí)隱藏堪滨，離開當(dāng)前頁(yè)面時(shí)顯示胯陋。代碼如下：
//查找導(dǎo)航條底部細(xì)線
- (UIImageView *)findHairlineImageViewUnder:(UIView *)view
{
if ([view isKindOfClass:UIImageView.class] && view.bounds.size.height <= 1.0)
{
return (UIImageView *)view;
}
for (UIView *subview in view.subviews)
{
UIImageView *imageView = [self findHairlineImageViewUnder:subview];
if (imageView)
{
return imageView;
}
}
return nil;
}
在viewDidLoad方法中調(diào)用上面的方法，獲得細(xì)線
self.navHairline = [self findHairlineImageViewUnder:self.navigationController.navigationBar];
最后分別在viewWillAppear和viewWillDisappear中控制細(xì)線的顯示與隱藏：
- (void)viewWillAppear:(BOOL)animated {
[super viewWillAppear:animated];
self.navHairline.hidden = YES;
}
- (void)viewWillDisappear:(BOOL)animated {
[super viewWillDisappear:animated];
self.navHairline.hidden = NO;
}
然后在導(dǎo)航條底部加上UIToolbar.
效果如下：
是不是發(fā)現(xiàn)有點(diǎn)問(wèn)題袱箱，toolbar底部和UITableview的sectionHeader之間沒(méi)有區(qū)分遏乔，解決方式如下：
實(shí)現(xiàn)UIToolbar的如下代理方法即可：
#pragma mark - UIToolbarDelegate
- (UIBarPosition)positionForBar:(id<UIBarPositioning>)bar
{
return UIBarPositionTopAttached;
}
效果如下：
網(wǎng)上對(duì)于隱藏細(xì)線還有些其它方法，比如把細(xì)線設(shè)置為透明发笔，但是這種方法使用的時(shí)候同時(shí)還要設(shè)置導(dǎo)航背景和透明度設(shè)置為NO盟萨，這就有可能會(huì)影響需求，比如需要表格滾動(dòng)時(shí)導(dǎo)航底部半透明了讨。所以采用上面提到的隱藏細(xì)線方式比較好捻激，不會(huì)干擾其它設(shè)置制轰。
另外提供一個(gè)apple官方提供關(guān)于導(dǎo)航條外觀設(shè)置的demo：點(diǎn)擊跳轉(zhuǎn)。
參考：隱藏細(xì)線胞谭、仿app store排行榜導(dǎo)航條思路
end垃杖。??have fun~
