之前我在使用導(dǎo)航欄的時候都是深度定制的,具體就是把系統(tǒng)的導(dǎo)航欄給隱藏掉,然后自己做一個view放到導(dǎo)航欄的位置,根據(jù)自己的需要直接往view上添加各種需要用到的控件,導(dǎo)致對系統(tǒng)自帶的導(dǎo)航欄不是很清楚,今天特意研究了一下,記錄之。
-
設(shè)置導(dǎo)航欄背景
如果項目中所有的導(dǎo)航欄的背景都是一樣的,可以在APPDelegate里面如下設(shè)置:
//設(shè)定導(dǎo)航欄的背景色
[[UINavigationBar appearance] setBarTintColor:[UIColor redColor]];
//設(shè)定導(dǎo)航欄的背景圖片,以下兩個方法均的效果是一樣的
[[UINavigationBar appearance] setBarTintColor:[UIColor colorWithPatternImage:[UIImage imageNamed:@"navgationBar"]]];
[[UINavigationBar appearance] setBackgroundImage:[UIImage imageNamed:@"navgationBar"] forBarMetrics:UIBarMetricsDefault];
//設(shè)定導(dǎo)航欄按鈕的顏色(返回按鈕等等,但不包含標(biāo)題)
[[UINavigationBar appearance] setTintColor:[UIColor blackColor]];
這樣設(shè)置完成后,就把bar的背景色和按鈕的顏色統(tǒng)一完成了,在項目中所有的bar的背景都是一樣的了,需要注意的地方就是這些方法的調(diào)用要在navigationBar出現(xiàn)之前,一般在APPDelegate里面,否則該方法不會起作用。
那么如果有這樣一個需要,某個界面的導(dǎo)航欄和別的都不一樣,這個時候我們可以在那個界面做如下操作:
//設(shè)置背景色,如果需要的是圖片的話也可以設(shè)置成圖片
self.navigationController.navigationBar.barTintColor = [UIColor greenColor];
//設(shè)置按鈕標(biāo)題的顏色
self.navigationController.navigationBar.tintColor = [UIColor grayColor];
注意:這樣設(shè)置后也是全局生效的,如果我們需要在某個單獨(dú)的界面需要這種效果,而其他界面不需要,那么我們可以在該界面的viewWillAppear和viewWillDisappear中進(jìn)行相應(yīng)的設(shè)置:
//在這里設(shè)置成該界面需要的效果
-(void)viewWillAppear:(BOOL)animated{
self.navigationController.navigationBar.tintColor = [UIColor grayColor];
self.navigationController.navigationBar.barTintColor = [UIColor greenColor];
}
//在這里還原之前的設(shè)置
-(void)viewWillDisappear:(BOOL)animated{
self.navigationController.navigationBar.tintColor = [UIColor blackColor];
self.navigationController.navigationBar.barTintColor = [UIColor redColor];
}
那么效果就是,剛進(jìn)入:
push后的界面:
而pop回來后還是原來的背景,這樣就實(shí)現(xiàn)了對單獨(dú)界面的定制。
-
設(shè)置標(biāo)題
標(biāo)題設(shè)置都是在相應(yīng)的controller中,一下三種方法任選其一即可
self.title=@"首頁";
self.navigationItem.title = @"首頁";
self.navigationItem.titleView = [自定義view及其子類(label、segment等)];
既然是標(biāo)題,那肯定就有字體的大小、顏色等屬性,可以通過attribute屬性來進(jìn)行相應(yīng)的設(shè)置:
self.navigationController.navigationBar.titleTextAttributes = @{NSForegroundColorAttributeName:[UIColor whiteColor],NSFontAttributeName:[UIFont systemFontOfSize:21]};
這里只是設(shè)置了字體大小、顏色,還有很多可以設(shè)置的屬性,有興趣的可以試一下:
UIKIT_EXTERN NSString * const NSFontAttributeName NS_AVAILABLE(10_0, 6_0); // UIFont, default Helvetica(Neue) 12
UIKIT_EXTERN NSString * const NSParagraphStyleAttributeName NS_AVAILABLE(10_0, 6_0); // NSParagraphStyle, default defaultParagraphStyle
UIKIT_EXTERN NSString * const NSForegroundColorAttributeName NS_AVAILABLE(10_0, 6_0); // UIColor, default blackColor
UIKIT_EXTERN NSString * const NSBackgroundColorAttributeName NS_AVAILABLE(10_0, 6_0); // UIColor, default nil: no background
UIKIT_EXTERN NSString * const NSLigatureAttributeName NS_AVAILABLE(10_0, 6_0); // NSNumber containing integer, default 1: default ligatures, 0: no ligatures
UIKIT_EXTERN NSString * const NSKernAttributeName NS_AVAILABLE(10_0, 6_0); // NSNumber containing floating point value, in points; amount to modify default kerning. 0 means kerning is disabled.
UIKIT_EXTERN NSString * const NSStrikethroughStyleAttributeName NS_AVAILABLE(10_0, 6_0); // NSNumber containing integer, default 0: no strikethrough
UIKIT_EXTERN NSString * const NSUnderlineStyleAttributeName NS_AVAILABLE(10_0, 6_0); // NSNumber containing integer, default 0: no underline
UIKIT_EXTERN NSString * const NSStrokeColorAttributeName NS_AVAILABLE(10_0, 6_0); // UIColor, default nil: same as foreground color
UIKIT_EXTERN NSString * const NSStrokeWidthAttributeName NS_AVAILABLE(10_0, 6_0); // NSNumber containing floating point value, in percent of font point size, default 0: no stroke; positive for stroke alone, negative for stroke and fill (a typical value for outlined text would be 3.0)
UIKIT_EXTERN NSString * const NSShadowAttributeName NS_AVAILABLE(10_0, 6_0); // NSShadow, default nil: no shadow
UIKIT_EXTERN NSString *const NSTextEffectAttributeName NS_AVAILABLE(10_10, 7_0); // NSString, default nil: no text effect
UIKIT_EXTERN NSString * const NSAttachmentAttributeName NS_AVAILABLE(10_0, 7_0); // NSTextAttachment, default nil
UIKIT_EXTERN NSString * const NSLinkAttributeName NS_AVAILABLE(10_0, 7_0); // NSURL (preferred) or NSString
UIKIT_EXTERN NSString * const NSBaselineOffsetAttributeName NS_AVAILABLE(10_0, 7_0); // NSNumber containing floating point value, in points; offset from baseline, default 0
UIKIT_EXTERN NSString * const NSUnderlineColorAttributeName NS_AVAILABLE(10_0, 7_0); // UIColor, default nil: same as foreground color
UIKIT_EXTERN NSString * const NSStrikethroughColorAttributeName NS_AVAILABLE(10_0, 7_0); // UIColor, default nil: same as foreground color
UIKIT_EXTERN NSString * const NSObliquenessAttributeName NS_AVAILABLE(10_0, 7_0); // NSNumber containing floating point value; skew to be applied to glyphs, default 0: no skew
UIKIT_EXTERN NSString * const NSExpansionAttributeName NS_AVAILABLE(10_0, 7_0); // NSNumber containing floating point value; log of expansion factor to be applied to glyphs, default 0: no expansion
UIKIT_EXTERN NSString * const NSWritingDirectionAttributeName NS_AVAILABLE(10_6, 7_0); // NSArray of NSNumbers representing the nested levels of writing direction overrides as defined by Unicode LRE, RLE, LRO, and RLO characters. The control characters can be obtained by masking NSWritingDirection and NSTextWritingDirection values. LRE: NSWritingDirectionLeftToRight|NSWritingDirectionEmbedding, RLE: NSWritingDirectionRightToLeft|NSWritingDirectionEmbedding, LRO: NSWritingDirectionLeftToRight|NSWritingDirectionOverride, RLO: NSWritingDirectionRightToLeft|NSWritingDirectionOverride,
UIKIT_EXTERN NSString * const NSVerticalGlyphFormAttributeName NS_AVAILABLE(10_7, 6_0); // An NSNumber containing an integer value. 0 means horizontal text. 1 indicates vertical text. If not specified, it could follow higher-level vertical orientation settings. Currently on iOS, it's always horizontal. The behavior for any other value is undefined.
除了title外還有一個屬性:prompt,即副標(biāo)題,設(shè)置后導(dǎo)航欄的高度會在原有的基礎(chǔ)上增加30:
self.navigationItem.prompt = @"我是副標(biāo)題";
效果:
不怎么美觀的樣子,很少會用到。
-
設(shè)置按鈕
對于barItem,如果不是rootController ,那么會在左上角有一個系統(tǒng)自帶的返回按鈕,按鈕的名字是上一級的title,效果如上圖。我們當(dāng)然可以自定制item:
UIBarButtonItem *item = [[UIBarButtonItem alloc] initWithBarButtonSystemItem:UIBarButtonSystemItemCancel target:self action:@selector(backClick)];
self.navigationItem.leftBarButtonItem = item;
這是系統(tǒng)為我們提供的類型,有很多種,可以根據(jù)需要選用:
UIBarButtonSystemItemDone,
UIBarButtonSystemItemCancel,
UIBarButtonSystemItemEdit,
UIBarButtonSystemItemSave,
UIBarButtonSystemItemAdd,
UIBarButtonSystemItemFlexibleSpace,
UIBarButtonSystemItemFixedSpace,
UIBarButtonSystemItemCompose,
UIBarButtonSystemItemReply,
UIBarButtonSystemItemAction,
UIBarButtonSystemItemOrganize,
UIBarButtonSystemItemBookmarks,
UIBarButtonSystemItemSearch,
UIBarButtonSystemItemRefresh,
UIBarButtonSystemItemStop,
UIBarButtonSystemItemCamera,
UIBarButtonSystemItemTrash,
UIBarButtonSystemItemPlay,
UIBarButtonSystemItemPause,
UIBarButtonSystemItemRewind,
UIBarButtonSystemItemFastForward,
UIBarButtonSystemItemUndo NS_ENUM_AVAILABLE_IOS(3_0),
UIBarButtonSystemItemRedo NS_ENUM_AVAILABLE_IOS(3_0),
UIBarButtonSystemItemPageCurl NS_ENUM_AVAILABLE_IOS(4_0),
如果這些仍然不夠(實(shí)際上這些在項目中很少用到),我們可以自定義,可放圖片或者文字:
//設(shè)置圖片
UIBarButtonItem *backItem = [[UIBarButtonItem alloc] initWithImage:[UIImage imageNamed:@"back"] style:UIBarButtonItemStylePlain target:self action:@selector(backClick)];
self.navigationItem.leftBarButtonItem = backItem;
//設(shè)置文字
UIBarButtonItem *backItem = [[UIBarButtonItem alloc] initWithTitle:@"返回" style:UIBarButtonItemStyleDone target:self action:@selector(backClick)];
backItem.tintColor = [UIColor redColor];//可以自定義顏色
backItem.width = 100;//如果有需要可以設(shè)置寬度,此寬度會影響item的作用范圍
self.navigationItem.leftBarButtonItem = backItem;
假如我們想讓我們的item既包含圖片又包含文字,應(yīng)該怎么辦呢?再定制:
UIButton *button = [[UIButton alloc] initWithFrame:CGRectMake(0, 0, 60, 44)];
//button.backgroundColor = [UIColor blackColor];
button.titleLabel.font = [UIFont systemFontOfSize:14];
[button setTitle:@"返回" forState:UIControlStateNormal];
[button setTitleColor:[UIColor redColor] forState:UIControlStateNormal];
[button setImage:[UIImage imageNamed:@"back"] forState:UIControlStateNormal];
[button addTarget:self action:@selector(backClick) forControlEvents:UIControlEventTouchUpInside];
[button setImageEdgeInsets:UIEdgeInsetsMake(0, -20, 0, 0)];
[button setTitleEdgeInsets:UIEdgeInsetsMake(0, -40, 0, 0)];
UIBarButtonItem *backItem = [[UIBarButtonItem alloc] initWithCustomView:button];
就是犟樣子的:
我承認(rèn),很丑,木有什么藝術(shù)細(xì)菌,不過功能是實(shí)現(xiàn)了,等童靴們來做的更漂亮了。
以上是放置了一個item,也是可以放置多個的:
UIBarButtonItem *backItem = [[UIBarButtonItem alloc] initWithImage:[UIImage imageNamed:@"back"] style:UIBarButtonItemStylePlain target:self action:@selector(backClick)];
UIBarButtonItem *item = [[UIBarButtonItem alloc] initWithBarButtonSystemItem:UIBarButtonSystemItemCancel target:self action:@selector(backClick)];
self.navigationItem.leftBarButtonItems = @[item,backItem];
效果:
這是左邊的,右邊的也是一樣的,可以進(jìn)行同樣的設(shè)置,在這就不再贅述了。
會有一個小問題,就是iOS7之后自帶邊緣右滑返回的功能,而當(dāng)我們自定義返回按鈕后,右滑返回就失效了,解決辦法也很簡單,一句代碼:
self.navigationController.interactivePopGestureRecognizer.delegate = (id)self;
-
toolBar
這樣設(shè)置之后Toolbar就顯示了出來
self.navigationController.toolbarHidden = NO;
接著給Toolbar添加按鈕,也是barItem
UIBarButtonItem *item = [[UIBarButtonItem alloc] initWithBarButtonSystemItem:UIBarButtonSystemItemCancel target:self action:@selector(backClick)];
UIBarButtonItem *item2 = [[UIBarButtonItem alloc] initWithBarButtonSystemItem:UIBarButtonSystemItemReply target:nil action:nil];
UIView *view = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 40, 40)];
view.backgroundColor = [UIColor redColor];
UIBarButtonItem *item3 = [[UIBarButtonItem alloc] initWithCustomView:view];
UIBarButtonItem *flexItem = [[UIBarButtonItem alloc] initWithBarButtonSystemItem:UIBarButtonSystemItemFlexibleSpace target:nil action:nil];
[self setToolbarItems:@[item,item2,item3]];
看效果:
很擠得樣子,我們可以修改一下:
UIBarButtonItem *item = [[UIBarButtonItem alloc] initWithBarButtonSystemItem:UIBarButtonSystemItemCancel target:self action:@selector(backClick)];
UIBarButtonItem *item2 = [[UIBarButtonItem alloc] initWithBarButtonSystemItem:UIBarButtonSystemItemReply target:nil action:nil];
UIView *view = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 40, 40)];
view.backgroundColor = [UIColor redColor];
UIBarButtonItem *item3 = [[UIBarButtonItem alloc] initWithCustomView:view];
UIBarButtonItem *flexItem = [[UIBarButtonItem alloc] initWithBarButtonSystemItem:UIBarButtonSystemItemFlexibleSpace target:nil action:nil];
[self setToolbarItems:@[flexItem,item,flexItem,item2,flexItem,item3,flexItem]];
再看:
這樣看著就比較順眼了。
-
push、pop動畫的修改
1、push動畫修改
SecondViewController *second = [[SecondViewController alloc] init];
CATransition *animation = [CATransition animation];//定義CATransition的一個對象
[animation setDuration:1];//設(shè)置動畫時間
[animation setType:kCATransitionMoveIn];//設(shè)置動畫類型,有很多種可供選擇
[animation setSubtype:kCATransitionReveal];
[animation setTimingFunction:[CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseInEaseOut]];
[self.navigationController.view.layer addAnimation:animation forKey:nil];//這一步是不能省的
[self.navigationController pushViewController:second animated:NO];//這里一定要設(shè)置為No,否則的話效果就混亂了
2、pop,也是一樣的
CATransition *animation = [[CATransition alloc] init];
animation.duration = 0.5;
animation.type = kCATransitionFade;
animation.timingFunction = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionEaseIn];
[self.navigationController.view.layer addAnimation:animation forKey:nil];
[self.navigationController popViewControllerAnimated:NO];//同樣要設(shè)為No
- End