英文:
How can I create a view with a mixture of Text and TextFields dynamically in SwiftUI
问题
以下是您要翻译的内容:
问题出在我需要能够在SwiftUI中创建一个视图,它看起来像一句文本,但其中有一些空白,用户可以输入自己的文本。我还需要一种方法来捕获绑定中输入的文本,但不确定如何在循环中进行多个绑定。
我尝试了一些选项,最接近的是使用LazyGrid,但由于间距问题,它看起来不像普通的句子。
struct MultiText: View {
@State var text = "There was once a {-} that only had {-} in it. How did they get in? {-}"
@State var answerText: String = "XXXXXXX"
let rows = [
GridItem(.adaptive(minimum: 80))
]
var body: some View {
LazyVGrid(columns: rows, spacing: 0, alignment: .leading) {
ForEach(text.components(separatedBy: " "), id: \.self) { component in
if component == "{-}" {
TextField("", text: $answerText
)
} else {
Text(component)
}
}
}
}
}
这会产生以下结果
任何帮助都将不胜感激。
英文:
The issue I am encountering is, I need to be able to create a view in SwiftUI that looks like a sentence of text but has blanks where the user can enter their own text. I also need a way to be able to capture the entered text from the binding, but not sure how to do multiple bindings in a loop.
Ive tried a few options and the closest I have got is using LazyGrid, but it doesn't look like a normal sentence due to spacing?
struct MultiText: View {
@State var text = "There was once a {-} that only had {-} in it. How did they get in? {-}"
@State var answerText: String = "XXXXXXX"
let rows = [
GridItem(.adaptive(minimum: 80))
]
var body: some View {
LazyVGrid(columns: rows, spacing: 0, alignment: .leading) {
ForEach(text.components(separatedBy: " "), id: \.self) { component in
if component == "{-}" {
TextField("", text: $answerText
)
} else {
Text(component)
}
}
}
}
}
This produces the following result
Any help appreciated
答案1
得分: 0
在ForEach中使用适当的id,这样可以帮助:
import SwiftUI
struct Item: Identifiable {
var id = UUID()
var value: String
}
struct MultiText: View {
@State var text = "There was once a {-} that only had {-} in it. How did they get in? {-}"
@State var answerText: String = "XXXXXXX"
let rows = [
GridItem(.adaptive(minimum: 80))
]
var body: some View {
LazyVGrid(columns: rows, alignment: .leading, spacing: 0) {
ForEach(text.components(separatedBy: " ").map { Item(value: $0) }, id: \.id) { component in
if component.value == "{-}" {
TextField("", text: $answerText)
} else {
Text(component.value)
}
}
}
}
}
这样你就可以在ForEach中使用多个TextField。
我认为这也可能有所帮助:
英文:
I think can help use appropriate id's in ForEach:
import SwiftUI
struct Item: Identifiable {
var id = UUID()
var value: String
}
struct MultiText: View {
@State var text = "There was once a {-} that only had {-} in it. How did they get in? {-}"
@State var answerText: String = "XXXXXXX"
let rows = [
GridItem(.adaptive(minimum: 80))
]
var body: some View {
LazyVGrid(columns: rows, alignment: .leading, spacing: 0) {
ForEach(text.components(separatedBy: " ").map{Item(value: $0)}, id: \.id) { component in
if component.value == "{-}" {
TextField("", text: $answerText
)
} else {
Text(component.value)
}
}
}
}
}
In this way you have multiple TextField.
I think also this can help:
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库,让每个人都能够通过互相帮助和分享经验来进步。
评论