I know it's a simple question, but I haven't found an answer. I want to understand the underlying concept.
I'm trying to update a ForEach with a non constant range, the closing parameter is a variable that is assigned to a button.
The variable is assigned with a @State so it's supposed to refresh the view. Somehow it's not working.
import SwiftUI
struct ContentView: View {
@State private var numberOfTimes = 5
let timesPicker = [2,5,10,12,20]
@State private var tableToPractice = 2
enum answerState {
case unanswered
case wrong
case right
}
func listRange(){
}
var body: some View {
NavigationView{
HStack{
VStack{
Form{
Section {
Picker("Tip percentage", selection: $numberOfTimes) {
ForEach(timesPicker, id: \.self) {
Text($0, format: .number)
}
}
.pickerStyle(.segmented)
} header: {
Text("How many times do you want to practice?")
}
Section{
Stepper("Table to practice: \(tableToPractice.formatted())", value: $tableToPractice, in: 2...16 )
}
Button("Start Now", action: listRange).buttonStyle(.bordered)
List{
ForEach(0..<numberOfTimes){
Text("Dynamic row \($0)")
}
}
}.foregroundColor(.gray)
}
}
}
}
}
struct ContentView_Previews: PreviewProvider {
static var previews: some View {
ContentView()
}
}
CodePudding user response:
The problem is that the range is not identified. Lets make some rows
struct Row: Identifiable {
let id = UUID()
}
Then set up an array of identifiable items
@State private var numberOfTimes = 5
@State private var rows = Array(repeating: Row(), count: 5)
Now you can have a responsive list
List{
ForEach(rows) { row in
Text("Dynamic row")
}
}
Call the on change update to recreate the array
.onChange(of: numberOfTimes) { newValue in
rows = Array(repeating: Row(), count: newValue)
numberOfTimes = newValue
}
the onChange should be called on the Form.
This will make more sense when you have better view model data, see apple documentation for a more in depth example.
This is for lazy v stack, but the data model setup is what I'm thinking of
https://developer.apple.com/documentation/swiftui/grouping-data-with-lazy-stack-views