Javascript 如何在React Native中使应用程序的背景色覆盖整个屏幕（使用样式）？

我正在通过snack.expo.io在React Native中为我的应用程序创建登录屏幕，但我无法使背景色填充整个屏幕。我试图使宽度和高度达到100%，但只有宽度起作用。我还尝试使用1的flex（我唯一的flex项），但也不起作用。我正在遵循本教程：。但更改了一些小方面，但无论如何，我都无法获得覆盖整个屏幕的背景

这是我的代码（全部在app.js中）

import*as React from'React'；
从“react native”导入{Text，TextInput，View，ScrollView，SecureTextEntry，StyleSheet，TouchableOpacity}；
从“expo常量”导入常量；
//可以从本地文件导入
从“./components/AssetExample”导入AssetExample；
//或npm中可用的任何纯javascript模块
从“react native paper”导入{Card}；
导出默认类App扩展React.Component{
陈述={
用户名：“”，
密码：“
}
render（）{
返回(
this.setState（{username:text}）}/>
this.setState（{password:text}）}/>
登录
);
}
}
const styles=StyleSheet.create({
容器：{
//弹性：1，
宽度：“100%”，
高度：“100%”，
背景颜色：“#003f5c”，
对齐项目：“居中”，
为内容辩护：“中心”，
},
标志：{
fontWeight：“粗体”，
尺寸：50，
颜色：“fb5b5a”，
marginBottom:40
},
输入视图：{
宽度：“80%”，
背景颜色：“465881”，
边界半径：25，
高度：“25%，//50像素
//玛金托普：20，
marginBottom:20，
辩护内容：“中心”，
填充：20
},
输入文本：{
身高：50，
颜色：“白色”
},
登录名：{
宽度：“60%”，
背景色：“fb5b5a”，
边界半径：25，
身高：“25%，//shoyld为50匹XL
对齐项目：“中心”，
辩护内容：“中心”，
玛金托普：20，
marginBottom:10
},
}); 

你只需要给出风格

<ScrollView contentContainerStyle={{flex:1}}>

看

---

您的输入高度将更大，因为您已经写入了屏幕的25%，所以只需相应地更改它。

为了帮助调试，您还可以附加输出的屏幕截图吗？

<ScrollView contentContainerStyle={{flex:1}}>