swift - 如何在 SwiftUI 中将文本与屏幕顶部对齐
问题描述
我正在尝试将“顶部文本”与屏幕顶部对齐,但找不到方法。“顶部文字”需要在 iphone 屏幕的“缺口”附近对齐。
我附上了“顶部文本”当前位置的屏幕截图,需要移到顶部
struct ContentView: View {
//var newColor : [String: Double] = setColor(red:247, green:186, blue:161)
var body: some View {
ZStack {
VStack(spacing: 0) {
HStack {
Text("Top Text[![enter image description here][1]][1]")
.fontWeight(.light)
.multilineTextAlignment(.center)
.frame(minWidth: 0, maxWidth: .infinity, minHeight: 100)
.font(.body)
.padding()
}
.offset(y: 0)
.frame(minWidth: 0, maxHeight: 400, alignment: .topLeading)
VStack {
Text("Sign in with Facebook")
.fontWeight(.light)
.font(.title)
.frame(minWidth: 0, maxWidth: .infinity, maxHeight: 50)
.padding(EdgeInsets.init(top: 0, leading: 0, bottom: 0, trailing: 0))
Text("Sign in with Google")
.fontWeight(.light)
.font(.title)
.padding()
.frame(minWidth: 0, maxWidth: .infinity, maxHeight: 50)
}
}
.foregroundColor(Color.black.opacity(0.7))
.padding()
.frame(minWidth: 0, maxWidth: .infinity, minHeight: 0, maxHeight: .infinity, alignment: .leading)
.offset(x: 0, y: 0)
}
.frame(minWidth: 0, maxWidth: .infinity, minHeight: 0, maxHeight: .infinity, alignment: .leading)
.background(Color.orange.opacity(0.2))
.edgesIgnoringSafeArea(.all)
}
}
解决方案
你可以Spacer()
在你的HStack
和之间放一个VStack
。不过,这会将其他文本推到底部。Spacer()
您可以在底部 s 之后放置另一个Text
以将它们向上推。
下面是基本相同的视图,代码更少:
var body: some View {
ZStack {
Color(.orange).opacity(0.2).edgesIgnoringSafeArea(.all)
VStack(spacing: 10) {
Text("Top Text[![enter image description here][1]][1]")
.fontWeight(.light)
.multilineTextAlignment(.center)
.font(.body)
.padding()
Spacer()
Text("Sign in with Facebook")
.fontWeight(.light)
.font(.title)
Text("Sign in with Google")
.fontWeight(.light)
.font(.title)
Spacer()
}
.foregroundColor(Color.black.opacity(0.7))
.padding()
}
}
推荐阅读
- sharepoint - 具有 4 个条件的 CAML 查询将引发此错误“无法完成此操作。\n\n请重试。”
- python - Web Scraping 问题,使用 BeautifulSoup 库返回空列表
- c# - 如何统一停止触发动画?
- javascript - 带切换的响应式垂直/水平标题表
- javascript - 我究竟做错了什么?从下拉列表中获取选择。Javascript
- javascript - 如何使用jQuery将jsp文件包含在另一个jsp文件中
- discord - 不和谐自我机器人慢
- android-studio - “没有广告配置。” 尝试加载广告时的 onAdFailedToLoad() 方法
- java - 用于 Java 日志记录的净化信息模式
- css - 如何将此引导登录表单移动到视口中心