一、StatusBar組件介紹
- StatusBar 是 React Native 0.20 起新增的跨平台組件，它可以用來設置並動態改變設備的狀態欄顯示特性。
- StatusBar 組件可以同時加載多個 StatusBar 組件，這些 StatusBar 組件的屬性可以按照加載的順序進行合並。一種常見的用法就是：我們可以在使用 Navitator 的時候，針對不同的路由頁面設置特殊的狀態欄樣式。
- 雖然 StatusBar 是跨平台組件，但其中有些屬性是通用的，而有些則是 iOS 或 Android 獨有的。所以我們開發時要做好適配。
二、通用屬性介紹
1.animated
-
設置當狀態欄的狀態發生變化時，是否需要加入動畫。
-
動畫支持 backgroundColor、barStyle 和 hidden 屬性的變化。
2.hidden
設置狀態欄是否隱藏。
三、僅支持iOS的屬性
1.barStyle
用於設置狀態欄文字的顏色，其值是枚舉類型:
default：黑色文字（默認）
light-content：白色文字
<StatusBar barStyle={'light-content'} />
2.networkActivityIndicatorVisible
設定網絡活動指示器(就是那個菊花)是否顯示在狀態欄。
<StatusBar networkActivityIndicatorVisible={true} /> 3.showHideTransition
通過 hidden 屬性來顯示或隱藏狀態欄時所使用的動畫效果，有兩種選擇：fade（默認值）、slide
四、僅支持Android的屬性
1.backgroundColor
Android 設備上狀態欄的背景顏色
<StatusBar backgroundColor={'blue'} />
2.translucent
設置狀態欄是否為透明。
當狀態欄的值為 true 的時候，應用將會在狀態欄下面進行繪制顯示。這樣在 Android 平台上面就是沉浸式的效果，可以達到 Android 和 iOS 應用顯示效果的一致性。
該值常常同配置半透明效果的狀態欄顏色一起使用。
<StatusBar translucent={true} /> 3.StatusBar.currentHeight
React Native 在 Android 平台為 StatusBar 組件提供了一個靜態常量 currentHeight，我們可以通過讀取這個常量來得到 Android 手機狀態欄的高度。
注意：currentHeight 不是一個屬性，我們直接訪問 StatusBar.currentHeight 就可以了。
五、不同平台下狀態欄的處理
1、Android 手機狀態欄
- 當狀態欄呈現在 Andorid 手機屏幕頂部時，它會占用頂部這個空間，我們只能使用剩下的屏幕空間。也就是說如果從第 0 行開始放置組件時，組件會緊貼着狀態欄的下邊沿顯示。
- 要想知道實際可用的屏幕高度，可以通過手機屏幕的高度減去狀態欄高度得到。
2、iOS 手機狀態欄
- 在 iOS 平台上，取得的屏幕高度就是實際可使用的高度。
- 如果從第 0 行開始排列組件時，組件會緊貼着手機屏幕的最上沿顯示。如果狀態欄沒有被隱藏，它將覆蓋在第 0 行組件的上方。
- 如果不想設置狀態欄隱藏，則應當空出狀態欄的顯示區域。但可以為這個區域設置背景色，以使整個界面風格統一。