其他網站的資料:
自定義iOS7導航欄背景,標題和返回按鈕文字顏色
目錄
- 導航控制器的定制
- 定制NavigationItem
- 設置titleView
- 創建BarButtonItem
- 定制NavigationBar導航條
- 定制工具條和toolBarItem
- 定制toolBar
- 定制toolBarItem
- 占位item的寬度自動可變
- 占位item的寬度固定
- 自定制返回鍵
補充:隱藏系統自動創建的返回按鈕
self.navigationItem.hidesBackButton = YES;
導航控制器的定制:
- 1.導航條(NavigationBar):屬于導航控制器的
- 2.NavigationItem(導航條上顯示的內容):屬于視圖控制器
- 3.工具條(toolBar):屬于導航控制器
- 4.toolBarItem(工具條上顯示的內容):屬于視圖控制器的
定制導航條
//1.創建視圖控制器對象,作為導航控制器的根視圖控制器
FirstViewController * first = [[FirstViewController alloc] init];
//2.創建一個導航控制器
NavigationController * nav = [[NavigationController alloc] initWithRootViewController:first];
隱藏返回按鈕
self.navigationItem.hidesBackButton = YES;
定制NavigationItem
navigationItem就是一個視圖控制器所在顯示的導航條上的內容
navigationItem屬于視圖控制器
1.設置titleView
(1)中間顯示文字
//如果中間只是顯示文字,可以通過直接設置視圖控制器的title屬性來設置
[self.navigationItem setTitle:@"小雞燉蘑菇"];
(2)中間顯示其他的視圖
可以設置成任何直接或者間接繼承自UIView的類的對象都可以
添加搜索框
UISearchBar * search = [[UISearchBar alloc] initWithFrame:CGRectMake(0, 0, 100, 40)];
UIView * view = [[UIView alloc] initWithFrame:CGRectMake(0, 0, 100, 40)];
[view addSubview:search];
view.backgroundColor = [UIColor yellowColor];
//如果設置了這個屬性,會覆蓋原來顯示文字的部分
[self.navigationItem setTitleView:search];
2.創建BarButtonItem
a.創建系統的item
UIBarButtonSystemItemDone,
UIBarButtonSystemItemCancel,
UIBarButtonSystemItemEdit,
UIBarButtonSystemItemSave,
UIBarButtonItem * item1 = [[UIBarButtonItem alloc] initWithBarButtonSystemItem:UIBarButtonSystemItemCamera target:self action:@selector()];
b.通過自定制view方式創建item
UIImageView * imageView = [[UIImageView alloc] initWithFrame:CGRectMake(0, 0, 30, 30)];
imageView.image = [UIImage imageNamed:@"itemImage2"];
UIBarButtonItem * item2 = [[UIBarButtonItem alloc] initWithCustomView:imageView];
c.通過文字創建可以點擊的item
UIBarButtonItem * item3 = [[UIBarButtonItem alloc] initWithTitle:@"向右" style:UIBarButtonItemStylePlain target:self action:@selector(onclicked2)];
d.通過圖片創建可以點擊的按鈕
//設置圖片的時候需要設置圖片的渲染模式為:UIImageRenderingModeAlwaysOriginal,否則圖片不會正確的顯示
UIBarButtonItem * item4 = [[UIBarButtonItem alloc] initWithImage:[[UIImage imageNamed:@"itemImage"] imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal] style:UIBarButtonItemStylePlain target:self action:@selector(onclicked2)];
//2.設置右邊的item
//在這個方法的內部創建了一個對應的按鈕
[self.navigationItem setRightBarButtonItem:item4];
通過數組來設置右邊多個items的時候,會覆蓋單獨設置的右邊的item
[self.navigationItem setRightBarButtonItems:@[item1,item4]];
//3.設置左邊的item
[self.navigationItem setLeftBarButtonItem:item3];
[self.navigationItem setLeftBarButtonItems:@[item3, item2]];
//4.隱藏系統自動創建的返回按鈕
self.navigationItem.hidesBackButton = YES;
}
定制NavigationBar導航條
1.設置是否有透明度(默認導航條有透明度:YES)
[self.navigationBar setTranslucent:NO];
2.設置導航條樣式
UIBarStyleDefault //默認,導航條是白色,狀態欄黑色
UIBarStyleBlack //導航條是黑色,狀態欄是白色
[self.navigationBar setBarStyle:UIBarStyleBlack];
3.設置導航條的顏色
[self.navigationBar setBarTintColor:[UIColor redColor]];
4.設置導航條的填充顏色(導航條上鏤空的部分的顏色)
[self.navigationBar setTintColor:[UIColor greenColor]];
5.改變標題的字體和顏色
[self.navigationBar setTitleTextAttributes:@{NSFontAttributeName:[UIFont systemFontOfSize:16], NSForegroundColorAttributeName:[UIColor lightGrayColor]}];
6.設置背景圖片
iphone上所有的狀態欄的高度:20
導航條的高度:44(以前) 20 + 44 = 64(現在)
如果圖片高度大于等于64像素,那么設置的圖片的作用范圍是狀態欄(20)+導航條(44);如果圖片高度小于64,那么圖片的作用范圍只是導航條(44)
[self.navigationBar setBackgroundImage:[UIImage imageNamed:@"header_bg64.png"] forBarMetrics:UIBarMetricsDefault];
定制工具條和toolBarItem
- toolBar:屬于導航控制器
- toolBarItem:屬于視圖控制器
定制toolBar
- toolBar的高度是:44
- toolBar默認是隱藏(一般只在需要顯示工具條的界面去設置)
設置:NavigationController.toolbarHidden = NO;
1.設置是否有透明度(默認有透明度)
self.toolbar.translucent = NO;
2.設置toolBar的顏色
[self.toolbar setBarTintColor:[UIColor greenColor]];
3.設置填充顏色(鏤空部分的顏色)
[self.toolbar setTintColor:[UIColor yellowColor]];
4.設置背景圖片
//參數1:圖片
//參數2:顯示位置
//參數3:bar的材質
[self.toolbar setBackgroundImage:[UIImage imageNamed:@"toolBar"] forToolbarPosition:UIBarPositionAny barMetrics:UIBarMetricsDefault];
定制toolBarItem
- toolBarItem中item和navigationItem中的item屬于同一類,都是UIBarButtonItem
1.創建item
//系統item
UIBarButtonSystemItemBookmarks,
UIBarButtonSystemItemSearch,
UIBarButtonSystemItemRefresh,
UIBarButtonSystemItemStop,
UIBarButtonSystemItemCamera,
UIBarButtonSystemItemTrash,
UIBarButtonSystemItemPlay,
UIBarButtonItem * item1 = [[UIBarButtonItem alloc] initWithBarButtonSystemItem:UIBarButtonSystemItemBookmarks target:self action:@selector(onclicked:)];
UIBarButtonItem * item2 = [[UIBarButtonItem alloc] initWithBarButtonSystemItem:UIBarButtonSystemItemRefresh target:self action:@selector(onclicked:)];
UIBarButtonItem * item3 = [[UIBarButtonItem alloc] initWithBarButtonSystemItem:UIBarButtonSystemItemCamera target:self action:@selector(onclicked:)];
專門用來占位item
a.占位item的寬度自動可變
每個itme之間的距離。需要占位item
//可變(自動計算兩個item之間的間隔)
UIBarButtonSystemItemFlexibleSpace,
UIBarButtonItem * spaceItem = [[UIBarButtonItem alloc] initWithBarButtonSystemItem:UIBarButtonSystemItemFlexibleSpace target:nil action:nil];
2.將item顯示在toolBar上
self.toolbarItems = @[spaceItem,item1, spaceItem,spaceItem,item2,spaceItem, spaceItem,item3, spaceItem];
b.占位item的寬度固定
UIBarButtonSystemItemFixedSpace,
UIBarButtonItem * spaceItem2 = [[UIBarButtonItem alloc] initWithBarButtonSystemItem:UIBarButtonSystemItemFixedSpace target:nil action:nil];
//設置固定的寬度
spaceItem2.width = 15;
//將item顯示在toolBar上
self.toolbarItems = @[spaceItem2, item1, spaceItem2,spaceItem2, item2, spaceItem2,spaceItem2, item3];
自定制返回鍵
//修改系統返回鍵是圖片和文字,會保留側拉返回功能
UIImage *backButtonImage = [[UIImage imageNamed:@"fanhui.png"] resizableImageWithCapInsets:UIEdgeInsetsMake(0, 30, 0, 0)];
[[UIBarButtonItem appearance] setBackButtonBackgroundImage:backButtonImage forState:UIControlStateNormal barMetrics:UIBarMetricsDefault];
//將返回按鈕的文字position設置不在屏幕上顯示
[[UIBarButtonItem appearance] setBackButtonTitlePositionAdjustment:UIOffsetMake(NSIntegerMin, NSIntegerMin) forBarMetrics:UIBarMetricsDefault];
- (void)viewWillDisappear:(BOOL)animated {
[super viewWillDisappear:animated];
//代理置空,否則會閃退
if ([self.navigationController respondsToSelector:@selector(interactivePopGestureRecognizer)]) {
self.navigationController.interactivePopGestureRecognizer.delegate = nil;
}
}
- (void)viewDidAppear:(BOOL)animated {
[super viewDidAppear:animated];
//開啟iOS7的滑動返回效果
if ([self.navigationController respondsToSelector:@selector(interactivePopGestureRecognizer)])
{
//只有在二級頁面生效
if ([self.navigationController.viewControllers count] == 2) {
self.navigationController.interactivePopGestureRecognizer.delegate = self;
}
}
}
在有的時候,我們不需要手勢返回功能,那么可以在頁面中添加以下代碼:
- (void)viewDidAppear:(BOOL)animated
{
[super viewDidAppear:animated];
// 禁用 iOS7 返回手勢
if ([self.navigationController respondsToSelector:@selector(interactivePopGestureRecognizer)]) {
self.navigationController.interactivePopGestureRecognizer.enabled = NO;
}
}
- (void)viewWillDisappear:(BOOL)animated
{
[super viewWillDisappear:animated];
// 開啟
if ([self.navigationController respondsToSelector:@selector(interactivePopGestureRecognizer)]) {
self.navigationController.interactivePopGestureRecognizer.enabled = YES;
}
}
// 如果滑動移除控制器的功能失效,清空代理(讓導航控制器重新設置這個功能)
self.interactivePopGestureRecognizer.delegate = nil;