用React Native自定義一個導航欄

設計開發過程中，導航欄都會有所不同，這時候使用RN就需要自定義一個想要的導航欄了，RN中文網有講專門ios的導航欄（NavigatorIOS），可以不用自定義。

首先定義自定義導航欄的一些屬性的約束，記得npm install --save prop-types然後引入import PropTypes from 'prop-types';

然後設置邏輯，組裝出一個導航欄的模樣，下面這樣就是組裝好了左邊一個組件，中間一個標題或者組件，右邊一個組件的樣子，最後return：

這是上面自定義導航欄的樣式，還有兩個常量用於在不同系統顯示不同的高：

接下來只需要調用，並設置想要的屬性就行了：

發現狀態欄背景和導航欄不一樣，接下來改變狀態欄背景，使其一致：

創建一個常量，添加狀態欄的屬性設置，然後加入到propTypes中：

設置一些狀態欄的默認值：

在render中加入狀態欄：

在調用的地方設置狀態欄參數：

全部代碼：

到這裡呢就已經結束了，希望各位小夥伴能學到一些知識，小編在這裡呢整理了web前端的學習資料，想要學習的小夥伴趕緊行動起來吧，關注小編，私信【學習】，即可免費獲得哦！