如何解决如何使用SwiftUI动态添加文本字段如联系人?
我有一个表格,希望用户添加任意数量的促销代码。最接近的本机示例是在“联系人”应用程序中。请参阅add url
部分,该部分不需要“主页”或“主页”链接,但删除功能为:
如何用SwiftUI构造它,还是有推荐使用的解决方案?感谢您的帮助!
解决方法
所以这是非常快速和肮脏的,但是它应该使您对进入的方向有所了解:
struct PromoCodeView: View {
@State var codes = [String]()
func getBinding(forIndex index: Int) -> Binding<String> {
return Binding<String>(get: { codes[index] },set: { codes[index] = $0 })
}
var body: some View {
NavigationView {
Form {
Section(header: Text("Promo Codes")) {
ForEach(0..<codes.count,id: \.self) { index in
HStack {
Button(action: { codes.remove(at: index) }) {
Image(systemName: "minus.circle.fill")
.foregroundColor(.red)
.padding(.horizontal)
}
TextField("Promo Code",text: getBinding(forIndex: index))
}
}
Button(action: { codes.append("") }) {
HStack {
Image(systemName: "plus.circle.fill")
.foregroundColor(.green)
.padding(.horizontal)
Text("add promo code")
}
}
}
}
.navigationBarTitle("Codes")
}
}
}
看起来像这样:
编辑:
好的,所以我使它更加通用,因此您可以放下视图并为其绑定到字符串数组:
struct ListEditor: View {
var title: String
var placeholderText: String
var addText: String
@Binding var list: [String]
func getBinding(forIndex index: Int) -> Binding<String> {
return Binding<String>(get: { list[index] },set: { list[index] = $0 })
}
var body: some View {
Section(header: Text(title)) {
ForEach(0..<list.count,id: \.self) { index in
ListItem(placeholder: placeholderText,text: getBinding(forIndex: index)) { self.list.remove(at: index) }
}
AddButton(text: addText) { self.list.append("") }
}
}
}
fileprivate struct ListItem: View {
var placeholder: String
@Binding var text: String
var removeAction: () -> Void
var body: some View {
HStack {
Button(action: removeAction) {
Image(systemName: "minus.circle.fill")
.foregroundColor(.red)
.padding(.horizontal)
}
TextField(placeholder,text: $text)
}
}
}
fileprivate struct AddButton: View {
var text: String
var addAction: () -> Void
var body: some View {
Button(action: addAction) {
HStack {
Image(systemName: "plus.circle.fill")
.foregroundColor(.green)
.padding(.horizontal)
Text(text)
}
}
}
}
fileprivate struct TestButton: View {
var label: String
var action: () -> Void
var body: some View {
Button(action: action) {
Text(self.label)
.foregroundColor(.white)
.frame(width: 300,height: 75)
}
.background(Color.blue)
.cornerRadius(10)
.padding()
}
}
您可以像这样使用它:
struct TestView: View {
@State var codes = [String]()
var body: some View {
NavigationView {
Form {
ListEditor(title: "Promo Codes",placeholderText: "Promo Code",addText: "add promo code",list: $codes)
}
.navigationBarTitle("Codes")
}
}
}
它看起来与上面的GIF相同。
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。