Just My Life & My Work

[iOS] Navigation Bar 客製化

2016 年 12 月 31 日

iOS App幾乎少不了Navigation Bar，想要客製化Navigation Bar就要多些技巧，因為iOS SDK內建的功能有限（也許我沒發現ＸＤ～）。過去我們團隊常自己刻Navigation Bar，每一頁都拉介面設定，儘管麻煩還是依樣畫葫蘆，有時候某些頁面要呈現特別的樣子，就會慶幸我們使用非原生：Ｐ～

原生預設長得像下方圖⋯⋯

navigation-bar2

如果沒有特別設定，高度和顏色固定。

那假如我想改成下方的樣子呢？

navigation-bar

因為原本是用原生的方法做，所以有嘗試過拉高Navigation Bar，不過一直有點擊問題。

/**
 Theme: Navigation Bar Customization
 IDE: Xcode 8
 Language: Objective C
 Date: 105/12/27
 Author: HappyMan
 Blog: https://cg2010studio.wordpress.com/
 */
    // 設定 Navigation Bar 高度
    [self.navigationController.navigationBar setFrame:CGRectMake(self.navigationController.navigationBar.frame.origin.x, self.navigationController.navigationBar.frame.origin.y, self.navigationController.navigationBar.frame.size.width, 50)];

    // Navigation Bar 背景
    [self.navigationController.navigationBar setBackgroundImage:[UIImage imageNamed:@"nav_background"] forBarMetrics:UIBarMetricsDefault];

    // Navigation Bar 陰影
    [self.navigationController.navigationBar setShadowImage:[[UIImage alloc] init]];

    [self.navigationController.navigationBar setShadowImage:[UIImage imageNamed:@"nav_shadow"]];

後來發現Navigation Bar可以設定背景和陰影，於是就解決我們大部分的問題囉～

navigation-bar

是不是很像Navigation Bar拉高呢？但事實上高度一直沒有變，是下方的介面顏色跟上方一樣。

參考：How to hide iOS7 UINavigationBar 1px bottom line。

分類：

iOS, 教學

發表留言

Tagged with:

隨意留個言吧：）～

這個網站採用 Akismet 服務減少垃圾留言。進一步了解 Akismet 如何處理網站訪客的留言資料。

標籤雲