使用 react-native 在 iOS 中设置半透明状态栏

Posted 2023-04-18

【中文标题】使用 react-native 在 iOS 中设置半透明状态栏

【英文标题】：Set translucent statusBar in iOS with react-native

【发布时间】：2016-08-18 16:20:34

【问题描述】：

我试图在带有 React-Native 的 ios 上没有半透明（默认）状态栏，但似乎这个选项只在 android 上可用？

class THapp extends Component 
  render() 
    return (
      <View style=styles.container>
        <StatusBar translucent=false backgroundColor="rgba(0, 0, 0, 1)" barStyle="default"/>
        <Tabs></Tabs>
      </View>
    );
  

【参考方案1】：

您可能以其他方式解决了这个问题，但我也遇到了同样的问题。就处理这个问题而言，我正在实现与平台无关的 marginTop 或 paddingTop。

import Platform from 'react-native';
// Status bar height on iOS is 20 dpi
const marginTop = Platform.OS === 'ios' ? 20 : 0;

【讨论】：

有趣的解决方案，目前我只为 iOS 构建，但这将有助于我将来适应 Android！