我們一般的項(xiàng)目都會使用到導(dǎo)航欄王凑，那么要滿足我們的各種需求购裙，最好搞一個(gè)自定義的導(dǎo)航欄栈拖，下面我們先自定義一個(gè)導(dǎo)航欄
Snip20161101_5.png
![Uploading Snip20161101_6_104250.png . . .]
導(dǎo)航欄顏色
//設(shè)置導(dǎo)航欄統(tǒng)一標(biāo)題樣式
[self.navigationBar setBarTintColor:[UIColor redColor]];
效果圖
first.gif
統(tǒng)一導(dǎo)航欄左右UIBarButtonItem顏色
//統(tǒng)一設(shè)置左右兩邊按鈕顏色為白色
self.navigationBar.tintColor = [UIColor whiteColor];
效果圖
second.gif
修改backBarButtonItem文字的顏色以及文字
-(void)pushViewController:(UIViewController *)viewController animated:(BOOL)animated
{
//單獨(dú)設(shè)置文字為白色
UIBarButtonItem *backItem = [[UIBarButtonItem alloc] initWithTitle:@"返回" style:UIBarButtonItemStylePlain target:nil action:nil];
[backItem setTitleTextAttributes:@{NSForegroundColorAttributeName:[UIColor whiteColor]} forState:UIControlStateNormal];
viewController.navigationItem.backBarButtonItem = backItem;
[super pushViewController:viewController animated:animated];
}
統(tǒng)一設(shè)置titleView的文字顏色
//設(shè)置titleView的文字和顏色
self.navigationBar.titleTextAttributes = @{NSForegroundColorAttributeName: [UIColor orangeColor]};
效果圖
five.gif
統(tǒng)一設(shè)置所有頁面的backBarButtonItem返回按鈕
- (void)pushViewController:(UIViewController *)viewController animated:(BOOL)animated
{
if (self.childViewControllers.count > 0) { // 如果viewController不是最早push進(jìn)來的子控制器
// 左上角
UIButton *backButton = [UIButton buttonWithType:UIButtonTypeCustom];
[backButton setImage:[UIImage imageNamed:@"navigationButtonReturn"] forState:UIControlStateNormal];
[backButton setImage:[UIImage imageNamed:@"navigationButtonReturnClick"] forState:UIControlStateHighlighted];
[backButton setTitle:@"返回" forState:UIControlStateNormal];
[backButton setTitleColor:[UIColor blackColor] forState:UIControlStateNormal];
[backButton setTitleColor:[UIColor redColor] forState:UIControlStateHighlighted];
[backButton sizeToFit];
[backButton addTarget:self action:@selector(back) forControlEvents:UIControlEventTouchUpInside];
viewController.navigationItem.leftBarButtonItem = [[UIBarButtonItem alloc] initWithCustomView:backButton];
}
// 所有設(shè)置搞定后, 再push控制器
[super pushViewController:viewController animated:animated];
}
- (void)back
{
[self popViewControllerAnimated:YES];
}
效果圖
three.gif
某個(gè)頁面不需要導(dǎo)航欄則在該頁面重寫以下兩個(gè)方法
- (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];
}
效果圖
four.gif
自定義導(dǎo)航欄右側(cè)的控件
這個(gè)我寫了個(gè)UIView的類擴(kuò)展启盛，當(dāng)然我也給導(dǎo)航欄左右自定義寫了個(gè)分類哥牍，之前的文章有教大家怎么寫那個(gè)類擴(kuò)展设江。
UIButton *btn = [[UIButton alloc] init];
[btn setImage:[UIImage imageNamed:@"更多"] forState:UIControlStateNormal];
[btn setImage:[UIImage imageNamed:@"更多"] forState:UIControlStateHighlighted];
[btn addTarget:self action:@selector(moreclick) forControlEvents:UIControlEventTouchUpInside];
btn.Ssr_size = btn.currentImage.size;
self.navigationItem.rightBarButtonItem = [[UIBarButtonItem alloc] initWithCustomView:btn];
效果圖：
six.gif
titileView
UIImageView *imageview = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"3步--2"]];
self.navigationItem.titleView = imageview;
效果圖
Snip20161101_8.png
調(diào)整按鈕位置
我們可以看到，上面的按鈕是有點(diǎn)偏右的，那如果我們想調(diào)整按鈕的位置該怎么做呢株依？設(shè)置Frame顯然是行不通的，因?yàn)閷?dǎo)航欄的NavigationItem是個(gè)比較特殊的View延窜，我們無法通過簡單的調(diào)整Frame來的調(diào)整左右按鈕的位置恋腕。但是在蘋果提供的UIButtonBarItem 中有個(gè)叫做UIBarButtonSystemItemFixedSpace的控件，利用它需曾，我們就可以輕松調(diào)整返回按鈕的位置吗坚。具體使用方法如下
//創(chuàng)建返回按鈕
UIButton * leftBtn = [UIButton buttonWithType:UIButtonTypeSystem];
leftBtn.frame = CGRectMake(0, 0, 25,25);
[leftBtn setBackgroundImage:[UIImage imageNamed:@"navigationButtonReturn"] forState:UIControlStateNormal];
[leftBtn addTarget:self action:@selector(leftBarBtnClicked:) forControlEvents:UIControlEventTouchUpInside];
UIBarButtonItem * leftBarBtn = [[UIBarButtonItem alloc]initWithCustomView:leftBtn];;
//創(chuàng)建UIBarButtonSystemItemFixedSpace
UIBarButtonItem * spaceItem = [[UIBarButtonItem alloc]initWithBarButtonSystemItem:UIBarButtonSystemItemFixedSpace target:nil action:nil];
//將寬度設(shè)為負(fù)值
spaceItem.width = -15;
//將兩個(gè)BarButtonItem都返回給NavigationItem
self.navigationItem.leftBarButtonItems = @[spaceItem,leftBarBtn];
效果圖
Snip20161101_9.png
如果我們修改了系統(tǒng)默認(rèn)返回按鈕，那么它默認(rèn)在邊緣滑動(dòng)可以滑回到上一個(gè)頁面這個(gè)功能就失效了呆万，所以我們在剛才那個(gè)自定義的導(dǎo)航欄控制器里面商源，要遵循<UIGestureRecognizerDelegate>這個(gè)代理
然后實(shí)現(xiàn)方法
self.interactivePopGestureRecognizer.delegate = self;
#pragma mark - <UIGestureRecognizerDelegate>
/**
* 手勢識別器對象會調(diào)用這個(gè)代理方法來決定手勢是否有效
*
* @return YES : 手勢有效, NO : 手勢無效
*/
- (BOOL)gestureRecognizerShouldBegin:(UIGestureRecognizer *)gestureRecognizer
{
// 手勢何時(shí)有效 : 當(dāng)導(dǎo)航控制器的子控制器個(gè)數(shù) > 1就有效
return self.childViewControllers.count > 1;
}
效果圖
seven.gif
中間滑動(dòng)時(shí)候，也讓返回到上一個(gè)頁面
這個(gè)我是在github上找到一個(gè)Dome 只需要把里面的
UINavigationController+FDFullscreenPopGesture.h
UINavigationController+FDFullscreenPopGesture.m
這兩個(gè)文件拖入到你的工程就行了谋减。
https://github.com/forkingdog/FDFullscreenPopGesture
效果如下
nigghtyg.gif
但是如果你在某個(gè)頁面需要隱藏導(dǎo)航欄牡彻，但是不影響效果和其他頁面。則在改控制器寫下如下代碼 其實(shí)就是之前介紹的隱藏某個(gè)頁面的導(dǎo)航欄
- (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];
}
效果
nigghty.gif
轉(zhuǎn)場動(dòng)畫
push到下一個(gè)頁面
NextViewController *vc = [[NextViewController alloc] init];
[self.navigationController pushViewController:vc animated:YES];
// 添加轉(zhuǎn)場動(dòng)畫
CATransition *transition = [CATransition animation];
transition.type = @"cube";
transition.subtype = kCATransitionFromRight;
transition.duration = 1.0;
// 如果將view添加到導(dǎo)航的view上出爹，會被顯示在最上層
[self.navigationController.view.layer addAnimation:transition forKey:nil];
pop回上一個(gè)頁面
CATransition *transition = [CATransition animation];
transition.type = @"cameraIrisHollowClose";
transition.duration = 1.0;
[self.navigationController.view.layer addAnimation:transition forKey:nil];
[self.navigationController popViewControllerAnimated:YES];
效果圖
nigf.gif
CATransition中動(dòng)畫type的值：
官方提供的四種動(dòng)畫效果
fade = 1, //淡入淡出
push, //推擠
reveal, //揭開
moveIn, //覆蓋
私有動(dòng)畫是在UIView的基礎(chǔ)上庄吼，設(shè)置animation.type
cube, //立方體
suckEffect, //吮吸
oglFlip, //翻轉(zhuǎn)
rippleEffect, //波紋
pageCurl, //翻頁
pageUnCurl, //反翻頁
cameraIrisHollowOpen, //開鏡頭
cameraIrisHollowClose, //關(guān)鏡頭
上面導(dǎo)航欄隨著滑動(dòng)就隱藏的方法。
- (void)scrollViewDidScroll:(UIScrollView *)scrollView
{
CGFloat offsetY = scrollView.contentOffset.y + _tableView.contentInset.top;
CGFloat panTranslationY = [scrollView.panGestureRecognizer translationInView:self.tableView].y;
if (offsetY > 64) {
if (panTranslationY > 0)
{
//下滑趨勢严就，顯示
[self.navigationController setNavigationBarHidden:NO animated:YES];
} else {
//上滑趨勢总寻，隱藏
[self.navigationController setNavigationBarHidden:YES animated:YES];
}
} else {
[self.navigationController setNavigationBarHidden:NO animated:YES];
}
}
備注：
如果有不足或者錯(cuò)誤的地方還望各位讀者批評指正，可以評論留言梢为，筆者收到后第一時(shí)間回復(fù)渐行。
QQ/微信：2366889552 /lan2018yingwei轰坊。
簡書號：凡塵一笑：[簡書]
http://www.reibang.com/users/0158007b8d17/latest_articles
感謝各位觀眾老爺?shù)拈喿x，如果覺得筆者寫的還湊合祟印，可以關(guān)注或收藏一下肴沫，不定期分享一些好玩的實(shí)用的demo給大家。
文／凡塵一笑（簡書作者）
原文鏈接： http://www.reibang.com/p/8ae080edb3ea
著作權(quán)歸作者所有蕴忆，轉(zhuǎn)載請聯(lián)系作者獲得授權(quán)颤芬，并標(biāo)注“簡書作者”。
