使 React Native App 更具原生質感

非非白發表於2018-02-25

今天向大家推薦我的開源專案,一款為 react-native 打造的原生導航庫。由於導航方式是用原生元件實現的,所以體驗會比 react-navigation 稍好,此外,同樣的原因,使得 react-native 業務模組可以和原生業務模組完美契合。

使 React Native App 更具原生質感

這款導航庫名為 react-native-navigation-hybrid,正如名稱所暗示的那樣,它可以輕鬆實現原生頁面和 RN 頁面的相互跳轉和傳值,而且由於都使用原生的導航元件,所以即便是原生工程師,也難以辨認哪些頁面可能是由 react-native 實現的。

上圖是專案自帶的 demo, 展示本庫大部分功能。

博主也 fork 了一個比較受歡迎的 react-native app,並用 react-native-navigation-hybrid 替換了react-navigation。

閃屏 iOS 效果對照:

react-navigation react-native-navigation-hybrid
使 React Native App 更具原生質感 使 React Native App 更具原生質感

主頁面 Android 6.0 效果對照:

react-navigation react-native-navigation-hybrid
使 React Native App 更具原生質感 使 React Native App 更具原生質感

以下是原始碼:

改造前的 reading

改造後的 reading

react-native-navigation-hybrid

相關文章