如何将图标（图像，徽标..）添加到状态栏

Question

我注意到StatusBar组件（React Native）没有任何道具包含本文档中的任何类型的图标或徽标： https://facebook.github.io/react-native/docs/statusbar.html#statusbar

我想在应用程序在后台运行时，一个图标（或者甚至只是一个小的widthxheight方块）连续出现在网络栏旁边。我尝试将View组件与状态栏组合在一起，创建一个如下所示的小红色矩形：

      <View style={styles.container}>
        <StatusBar
          backgroundColor="blue"
          barStyle="light-content"
        />
      </View>
    );
  }
}

const styles = StyleSheet.create({
  container: {
   width: 20,
   height: 20,
   backgroundColor: 'red'
  }
}) 

然而，红色方块刚出现在状态栏下方。有任何想法吗？

编辑： 我想要的是即使应用程序在后台，也可以在状态栏上显示我的应用程序徽标。 （提供VPN和位置服务的应用有时会这样做。）

Answer 1

对于iOS，无法在状态栏中添加任何自定义图标，Apple不允许这样做。

对于Android，您应该使用通知和通知管理器。只需在java中编写一个本机模块，在启动应用程序时执行此操作。 React Native允许您调用用Java编写的Native Module，看看https://facebook.github.io/react-native/docs/native-modules-android.html

您还应该阅读此通知How to show an icon in the status bar when application is running, including in the background?

Answer 2

Android状态栏中有两种图标。

一种是来自 framework-res.apk 并提取到 / system / framework 的系统图标，你无法在没有一些的情况下改变它们提升设备权限并安装系统映像读/写。

另一种是之前提到的通知图标。 对于iOS，你真的无法改变。

您的屏幕截图显示了这两种类型，并且您希望将图标放在网络栏图标旁边，但这些是系统图标（在Android上）

Here is a plugin处理通知（和通知图标）两个平台并包装所有内容，易于使用并做出反应 您可以找到适用于iOS通知的示例本机代码here和Android here：

Answer 3

您无法更改状态栏。 Apple仅允许您更改状态栏的外观。对于ios应用程序，可能会在全球范围内更改外观。

打开由ReactNative生成的.xcproj文件：

1. 在您的Info.plist中，您需要设置＆＃34;查看基于控制器的状态栏外观＆＃34;到布尔值。
2. 将其设置为NO设置AppDelegate中的样式，在 didFinishLaunchingWithOptions 函数中添加此代码：UIApplication.sharedApplication().setStatusBarStyle(UIStatusBarStyle.LightContent, animated: true)