react-native - React Native 如何更改显示 wifi 和时间的 iphone 顶部的颜色

Question

我无法更改显示 wifi 和时间的 iPhone 顶部的颜色，我想知道是否有人知道该怎么做。它不是后退按钮所在的部分，而是在用 wifi 和数据标志显示时间的地方。任何帮助将不胜感激。谢谢!

Answer 1

由于 iOS 没有状态栏的 backgroundColor 属性，我找到了一个不同的方法。

通常是状态栏的高度

• 44 代表安全的 iPhoneX
• 30 不安全的 iPhoneX
• 20 其他 iOS 设备
• Android 的 StatusBar.currentHeight

检查下面的示例代码并根据您的要求进行修改。这适用于 iOS 和 Android 设备。

import React, { Component } from "react";
import { View, StatusBar, Platform } from "react-native";

const STATUS_BAR_HEIGHT = Platform.OS === "ios" ? 20 : StatusBar.currentHeight;
const HEADER_HEIGHT = Platform.OS === "ios" ? 44 : 56;

export default class Example extends Component {
  render() {
    return (
      <View style={{ flex: 1 }}>
        <View style={{ height: STATUS_BAR_HEIGHT, backgroundColor: "#5E8D48" }}>
          <StatusBar
            translucent
            backgroundColor="#5E8D48"
            barStyle="light-content"
          />
        </View>
        <View style={{ backgroundColor: "#79B45D", height: HEADER_HEIGHT }} />
        <View style={{ flex: 1, backgroundColor: "#33373B" }}>
          {/* Display your content */}
        </View>
      </View>
    );
  }
}

希望对您有所帮助。如有疑问，请随意。