Javascript 背景赢得'；不要填满屏幕

我正在尝试创建一个登录屏幕，但我找不到一种方法使背景填充整个屏幕。当我将颜色应用于背景时，它只到达我在屏幕上放置的最后一个视图

我试着把

style={{{flex:1}}

放在键盘上，避免看到父母，并试着将布局包装在

中

这似乎与键盘AvoidingView或ScrollView有关，但我不确定，也不知道还能做些什么

import React，{useState}来自“React”；
进口{
看法
文本，
键盘避免了gView，
文本输入，
样式表，
警觉的，
可触摸不透明度，
滚动视图，
}从“反应本族语”；
从“@expo/vector icons”导入{FontAwesome，Zocial}”；
从“反应本机安全区域上下文”导入{SafeAreaView}；
从“../../shared/SubmitButton”导入SubmitButton；
从“../../shared/StatusBar”导入FocusWareStatusBar；
从“../../shared/SelectionButton”导入SelectionButton；
从“./../db/AuthUser”导入{loginFirebase}；
//从“/firebase”导入{firebase}”；
const styles=StyleSheet.create({
背景：{
背景色：“fafafa”，
辩护内容：“中心”，
对齐项目：“中心”，
水平方向：16，
弹性：1，
},
登录信息：{
自我调整：“伸展”，
玛金托普：64，
},
投入：{
fontFamily：“机器人”，
尺寸：14，
颜色：“000”，
borderBottomColor:#DCDC“，
边框底部宽度：0.8，
填充底部：8，
paddingLeft:12，
},
loginSocialNetworkContainer：{
辩护内容：“中心”，
对准自己：“居中”，
背景颜色：“fff”，
标高：6，
边界半径：6，
marginBottom:8，
},
登录社交网络：{
内容：“中心”，
辩护内容：“中心”，
宽度：232，
身高：40，
边界半径：2，
},
loginSocialNetworkText：{
尺寸：12，
fontFamily：“机器人”，
颜色：#f7f7f7“，
},
});
导出默认函数登录（{navigation}）{
const[email，setEmail]=useState（“”）；
const[password，setPassword]=useState（“”）；
返回(
设置电子邮件（电子邮件）}
值={email}
/>
设置密码（密码）}
值={password}
/>
{
登录数据库（电子邮件、密码）；
}}
/>
{/*{loginFirebase（电子邮件、密码）}}>
按这里
*/}
{}}
>
entrarcomfacebook
{}}
>
entrarcomgoogle
);
}

您可以在背景样式中使用

高度：100vh

填充背景屏幕

vh

覆盖整个屏幕，与屏幕高度无关

  background: {
    backgroundColor: "#fafafa",
    justifyContent: "center",
    alignItems: "center",
    paddingHorizontal: 16,
    flex: 1,
    height: 100vh
  }

---

您还需要设置：

contentContainerStyle={{flex: 1}}

---

它将您的内容包装在一个内部组件中。

添加

flex:1

在父视图样式中，flex将定义项目如何“填充”主轴上的可用空间。空间将根据每个元素的flex属性进行划分。这是官方文档中没有的链接

它将您的内容包装在一个内部组件中，我想这就是为什么它被称为

contentContainerStyle