Question

我知道自API 21以来可以更改导航栏的颜色。我查看了React Native的文档，但我找不到这样做的方法。

我知道的唯一方法是创建一个本机模块，但这似乎不是一个好的解决方案，因为我使用的是Expo。

有没有内置方法可以做到这一点？

Answer 1

好吧，我已经制作了一个插件，因为它是完全用来实现你想要的。

https://github.com/BhavanPatel/react-native-navbar-color

https://www.npmjs.com/package/react-native-navbar-color

Answer 2

以下是另一种选择。它有最近的提交。

react-native-navigation-bar-color

https://github.com/thebylito/react-native-navigation-bar-color

Answer 3

（对于那些使用react-native-cli的用户），只需将<item name="android:navigationBarColor">#0D0D0D</item> 添加到android/app/src/main/res/values/styles.xml中的样式中，例如：

<style name="AppTheme" parent="Theme.AppCompat.Light.NoActionBar">
    <item name="android:textColor">#000000</item>
    <item name="android:navigationBarColor">#0D0D0D</item> <!--  ADD THIS LINE TO YOUR styles.xml    -->
</style>

Answer 4

我创建了一个包含颜色替换等功能的包。

react-native-system-navigation-bar

安装

yarn add react-native-system-navigation-bar

或

npm install react-native-system-navigation-bar

链接

https://www.npmjs.com/package/react-native-system-navigation-bar

https://github.com/kadiraydinli/react-native-system-navigation-bar

Answer 5

更改Android设备状态栏和导航栏背景颜色的其他可能方法是通过StatusBar模块和NativeModules

我已经发布了关于 Android NaigationBar 的回答，您可以查看 this

更改导航栏颜色

5 个答案: