添加填充时,SwiftUi文字停止包裹线路
在下面的代码(在MacOS 12.4上运行)中,我试图用一些堆叠的text
视图显示Sheet
。如屏幕截图所示,最后一行没有包装。奇怪的是,如果我在文本上有填充
上面的两个视图 it(请参阅代码中的注释),则可以触发某些内容,而text> text
包装。这对我来说似乎很奇怪,所以我认为我不能依靠它。
谁能解释这种行为,并提出一种确保文本包裹而不是截断的方法?
struct ContentView: View {
@State var showSheet = false
var body: some View {
VStack {
Button("Test Sheet") {
showSheet = true
}
}
.frame(minWidth: 400, minHeight: 300)
.sheet(isPresented: $showSheet) {
TestSheet {
showSheet = false
}
}
}
}
struct TestSheet: View {
let dismiss: () -> Void
var body: some View {
VStack(spacing: 0) {
VStack(alignment: .leading) {
let msg = "Longer message. Blah blah blah blah blah, blah blah blah blah, blah blah blah blah blah blah blah blah, blah blah."
Text("Delete?").font(.title).padding(8).frame(maxWidth: .infinity, alignment: .center)
Text(verbatim: msg)
// .padding(.top, 6) <-- uncomment this and it works. ???
Text("Do you want to delete them?").padding(.top, 6)
Text(verbatim: "They can be undeleted later, until you 'Purge Deleted Items'.")
.lineLimit(nil)
.padding(.top, 6)
}
.padding()
Divider()
HStack {
Button("Cancel", role: .cancel) { dismiss() }
}.padding()
}
.frame(width: 300)
}
}
它的屏幕截图未按需要包装:

In the code below, running on macOS 12.4, I'm trying to display a sheet
with a few stacked Text
views. As shown in the screenshot, the last line is not wrapping. Strangely, if I had a padding on the Text
two views above it (see comment in code), that triggers something, and the Text
wraps. This seems bizarre and buggy to me, so I don't think I can rely on it.
Can anyone explain this behavior, and suggest a way to ensure the text wraps instead of truncates?
struct ContentView: View {
@State var showSheet = false
var body: some View {
VStack {
Button("Test Sheet") {
showSheet = true
}
}
.frame(minWidth: 400, minHeight: 300)
.sheet(isPresented: $showSheet) {
TestSheet {
showSheet = false
}
}
}
}
struct TestSheet: View {
let dismiss: () -> Void
var body: some View {
VStack(spacing: 0) {
VStack(alignment: .leading) {
let msg = "Longer message. Blah blah blah blah blah, blah blah blah blah, blah blah blah blah blah blah blah blah, blah blah."
Text("Delete?").font(.title).padding(8).frame(maxWidth: .infinity, alignment: .center)
Text(verbatim: msg)
// .padding(.top, 6) <-- uncomment this and it works. ???
Text("Do you want to delete them?").padding(.top, 6)
Text(verbatim: "They can be undeleted later, until you 'Purge Deleted Items'.")
.lineLimit(nil)
.padding(.top, 6)
}
.padding()
Divider()
HStack {
Button("Cancel", role: .cancel) { dismiss() }
}.padding()
}
.frame(width: 300)
}
}
Screenshot of it not wrapping as desired:
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
尝试将以下标记为
text
view:.fixedSize(horizontal:false,vertility:true)
我知道它看起来是违反直觉的,我想要我的垂直,尺寸固定而不是我的水平尺寸固定,不是吗?因此,您需要忽略它,但坚持其现在包裹的垂直理想尺寸。
Try tagging the following to the end of your
Text
view:.fixedSize(horizontal: false, vertical: true)
I know it looks counter-intuitive, 'I want my vertical size fixed rather than my horizontal size fixed, don't I?', but the text view gives its 'ideal' width as its non-wrapped (i.e. single line) width. Therefore, you need to ignore that, but insist on its now wrapped vertical ideal size instead.