React native 使整个屏幕变黑

在react native（expo）中，我想在按下按钮时使整个屏幕变黑。我的意思是我想隐藏（在屏幕的所有区域（包括状态栏）顶部显示一个全黑的容器。有人知道我该怎么做吗？

试试这个：

<View style={{backgroundColor: 'black'}}>
    <Text style={{ color: "red" }}>Some Text</Text>
</View>

一些文本

是的，很简单

步骤1：使用主父视图容器包装所有内容

步骤2：尝试根据状态为其指定动态样式或内联样式

第三步：按下按钮更新状态，然后一旦状态改变，视图就会覆盖整个屏幕

步骤4：注意-使用尺寸。获取（“屏幕”）。高度，因为它将覆盖整个屏幕，包括状态栏

      constructor(props) {
        super(props);
        this.state = {
    makeScreenBlack : false
        };
      }

      render() {
    const {makeScreenBlack} = this.state;

        return (
    <React.Fragment>
    makeScreenBlack === true && <View style={styles.mainView}/>
    {this.props.children} //Whatever you want to render.
    <Button onPress = {() =>this.setState({makeScreenBlack : true})}/>
    <React.Fragment>
        );
      }


    export default StyleSheet.create({
      mainView: {
    height : Dimensions.get('screen').height,
width : Dimensions.get('screen').width,
    backgroundColor : 'black'
      },
    })

构造函数（道具）{
超级（道具）；
此.state={
makeScreenBlack:错误
};
}
render（）{
const{makeScreenBlack}=this.state；
返回(
makeScreenBlack===true&&
{this.props.children}//任何您想要渲染的内容。
this.setState（{makeScreenBlack:true}）}/>
);
}
导出默认样式表。创建({
主视图：{
高度：尺寸。获取（“屏幕”）。高度，
宽度：尺寸。获取（'screen'）。宽度，
背景颜色：“黑色”
},
})