SwiftUI Dynamic View Creation

Ashley Dube 0
Viewed 35

I need to create a dynamic list of TextFields with the press of a button. Once I'm done, that data will be sent to my node server as a JSON, hence the "Codable" protocol on the NumberList struct.

The issue I have currently is that after pressing one character on my keyboard, the keyboard dismisses and on it goes.

import SwiftUI

struct ContentView: View {
    
    @State var numberList: [NumberList] = []
    @State var numberTxt = 0
    
    var body: some View {

        VStack{
            ForEach(Array(numberList.enumerated()), id: \.element) { index, element in
                TextField("Number", text: $numberList[index].number)
            }
            
            Button {
                numberList.append(NumberList(number: ""))
            } label: {
                HStack{
                    Text("Add")
                    Image(systemName: "plus")
                }
            }

        }
        
    }
    
}

struct NumberList: Codable, Hashable{
    var id = UUID()
    var number: String
    
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}
swift5 swiftui swift
1 Answers

Thanx to the first comment, I got the solution from the link he provided. More details are here: How to create a List or a ForEach from a binding

//
//  ContentView.swift
//  DynamicViewCreation
//
//  Created by Ashley Dube on 2022/09/12.
//

import SwiftUI

struct ContentView: View {
    
    @State var numberList: [NumberList] = []
    @State var numberTxt = 0
    
    var body: some View {

        VStack{
            
            List($numberList){ $element in
                TextField("Number", text: $element.number)
            }
    
            // You'll most likely prefer the ForEach
            ForEach($numberList){ $element in
                TextField("Number", text: $element.number)
            }
            
            Button {
                numberList.append(NumberList(number: ""))
            } label: {
                HStack{
                    Text("Add")
                    Image(systemName: "plus")
                }
            }

        }
        
    }
    
}

struct NumberList: Codable, Identifiable{
    var id = UUID()
    var number: String
    
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}
Ashley Dube0
Related