iOS中的導(dǎo)航欄UINavigationBar與工具欄UIToolBar要點(diǎn)解析

更新時(shí)間：2016年06月27日 09:34:44 作者：琿少

UINavigation可以附著于導(dǎo)航控制器之中使用,也可以在controller中單獨(dú)使用,這里我們將來(lái)看iOS中的導(dǎo)航欄UINavigationBar與工具欄UIToolBar要點(diǎn)解析.

一、導(dǎo)航欄UINavigationBar
1、導(dǎo)航欄的使用

在iOS開(kāi)發(fā)中，我們通常會(huì)使用導(dǎo)航控制器，導(dǎo)航控制器中封裝了一個(gè)UINavigationBar，實(shí)際上，我們也可以在不使用導(dǎo)航控制器的前提下，單獨(dú)使用導(dǎo)航欄，在UINavigationBar中，也有許多我們可以定制的屬性，用起來(lái)十分方便。

2、UINavigationBar的創(chuàng)建和風(fēng)格類(lèi)型

導(dǎo)航欄繼承于UIView，所以我們可以像創(chuàng)建普通視圖那樣創(chuàng)建導(dǎo)航欄，比如我們創(chuàng)建一個(gè)高度為80的導(dǎo)航欄，將其放在ViewController的頭部，代碼如下：

UINavigationBar *bar = [[UINavigationBar alloc]initWithFrame:CGRectMake(0, 0, 320, 80)]; [self.view addSubview:bar];效果如下：

201662792618648.png (207×396)

我們也可以設(shè)置導(dǎo)航欄的風(fēng)格屬性，從iOS6之后，UINavigationBar默認(rèn)為半透明的樣式，從上面也可以看出，白色的導(dǎo)航欄下面透出些許背景的紅色。導(dǎo)航欄的風(fēng)格屬性可以通過(guò)下面的屬性來(lái)設(shè)置：

@property(nonatomic,assign) UIBarStyle barStyle;UIBarStyle是一個(gè)枚舉，其中大部分的樣式都已棄用，有效果的只有如下兩個(gè)：

typedef NS_ENUM(NSInteger, UIBarStyle) { UIBarStyleDefault = 0,//默認(rèn) UIBarStyleBlack = 1,//黑色 }默認(rèn)的風(fēng)格就是我們上面看到的白色的風(fēng)格，黑色的風(fēng)格效果瑞如下：

201662792646704.png (208×400)

3、導(dǎo)航欄常用屬性和方法

從上面我們可以看到，iOS6后導(dǎo)航欄默認(rèn)都是半透明的，我們可以通過(guò)下面的bool值來(lái)設(shè)置這個(gè)屬性，設(shè)置為NO，則導(dǎo)航欄不透明，默認(rèn)為YES：

@property(nonatomic,assign,getter=isTranslucent) BOOL translucent;下面一些方法用于設(shè)置NavigationBar及上面item的顏色相關(guān)屬性：

@property(null_resettable, nonatomic,strong) UIColor *tintColor;tintColor這個(gè)屬性會(huì)影響到導(dǎo)航欄上左側(cè)pop按鈕的圖案顏色和字體顏色，系統(tǒng)默認(rèn)是如下顏色：

201662792715889.png (57×53)

@property(nullable, nonatomic,strong) UIColor *barTintColor;BarTintColor用于設(shè)置導(dǎo)航欄的背景色，這個(gè)屬性被設(shè)置后，半透明的效果將失效：

201662792738305.png (210×394)

- (void)setBackgroundImage:(nullable UIImage *)backgroundImage forBarMetrics:(UIBarMetrics)barMetrics NS_AVAILABLE_IOS(5_0) UI_APPEARANCE_SELECTOR; - (nullable UIImage *)backgroundImageForBarMetrics:(UIBarMetrics)barMetrics;上面兩個(gè)方法用于設(shè)置和獲取導(dǎo)航欄的背景圖案，這里需要注意，默認(rèn)背景圖案是不做縮放處理的，所以我們使用的圖片尺寸要和導(dǎo)航欄尺寸匹配，這里面還有一個(gè)UIBarMetrics參數(shù)，這個(gè)參數(shù)設(shè)置設(shè)備的狀態(tài)，如下：

typedef NS_ENUM(NSInteger, UIBarMetrics) { UIBarMetricsDefault,//正常豎屏狀態(tài) UIBarMetricsCompact,//橫屏狀態(tài) }; //設(shè)置導(dǎo)航欄的陰影圖片 @property(nullable, nonatomic,strong) UIImage *shadowImage; //設(shè)置導(dǎo)航欄的標(biāo)題字體屬性 @property(nullable,nonatomic,copy) NSDictionary<NSString *,id> *titleTextAttributes;標(biāo)題字體屬性會(huì)影響到導(dǎo)航欄的中間標(biāo)題，如下：

bar.titleTextAttributes = @{NSForegroundColorAttributeName:[UIColor redColor]};

201662792809634.png (211×98)

我們也可以通過(guò)下面的屬性設(shè)置導(dǎo)航欄標(biāo)題的豎直位置偏移：

- (void)setTitleVerticalPositionAdjustment:(CGFloat)adjustment forBarMetrics:(UIBarMetrics)barMetrics; - (CGFloat)titleVerticalPositionAdjustmentForBarMetrics:(UIBarMetrics)barMetrics;還有一個(gè)細(xì)節(jié)，導(dǎo)航欄左側(cè)pop按鈕的圖案默認(rèn)是一個(gè)箭頭，我們可以使用下面的方法修改：

@property(nullable,nonatomic,strong) UIImage *backIndicatorImage; @property(nullable,nonatomic,strong) UIImage *backIndicatorTransitionMaskImage;4、導(dǎo)航欄中item的push與pop操作

UINavigationBar上面不只是簡(jiǎn)單的顯示標(biāo)題，它也將標(biāo)題進(jìn)行了堆棧的管理，每一個(gè)標(biāo)題抽象為的對(duì)象在iOS系統(tǒng)中是UINavigationItem對(duì)象，我們可以通過(guò)push與pop操作管理item組。

//向棧中添加一個(gè)item，上一個(gè)item會(huì)被推向?qū)Ш綑诘淖髠?cè)，變?yōu)閜op按鈕，會(huì)有一個(gè)動(dòng)畫(huà)效果 - (void)pushNavigationItem:(UINavigationItem *)item animated:(BOOL)animated; //pop一個(gè)item - (nullable UINavigationItem *)popNavigationItemAnimated:(BOOL)animated; //當(dāng)前push到最上層的item @property(nullable, nonatomic,readonly,strong) UINavigationItem *topItem; //僅次于最上層的item，一般式被推向?qū)Ш綑谧髠?cè)的item @property(nullable, nonatomic,readonly,strong) UINavigationItem *backItem; //獲取堆棧中所有item的數(shù)組 @property(nullable,nonatomic,copy) NSArray<UINavigationItem *> *items; //設(shè)置一組item - (void)setItems:(nullable NSArray<UINavigationItem *> *)items animated:(BOOL)animated;5、UINavigationBarDelegate

在UINavigationBar中，還有如下一個(gè)屬性：

@property(nullable,nonatomic,weak) id<UINavigationBarDelegate> delegate;通過(guò)代理，我們可以監(jiān)控導(dǎo)航欄的一些push與pop操作：

//item將要push的時(shí)候調(diào)用，返回NO，則不能push - (BOOL)navigationBar:(UINavigationBar *)navigationBar shouldPushItem:(UINavigationItem *)item; //item已經(jīng)push后調(diào)用 - (void)navigationBar:(UINavigationBar *)navigationBar didPushItem:(UINavigationItem *)item; //item將要pop時(shí)調(diào)用，返回NO，不能pop - (BOOL)navigationBar:(UINavigationBar *)navigationBar shouldPopItem:(UINavigationItem *)item; //item已經(jīng)pop后調(diào)用 - (void)navigationBar:(UINavigationBar *)navigationBar didPopItem:(UINavigationItem *)item;

二、工具欄UIToolBar
導(dǎo)航欄一般會(huì)出現(xiàn)在視圖的頭部，與之相對(duì)，工具欄一般會(huì)出現(xiàn)在視圖的的底部，上面可以填充一些按鈕，提供給用戶一些操作。創(chuàng)建一個(gè)工具欄如下：
self.view.backgroundColor = [UIColor grayColor]; UIToolbar * tool = [[UIToolbar alloc]initWithFrame:CGRectMake(0, self.view.frame.size.height-40, 320, 40)]; [self.view addSubview:tool];

201662792902461.png (206×399)

下面是UIToolBar中的一些方法，其中大部分在UINavigationBar中都有涉及，這里只做簡(jiǎn)單的介紹：

//工具欄的風(fēng)格，和導(dǎo)航欄類(lèi)似，有黑白兩種 @property(nonatomic) UIBarStyle barStyle; //設(shè)置工具欄上按鈕數(shù)組 @property(nullable,nonatomic,copy) NSArray<UIBarButtonItem *> *items; //設(shè)置工具欄是否透明 @property(nonatomic,assign,getter=isTranslucent) BOOL translucent; //設(shè)置工具欄按鈕 - (void)setItems:(nullable NSArray<UIBarButtonItem *> *)items animated:(BOOL)animated; //設(shè)置item風(fēng)格顏色 @property(null_resettable, nonatomic,strong) UIColor *tintColor; //設(shè)置工具欄背景色 @property(nullable, nonatomic,strong) UIColor *barTintColor; //設(shè)置工具欄背景和陰影圖案 - (void)setBackgroundImage:(nullable UIImage *)backgroundImage forToolbarPosition:(UIBarPosition)topOrBottom barMetrics:(UIBarMetrics)barMetrics; - (nullable UIImage *)backgroundImageForToolbarPosition:(UIBarPosition)topOrBottom barMetrics:(UIBarMetrics)barMetrics; - (void)setShadowImage:(nullable UIImage *)shadowImage forToolbarPosition:(UIBarPosition)topOrBottom; - (nullable UIImage *)shadowImageForToolbarPosition:(UIBarPosition)topOrBottom;