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

Posted 2023-04-18

【中文标题】如何将图标（图像，徽标..）添加到状态栏

【英文标题】：How to add icon (image, logo..) to the status bar

【发布时间】：2017-12-16 00:40:40

【问题描述】：

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

我希望在应用程序在后台运行时，在网络栏旁边连续显示一个图标（或者甚至只是一个小的宽度x高度方块）。我尝试将 View 组件与状态栏结合起来创建一个像这样的红色小矩形：

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


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

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

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

【问题讨论】：

你能添加一个截图来说明你的意思吗？

This 不在 React Native 中，但它应该能够让你走上正确的道路。基本上，您启动一​​个服务，然后从它发送一个通知。

在 android 上，除了通知之外，您无法在状态栏上放置任意图标。

看到这个问题：***.com/questions/3973208/…在应用程序运行时在状态栏中显示一个图标，包括在后台？

很遗憾，ios 不允许应用在状态栏中添加自定义图标

【参考方案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?

【参考方案2】：

Android状态栏有2种图标。

一种是来自 framework-res.apk 并提取到 /system/framework 的系统图标，您不能在没有提升权限的情况下更改这些图标在设备上并安装系统映像读/写。

另一种是前面提到的通知图标。 对于 iOS，你不能真正改变太多。

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

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

【参考方案3】：

您无法更改状态栏。 Apple 只允许您更改状态栏的外观。对于 ios 应用程序，全局更改外观可能对您有用。

打开 ReactNative 生成​​的 .xcproj 文件，然后：

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