在 React Native 中更改状态栏颜色

问题描述

在 React Native 中,我试图将状态栏设置为“light-content”,以便在较暗的背景下更清晰可见。为此,我使用了 ,但是当我运行代码时出现以下错误


RCTStatusBarManager module requires that the                 UIViewControllerBasedStatusBarappearance key in the Info.plist is set to NO
-[RCTStatusBarManager setStyle:animated:]
    RCTStatusBarManager.mm:157
__invoking___
-[NSInvocation invoke]
-[NSInvocation invokeWithTarget:]
-[RCTModuleMethod invokeWithBridge:module:arguments:]
facebook::react::invokeInner(RCTBridge*,RCTModuleData*,unsigned int,folly::dynamic const&)
facebook::react::RCTNativeModule::invoke(unsigned int,folly::dynamic&&,int)::$_0::operator()() const
invocation function for block in facebook::react::RCTNativeModule::invoke(unsigned int,int)
_dispatch_call_block_and_release
_dispatch_client_callout
_dispatch_main_queue_callback_4CF
__CFRUNLOOP_IS_SERVICING_THE_MAIN_disPATCH_QUEUE__
__CFRunLoopRun
CFRunLoopRunSpecific
GSEventRunModal
-[UIApplication _run]
UIApplicationMain
main
start
0x0

我进入 info.plist 页面并根据错误消息将 UIViewControllerBasedStatusBarappearance 设置为 false,但仍然没有做任何事情。

解决方法

在 iOS 上,您只能通过 https://reactnative.dev/docs/statusbar#barstyle

更改 StatusBar 的 theme

在 Android 上,您可以使用 backgroundColor props https://reactnative.dev/docs/statusbar#backgroundcolor-android