SwiftUI:强制列表行根据内容调整高度
SwiftUI: Force List Row to adjust height to content
我在使用不会更改行高的列表时遇到了一些问题。我把它分成一个简单的例子。
这是完整的演示代码:
struct ContentView: View {
let items = ["item 1", "item 2", "item 3"]
@State var error: [String: String] = []
var body: some View {
List {
ForEach(self.items, id: \.self) { item in
VStack {
Text(item)
.padding()
if let e = error[item] {
Text(e)
}
}
.swipeActions(edge: .leading, allowsFullSwipe: true) {
Button(action: {
self.error[item] = "ERROR!"
}) {
Image(systemName: "square.and.arrow.up")
}.background(Color.blue)
}
}
}
}
}
我想在用户滑动单元格后在常规项目下方显示一条错误消息。不幸的是现在发生的是:
我希望它看起来像这样(为此我在代码中的 'error' 字典中添加了一个元素):
在我看来,这似乎是很多人都会遇到的问题,但我找不到关于这个问题的太多信息。我已经尝试了一些东西(例如“.fixedSize”修饰符),但我尝试过的任何东西都没有奏效,我将非常感谢对此的任何帮助或想法!
列表缓存创建的行,所以我们需要让它知道特定的行应该从头开始重建。可能的解决方案是根据与可选错误文本相同的条件使用 .id
。
测试 Xcode 13.2 / iOS 15.2
这里修改了部分代码(为演示添加了一些额外的代码):
.swipeActions(edge: .leading, allowsFullSwipe: true) {
Button(action: {
if nil == self.error[item] {
self.error[item] = "ERROR!"
} else {
self.error[item] = nil
}
}) {
Image(systemName: "square.and.arrow.up")
}.background(Color.blue)
}
.id(item + (self.error[item] ?? "")) // << here !!
我在使用不会更改行高的列表时遇到了一些问题。我把它分成一个简单的例子。
这是完整的演示代码:
struct ContentView: View {
let items = ["item 1", "item 2", "item 3"]
@State var error: [String: String] = []
var body: some View {
List {
ForEach(self.items, id: \.self) { item in
VStack {
Text(item)
.padding()
if let e = error[item] {
Text(e)
}
}
.swipeActions(edge: .leading, allowsFullSwipe: true) {
Button(action: {
self.error[item] = "ERROR!"
}) {
Image(systemName: "square.and.arrow.up")
}.background(Color.blue)
}
}
}
}
}
我想在用户滑动单元格后在常规项目下方显示一条错误消息。不幸的是现在发生的是:
我希望它看起来像这样(为此我在代码中的 'error' 字典中添加了一个元素):
在我看来,这似乎是很多人都会遇到的问题,但我找不到关于这个问题的太多信息。我已经尝试了一些东西(例如“.fixedSize”修饰符),但我尝试过的任何东西都没有奏效,我将非常感谢对此的任何帮助或想法!
列表缓存创建的行,所以我们需要让它知道特定的行应该从头开始重建。可能的解决方案是根据与可选错误文本相同的条件使用 .id
。
测试 Xcode 13.2 / iOS 15.2
这里修改了部分代码(为演示添加了一些额外的代码):
.swipeActions(edge: .leading, allowsFullSwipe: true) {
Button(action: {
if nil == self.error[item] {
self.error[item] = "ERROR!"
} else {
self.error[item] = nil
}
}) {
Image(systemName: "square.and.arrow.up")
}.background(Color.blue)
}
.id(item + (self.error[item] ?? "")) // << here !!