1. 程式人生 > >Android動態控制狀態列以及系統導航欄顯示和隱藏

Android動態控制狀態列以及系統導航欄顯示和隱藏

其實說到沉浸式狀態列這個名字我也是感到很無奈,真不知道這種叫法是誰先發起的。因為Android官方從來沒有給出過沉浸式狀態列這樣的命名,只有沉浸式模式(Immersive Mode)這種說法。而有些人在沒有完全瞭解清楚沉浸模式到底是什麼東西的情況下,就張冠李戴地認為一些系統提供的狀態列操作就是沉浸式的,並且還起了一個沉浸式狀態列的名字。

比如之前就有一個QQ群友問過我,像餓了麼這樣的沉浸式狀態列效果該如何實現?

這裡寫圖片描述

這個效果其實就是讓背景圖片可以利用系統狀態列的空間,從而能夠讓背景圖和狀態列融為一體。

本篇文章當中我會教大家如何實現這樣的效果,但這個真的不叫沉浸式狀態列。因此,這算是一篇技術+普及的文章吧,講技術的同時也糾正一下大家之前錯誤的叫法。

什麼是沉浸式?

先來分析一下叫錯的原因吧,之所以很多人會叫錯,是因為根本就不瞭解沉浸式是什麼意思,然後就人云亦云跟著叫了。那麼沉浸式到底是什麼意思呢?

根據百度百科上的定義,沉浸式就是要給使用者提供完全沉浸的體驗,使使用者有一種置身於虛擬世界之中的感覺。

比如說現在大熱的VR就是主打的沉浸式體驗。

那麼對應到Android作業系統上面,怎樣才算是沉浸式體驗呢?這個可能在大多數情況下都是用不到的,不過在玩遊戲或者看電影的時候就非常重要了。因為遊戲或者影視類的應用都希望能讓使用者完全沉浸在其中,享受它們提供的娛樂內容,但如果這個時候在螢幕的上方還顯示一個系統狀態列的話,可能就會讓使用者分分鐘產生跳戲的感覺。

那麼我們來看一下比較好的遊戲都是怎麼實現的,比如說海島奇兵:

這裡寫圖片描述

海島奇兵的這種模式就是典型的沉浸式模式,它的整個螢幕中顯示都是遊戲的內容,沒有狀態列也沒有導航欄,使用者玩遊戲的時候就可以完全沉浸在遊戲當中,而不會被一些系統的介面元素所打擾。

然後我們再來看一下愛奇藝的實現:

這裡寫圖片描述 

同樣也是類似的,愛奇藝將整個螢幕作為影視的展示區,使用者在看電影的時候眼中就只會有電影的內容,這樣就不會被其他一些無關的東西所分心。

這才是沉浸式模式的真正含義,而所謂的什麼沉浸式狀態列純粹就是在瞎叫,完全都沒搞懂“沉浸式” 這三個字是什麼意思。

不過雖然聽上去好像是很高大上的沉浸式效果,實際看上去貌似就是將內容全屏化了而已嘛。沒錯,Android沉浸式模式的本質就是全屏化,不過我們今天的內容並不僅限於此,因為還要實現餓了麼那樣的狀態列效果。那麼下面我們就開始來一步步學習吧。

隱藏狀態列 

這裡寫圖片描述

可以看到,有狀態列、ActionBar、導航欄等。而打造沉浸式模式的使用者體驗,就是要將這些系統元素全部隱藏,只留下主體內容部分。

比如說我現在新建了一個空專案,然後修改佈局檔案中的程式碼,在裡面加入一個ImageView,如下所示:

?
1 2 3 4 5 6 7 8 9 10 11 12 <RelativeLayout android:layout_width="match_parent" android:layout_height="match_parent"> <ImageView android:layout_width="match_parent" android:layout_height="match_parent" android:src="@drawable/bg" android:scaleType="centerCrop" /> </RelativeLayout>

這裡將ImageView的寬和高都設定成match_parent,讓圖片充滿螢幕。現在執行一下程式,效果如下圖所示。

這裡寫圖片描述  

如果你將圖片理解成遊戲或者電影介面的話,那這個體驗離沉浸式就差得太遠了,至少狀態列和ActionBar得要隱藏起來了吧?沒關係,我們一步步進行優化,並且在優化中學習。

隱藏狀態列和ActionBar的方式在4.1系統之上和4.1系統之下還是不一樣的,這裡我就不準備考慮4.1系統之下的相容性了,因為過於老的系統根本就沒有提供沉浸式體驗的支援。

修改MainActivity中的程式碼,如下所示:

?
1 2 3 4 5 6 7 8 9 10 11 12 public class MainActivity extends AppCompatActivity {