在SwiftUI动态表单中声明Textfield和Togger [英] Declaring TextField and Toggle in a SwiftUI dynamic form
本文介绍了在SwiftUI动态表单中声明Textfield和Togger的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
4年后，我又回到了快速编程，一切都改变了。我一切都是从头学起。 我正在尝试解决一个变量绑定问题。我想用从API返回的字段构建一个动态表单。 代码：
import SwiftUI
struct Filter: Codable, Identifiable {
var id: Int
var name: String
var type: String
var defaultValue: Int
init(_ dictionary: [String: Any]) {
self.id = dictionary["id"] as? Int ?? 0
self.name = dictionary["name"] as? String ?? ""
self.type = dictionary["type"] as? String ?? ""
self.defaultValue = dictionary["defaultValue"] as? Int ?? 0
}
}
struct ContentView: View {
@State var filters:Array<Filter> = []
func load(){
guard let url = URL(string: "https://api.kierklosebastian.pl/") else {return}
let task = URLSession.shared.dataTask(with: url) { (data, response, error) in
guard let dataResponse = data,
error == nil else {
print(error?.localizedDescription ?? "Response Error")
return }
do {
let decoder = JSONDecoder()
let model = try decoder.decode([Filter].self, from:
dataResponse)
self.filters = model;
} catch let parsingError {
print("Error", parsingError)
}
}
task.resume()
}
var body: some View {
VStack{
Button(action: self.load, label: {
Text("Get json")
})
List{
ForEach(self.filters) { filter in
HStack{
Text("NAME: (filter.name)")
Text("TYPE: (filter.type)")
if filter.type == "textField" {
// TextField("", ???????)
}
if filter.type == "checkbox" {
// Toggle(isOn: ????????) {
// ""
// }
}
}
}
}
}
}
}
如何声明TextFiled和Togger变量？
推荐答案
Toggle需要有一个boolean绑定属性来确定切换是打开还是关闭。因此您需要为Filter定义某个布尔属性。
struct Filter: Codable, Identifiable {
var id: Int
var name: String
var type: String
var defaultValue: Int
var isOn: Bool = false
init(_ dictionary: [String: Any]) {
self.id = dictionary["id"] as? Int ?? 0
self.name = dictionary["name"] as? String ?? ""
self.type = dictionary["type"] as? String ?? ""
self.defaultValue = dictionary["defaultValue"] as? Int ?? 0
self.isOn = (dictionary["type"] as? String ?? "") == "checkbox"
}
}
创建符合ObservableObject的视图模型。
https://developer.apple.com/documentation/combine/observableobject
class FilterViewModel: ObservableObject {
@Published var filters:Array<Filter> = []
func load(){
guard let url = URL(string: "https://api.kierklosebastian.pl/") else {return}
let task = URLSession.shared.dataTask(with: url) { (data, response, error) in
guard let dataResponse = data,
error == nil else {
print(error?.localizedDescription ?? "Response Error")
return }
do {
let decoder = JSONDecoder()
let model = try decoder.decode([Filter].self, from:
dataResponse)
self.filters = model;
} catch let parsingError {
print("Error", parsingError)
}
}
task.resume()
}
}
并在ContentView中使用它而不是@State var filters:Array<Filter> = []。
struct FilterView: View {
@ObservedObject var viewModel = FilterViewModel()
-----
}
ForEach的内容创建一个新视图，并将viewModel和筛选器传递给它。在新视图中，查找当前筛选器的索引。
struct FilterDetailView: View {
@ObservedObject var viewModel: FilterViewModel
var filter: Filter
var indexOfFilter: Int {
self.viewModel.filters.firstIndex { $0 == filter}!
}
var body: some View {
HStack{
Text("NAME: (filter.name)")
Text("TYPE: (filter.type)")
if filter.type == "textField" {
TextField("TextField", text: self.$viewModel.filters[indexOfFilter].name)
}
if filter.type == "checkbox" {
Toggle(isOn: self.$viewModel.filters[indexOfFilter].isOn) {
Text("Toggle")
}
}
}
}
}
Equatable。否则，您不能使用firstIndex { $0 == filter}!
struct Filter: Codable, Identifiable, Equatable {
}
完整代码
struct Filter: Codable, Identifiable, Equatable {
var id: Int
var name: String
var type: String
var defaultValue: Int
var isOn: Bool = false
init(_ dictionary: [String: Any]) {
self.id = dictionary["id"] as? Int ?? 0
self.name = dictionary["name"] as? String ?? ""
self.type = dictionary["type"] as? String ?? ""
self.defaultValue = dictionary["defaultValue"] as? Int ?? 0
self.isOn = (dictionary["type"] as? String ?? "") == "checkbox"
}
}
class FilterViewModel: ObservableObject {
@Published var filters:Array<Filter> = []
func load(){
guard let url = URL(string: "https://api.kierklosebastian.pl/") else {return}
let task = URLSession.shared.dataTask(with: url) { (data, response, error) in
guard let dataResponse = data,
error == nil else {
print(error?.localizedDescription ?? "Response Error")
return }
do {
let decoder = JSONDecoder()
let model = try decoder.decode([Filter].self, from:
dataResponse)
self.filters = model;
} catch let parsingError {
print("Error", parsingError)
}
}
task.resume()
}
}
struct FilterView: View {
@ObservedObject var viewModel = FilterViewModel()
var body: some View {
VStack{
Button(action: self.viewModel.load, label: {
Text("Get json")
})
List{
ForEach(self.viewModel.filters) { filter in
FilterDetailView(viewModel: viewModel, filter: filter)
}
}
}
}
}
struct FilterDetailView: View {
@ObservedObject var viewModel: FilterViewModel
var filter: Filter
var indexOfFilter: Int {
self.viewModel.filters.firstIndex { $0 == filter}!
}
var body: some View {
HStack{
Text("NAME: (filter.name)")
Text("TYPE: (filter.type)")
if filter.type == "textField" {
TextField("TextField", text: self.$viewModel.filters[indexOfFilter].name)
}
if filter.type == "checkbox" {
Toggle(isOn: self.$viewModel.filters[indexOfFilter].isOn) {
Text("Toggle")
}
}
}
}
}
iOS 15+
ForEach(self.viewModel.filters) { $filter in
-----
}
Toggle(isOn: $filter.isOn) {
Text("Toggle")
}
如果您感兴趣，请观看SwiftUI-WWDC21中的新功能(08：00)并遵循Apple的SwiftUI教程
- https://developer.apple.com/videos/play/wwdc2021/10018/
- https://developer.apple.com/tutorials/SwiftUI
这篇关于在SwiftUI动态表单中声明Textfield和Togger的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
