關於iOS 狀態列、導航欄的幾處筆記

QiShare發表於2019-04-04

級別: ★☆☆☆☆
標籤:「iOS」「狀態列」「導航欄」
作者: dac_1033
審校: QiShare團隊


狀態列與導航欄

狀態列與導航欄的位置如上圖,我們可以通過[UIApplication sharedApplication].statusBarFrame.size獲取狀態列的size(一般沒有劉海時的高度為20,有劉海時的高度為44)。 通過self.navigationController.navigationBar.frame.size獲取導航欄的size(一般高度為44,大標題時高度為xyz,當然也可以通過自定義來改變導航欄樣式)。 ***ps:***在我們通過[nav.navigationBar setBarTintColor:[UIColor lightGrayColor]];來設定導航欄顏色時,將導致導航欄和狀態列背景色均變為淺灰色。

1. 狀態列內容是否高亮

狀態列內容包括訊號、時間、電量等,只有兩種顏色樣式(黑或白)。iOS開發過程中提供修改狀態列內容顏色樣式的方法:

  • 在程式碼中設定狀態列內容顏色:info.plist檔案中直接設定狀態列內容顏色:在info.plist中新增欄位View controller-based status bar appearance, 當其取值為YES時,表示以UIController對狀態列的設定為準,UIApplication對狀態列進行的設定將不起作用。
// 在controller中重寫該方法,並返回相應值
- (UIStatusBarStyle)preferredStatusBarStyle {
    
    return UIStatusBarStyleLightContent;
}

// 注意:
// 當controller嵌入UINavigationController中時,controller中的方法preferredStatusBarStyle是不會自動被呼叫的,而navController中的該方法會被呼叫;
// 當有navController時,在重寫controller中的preferredStatusBarStyle方法同時,我們還應重寫navController中的childViewControllerForStatusBarStyle方法。
- (UIViewController *)childViewControllerForStatusBarStyle {
    
    return self.topViewController;
}
複製程式碼

當欄位View controller-based status bar appearance取值為NO時,則以UIApplication為準,控制器設定狀態列的方法preferredStatusBarStyle則根本不會被呼叫。

// 狀態列內容-黑色
[UIApplication sharedApplication].statusBarStyle = UIStatusBarStyleDefault;
// 狀態列內容-白色
[UIApplication sharedApplication].statusBarStyle = UIStatusBarStyleLightContent;
複製程式碼
  • 在info.plist檔案中直接設定狀態列內容顏色:欄位View controller-based status bar appearance取值為NO,且Status bar style取值為UIStatusBarStyleLightContent(可選),則不寫程式碼,也可控制應用中的狀態列內容顏色。

2. 隱藏狀態列

  • 整個專案隱藏 在Targets -> General -> 勾選 Hide status bar 即可。

    工程配置

  • 在單個介面中隱藏

// iOS 9.0 之前
// 隱藏=YES,顯示=NO; Animation:動畫效果
[[UIApplication sharedApplication] setStatusBarHidden:YES withAnimation:UIStatusBarAnimationNone];

// iOS 9.0 之後推薦使用這個
// 注意:該方法可以通過UIController中的方法setNeedsStatusBarAppearanceUpdate來間接呼叫
- (BOOL)prefersStatusBarHidden {
    
    return YES;
}
複製程式碼

注意:上面兩個操作狀態方法依然受到Info.plist中欄位View controller-based status bar appearance取值得影響,該欄位取值為YES時,進入controller會自動呼叫prefersStatusBarHidden方法。當controller嵌入UINavigationController中時,controller中的方法prefersStatusBarHidden是不會自動被呼叫的,而navController中的該方法會被呼叫;當有navController時,在重寫controller中的prefersStatusBarHidden方法同時,我們還應重寫navController中的childViewControllerForStatusBarHidden方法。

- (UIViewController *)childViewControllerForStatusBarHidden {
    
    return self.topViewController;
}
複製程式碼
  • 啟動頁隱藏狀態列,進入程式後正常顯示狀態列 首先,在Targets->General->勾選中Hide status bar或者在info.plist裡面 Status bar is initially hidden 設定為 YES; 其次,在AppDelegate.m中新增程式碼
-(BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions
{
    [application setStatusBarHidden:NO withAnimation:UIStatusBarAnimationFade];
}
複製程式碼

3. 導航欄

UINavigationController的檢視結構

UINavigationController的檢視層次結構比較清晰,使用者可見的導航欄即為其中的***UINavigationBar***,通過它,我們就可以修改導航欄的樣式。下面我們就逐步介紹一些常用的關於導航欄的操作。

  • 導航欄常用操作
// 隱藏導航欄
//[self.navigationController setNavigationBarHidden:YES];
[self.navigationController setNavigationBarHidden:YES animated:YES];

// 設定導航背景為紅色
[self.navigationController.navigationBar setBarTintColor:[UIColor redColor]];

// 設定navigationBar的透明效果
[self.navigationController.navigationBar setTranslucent:YES]; 
//設定導航欄的背景圖片
[self.navigationController.navigationBar setBackgroundImage:[UIImage imageNamed:@"imgName"] forBarMetrics:UIBarMetricsDefault];

// Attributes 屬性
NSDictionary  *textAttributes = @{NSForegroundColorAttributeName:[UIColor whiteColor],NSFontAttributeName:[UIFont systemFontOfSize:30]};
// 設定導航欄標題的字型大小、顏色
[self.navigationController.navigationBar setTitleTextAttributes:textAttributes];
複製程式碼

4. 導航欄常用樣式

在日常開發中,我們經常需要修改導航欄樣式,如使導航欄透明、導航欄尺寸等,在不同樣式導航欄之間的切換時還要注意是否平順...(隱藏,與正常導航欄的切換)

  • 導航欄大標題
if (@available(iOS 11.0, *)) {
        [self.navigationController.navigationBar setPrefersLargeTitles:YES];
}
複製程式碼
  • 自定義導航欄大標題樣式 重寫UINavigationBar中的layoutSubviews方法,可通過傳送通知的形式來監聽導航欄高度變化,如下:
-(void)layoutSubviews {
    [super layoutSubviews];
    
    [[NSNotificationCenter defaultCenter] postNotificationName:KEY_UINavigationBar_Height_Changed object:self userInfo:nil];
}
複製程式碼
  • 使導航欄透明 當需要設定導航欄透明且title等項正常顯示時,最好將設定過程置於viewWillAppear:方法中:
//// 需要導航欄透明的ViewController中
- (void)viewWillAppear:(BOOL)animated {
    
    [super viewWillAppear:animated];
    
    _navView.hidden = NO;
    self.edgesForExtendedLayout = UIRectEdgeTop;
    self.navigationController.navigationBar.translucent = YES;
    [self.navigationController.navigationBar setShadowImage:[UIImage new]];
    [self.navigationController.navigationBar setBackgroundImage:[UIImage new] forBarMetrics:UIBarMetricsDefault];
    [self.navigationController.navigationBar setTitleTextAttributes:@{NSForegroundColorAttributeName: [UIColor whiteColor]}];
}

//// 導航欄為非透明的ViewController中
- (void)viewWillAppear:(BOOL)animated {
    
    [super viewWillAppear:animated];
    
    self.edgesForExtendedLayout = UIRectEdgeNone;
    self.navigationController.navigationBar.translucent = NO;
    [self.navigationController.navigationBar setShadowImage:nil];
    [self.navigationController.navigationBar setTintColor:[UIColor blackColor]];
    [self.navigationController.navigationBar setBackgroundImage:nil forBarMetrics:UIBarMetricsDefault];
    [self.navigationController.navigationBar setTitleTextAttributes:@{NSForegroundColorAttributeName: [UIColor blackColor]}];
}

複製程式碼

關於自定義導航欄、tabBar的例子將在後續文章中介紹...


小編微信:可加並拉入《QiShare技術交流群》。

關於iOS 狀態列、導航欄的幾處筆記

關注我們的途徑有:
QiShare(簡書)
QiShare(掘金)
QiShare(知乎)
QiShare(GitHub)
QiShare(CocoaChina)
QiShare(StackOverflow)
QiShare(微信公眾號)

推薦文章:
演算法小專欄:遞迴與尾遞迴
iOS 避免常見崩潰(二)
演算法小專欄:選擇排序
iOS Runloop(一)
iOS 常用除錯方法:LLDB命令
iOS 常用除錯方法:斷點
iOS 常用除錯方法:靜態分析
奇舞週刊

相關文章