状态栏添加额外的React-native填充

Question

我尝试向应用程序添加状态栏，它在React-Navigation标头上添加了额外的填充

状态条形码

const STATUSBAR_HEIGHT = Platform.OS === 'ios' ? 30 : StatusBar.currentHeight;
const NotificationBar = ({ backgroundColor, ...props }) => ({
  ...(Platform.OS == 'ios' ? (
    <View style={{ backgroundColor, height: 30 }}>
      <StatusBar translucent backgroundColor={backgroundColor} {...props} />
    </View>
  ) : (
    <StatusBar translucent backgroundColor={backgroundColor} {...props} />
  )),
});

const styles = StyleSheet.create({
  statusBar: {
    height: STATUSBAR_HEIGHT,
  },
});

app.js

 <Provider store={store}>
      <NotificationBar
        backgroundColor={Colors.SAPrimaryx}
        barStyle="light-content"
      />
      <PersistGate persistor={persistor}>
        <RootRouter />
      </PersistGate>
 </Provider>

我该如何解决？

Answer 1

您不应该设置View高度，它会增加额外的高度。您可以遵循此文档https://reactnavigation.org/docs/en/status-bar.html