iOS Swift5從0到1系列(五):學習UINavigationController(3):NavigationBar 顯示與隱藏

UINavigationController 小系列(持續(xù)更新):

學習UINavigationController(1):基礎
學習UINavigationController(2):底部TabBar的顯示與隱藏
學習UINavigationController(3):NavigationBar 顯示與隱藏

一诡壁、前言

上篇,我們分析了如何正確的通過繼承 UINavigationBar 并重寫 pushViewController 來正確的設置 tabBar 的顯示與隱藏,本篇,將如題所述那樣放祟,控制頂部導航欄的顯示與隱藏。

導航欄的顯示與隱藏光戈,一般用于的場景:

  • 類似天貓杂抽、京東APP首頁,默認隱藏導航欄生音,滾動時宁否,通過過渡動畫來顯示自定義導航欄;
  • Hybrid時缀遍,即WKWebView全屏展示H5時慕匠,隱藏原生導航欄,由H5來自主導航欄域醇;
  • 查看圖片 / 視頻時台谊,進入與退出全屏時控制導航欄的顯示與隱藏;
  • ..... 等等譬挚,還有很多 case锅铅,就不一一列舉;

列舉以上的場景减宣,并不是讓大家去做產(chǎn)品經(jīng)理(雖然盐须,有本書叫作:人人都是產(chǎn)品經(jīng)理;無論是開發(fā)還是測試漆腌,都應該站在用戶的角度去思考贼邓,如何更好更合理的設計出一款APP),而是我們在某些場景下闷尿,頁面的切換(push & pop)需要保持頁面導航欄前后一致性塑径。

二、頁面導航欄前后一致性

本小節(jié)會深入分析 UINavigationController 的原理悠砚,新人需要好好學習晓勇,因為控制不當,容易造成前后不一致(我在上篇前言中,貼了一張 gif 圖绑咱,首頁的導航欄背景色開始是白色绰筛,push 到下一個頁面,導航欄背景是藍色描融,然后 pop 回來铝噩,首頁的導航欄還是藍色,并沒有恢復為白色)窿克;同樣骏庸,多年開發(fā)的老同學,也需要『溫顧而知新』年叮。

  • UINavigationController 在之前就分析過:

    • 棧式管理 ViewController具被;
    • 棧式管理 navigationItem;
    • push & pop 時只损,UINavigationController會 sync一姿,即同步;
  • 除此跃惫,還有幾點我沒有提到叮叹,而是特意保留到了本章來講:

    1. UINavigationController 具有傳遞性(其實就是 sync);
    2. 每個 UINavigationController 是單獨管理自己的棧的爆存;
  • 針對上面兩點蛉顽,我來一一解釋:

    1. 所謂傳遞性,其實是 navigationBar (類型:UINavigationBar先较,依附于當前的 navigationController 實例)携冤,它是一個針對當前 UINavigationController 實例的統(tǒng)一設定,所以一旦某處作了修改拇泣,將會適用于該 UINavigationController 棧中所有的 VC噪叙,但你可以通過 UINavigationItem 來為其定制左右按鈕,至于修改背景色霉翔,額睁蕾,只能自定義導航欄,除此無它法债朵,\color{red}{所以子眶,千萬不要隨意去修改} \color{red}{ navigationBar 的屬性,極度危險P蚵3艚堋!}谚中;
    2. 我們在 UITabBarController 中渴杆,嵌套了 N 個 UINavigationController(ViewController)寥枝,因此,這 N 個 UINavigationController 對象的 VC 棧是獨立的管理的磁奖,不會相互使用囊拜;

另外,針對有多個 UINavigationController (即會生成多個對應的 navigationBar)比搭,可以使用 UINavigationBar 的 UIAppearance 進行全局統(tǒng)一設置冠跷,因為 appearance 是單例。

三身诺、統(tǒng)一處理(了解就行)

UINavigationBar 中有個屬性 isHidden蜜托,為 true 就隱藏,false 就顯示霉赡,但是上篇我也說了橄务,操作 navigationBar 是極度危險的,會對當前棧中所有的 UIViewController 都適用穴亏,所以仪糖,如果我們 previousVC 是隱藏,push 后下一個是顯示迫肖,再 pop 時,previousVC 的導航欄就顯示了攒驰,因此蟆湖,我們需要統(tǒng)一處理,雖然這種方式能夠達到顯示與隱藏的效果玻粪,但是用戶體驗非常不好隅津。

3.1、進入與退出時設置 isHidden

先上圖如下:

show-hide-navigation-bar-bad!.gif

上圖我們可以看到兩處非常生硬的導航欄處理:

  • push 下一頁時劲室,還沒完全進入伦仍,下一面的導航欄就已經(jīng)顯示了;
  • pop 回上一頁時很洋,剛開始動畫充蓝,導航欄就隱藏了;

先給出這種統(tǒng)一處理的代碼:

  • 修改 BaseViewController:
base-vc.png
  • 修改一級頁面 HomeViewController:
home-vc.png
  • 修改二級頁面 ViewController:
vc.png
  • 修改 CustomNavigationController:
custom-nc-pop.png

3.2喉磁、退出后再處理導航欄

同樣先上圖如下:

show-hide-navigation-bar-less-bad!.gif

雖然用戶體驗還是非常的差谓苟,但稍微好一點點在于:導航欄在 pop 完全完成后才消失。當然协怒,也不能說這種方式就比上一種要好涝焙,各有側重點吧。

基于上面 3.1 的代碼孕暇,我們只需要稍微修改一下 CustomNavigationController仑撞,實現(xiàn)一個 CustomNavigationControllerDelegate 即可:

custom-nc-delegate.png

那有沒有比這兩種方式更好的處理呢赤兴?當然是有的,下一篇隧哮,我將分享桶良,如何通過自定義導航欄完成以下事:

  1. ViewController 控制各自的導航欄;
  2. push & pop 相互不會影響近迁;
  3. 基于以上兩點艺普,即便顏色、背景不一樣鉴竭,都能較為完美的過渡歧譬;

敬請期待,謝謝搏存!

最后編輯于
?著作權歸作者所有,轉載或內容合作請聯(lián)系作者
  • 序言:七十年代末瑰步,一起剝皮案震驚了整個濱河市,隨后出現(xiàn)的幾起案子璧眠,更是在濱河造成了極大的恐慌缩焦,老刑警劉巖,帶你破解...
    沈念sama閱讀 206,311評論 6 481
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件责静,死亡現(xiàn)場離奇詭異袁滥,居然都是意外死亡,警方通過查閱死者的電腦和手機灾螃,發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 88,339評論 2 382
  • 文/潘曉璐 我一進店門题翻,熙熙樓的掌柜王于貴愁眉苦臉地迎上來,“玉大人腰鬼,你說我怎么就攤上這事嵌赠。” “怎么了熄赡?”我有些...
    開封第一講書人閱讀 152,671評論 0 342
  • 文/不壞的土叔 我叫張陵姜挺,是天一觀的道長。 經(jīng)常有香客問我彼硫,道長炊豪,這世上最難降的妖魔是什么? 我笑而不...
    開封第一講書人閱讀 55,252評論 1 279
  • 正文 為了忘掉前任拧篮,我火速辦了婚禮溜在,結果婚禮上,老公的妹妹穿的比我還像新娘他托。我一直安慰自己掖肋,他們只是感情好,可當我...
    茶點故事閱讀 64,253評論 5 371
  • 文/花漫 我一把揭開白布赏参。 她就那樣靜靜地躺著志笼,像睡著了一般沿盅。 火紅的嫁衣襯著肌膚如雪。 梳的紋絲不亂的頭發(fā)上纫溃,一...
    開封第一講書人閱讀 49,031評論 1 285
  • 那天腰涧,我揣著相機與錄音,去河邊找鬼紊浩。 笑死窖铡,一個胖子當著我的面吹牛,可吹牛的內容都是我干的坊谁。 我是一名探鬼主播费彼,決...
    沈念sama閱讀 38,340評論 3 399
  • 文/蒼蘭香墨 我猛地睜開眼,長吁一口氣:“原來是場噩夢啊……” “哼口芍!你這毒婦竟也來了箍铲?” 一聲冷哼從身側響起,我...
    開封第一講書人閱讀 36,973評論 0 259
  • 序言:老撾萬榮一對情侶失蹤鬓椭,失蹤者是張志新(化名)和其女友劉穎颠猴,沒想到半個月后,有當?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體小染,經(jīng)...
    沈念sama閱讀 43,466評論 1 300
  • 正文 獨居荒郊野嶺守林人離奇死亡翘瓮,尸身上長有42處帶血的膿包…… 初始之章·張勛 以下內容為張勛視角 年9月15日...
    茶點故事閱讀 35,937評論 2 323
  • 正文 我和宋清朗相戀三年,在試婚紗的時候發(fā)現(xiàn)自己被綠了裤翩。 大學時的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片春畔。...
    茶點故事閱讀 38,039評論 1 333
  • 序言:一個原本活蹦亂跳的男人離奇死亡,死狀恐怖岛都,靈堂內的尸體忽然破棺而出,到底是詐尸還是另有隱情振峻,我是刑警寧澤臼疫,帶...
    沈念sama閱讀 33,701評論 4 323
  • 正文 年R本政府宣布,位于F島的核電站扣孟,受9級特大地震影響烫堤,放射性物質發(fā)生泄漏。R本人自食惡果不足惜凤价,卻給世界環(huán)境...
    茶點故事閱讀 39,254評論 3 307
  • 文/蒙蒙 一鸽斟、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧利诺,春花似錦富蓄、人聲如沸。這莊子的主人今日做“春日...
    開封第一講書人閱讀 30,259評論 0 19
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽灭红。三九已至,卻和暖如春口注,著一層夾襖步出監(jiān)牢的瞬間变擒,已是汗流浹背。 一陣腳步聲響...
    開封第一講書人閱讀 31,485評論 1 262
  • 我被黑心中介騙來泰國打工寝志, 沒想到剛下飛機就差點兒被人妖公主榨干…… 1. 我叫王不留娇斑,地道東北人。 一個月前我還...
    沈念sama閱讀 45,497評論 2 354
  • 正文 我出身青樓材部,卻偏偏與公主長得像毫缆,于是被迫代替她去往敵國和親。 傳聞我的和親對象是個殘疾皇子败富,可洞房花燭夜當晚...
    茶點故事閱讀 42,786評論 2 345