Android 和 React Native 顶部导航栏

Question

我想问你关于下面图片中选择的部分。

这个部分的名称是什么，我如何在 React Native 中设置它的样式？现在我的 APK 有一个难看的白条，我看不到电池或 WiFi 的水平。

Answer 1

包含电池和时间的区域称为状态栏。在我见过的大多数情况下，状态栏会根据 ReactNativePlatform模块的平台设置高度。

之后，您可以将此高度传递给 a<View>并添加其他样式。

import { Platform, ... } from 'react-native'

...code...

const STATUS_BAR_HEIGHT = Platform.select({ ios: 20, android: 24 })

export default class MyComponent extends Component {

  ...code...

  render() {
    <View style={{ height: STATUS_BAR_HEIGHT, ...more styles here... }} />
    <View>

      ...code...

    </View>
  }
}