Here is an experiment I did...
TextItem is the item I want to display in a list. For grins I gave it a property called tapped.
TextItemView is a View for presenting a TextItem.
Finally, there is TextListView for presenting the list of TextItemViews.
This code as written does display the list of items. And the onTapGesture is fired whenever an item is clicked. However, the background color of the TextItemView does not change. Why not? Because the view is not refreshed. I force a refresh of the view by changing the refresh state variable in TextListView. However, that has no effect. Why is this the case?
Turns out that the refresh state variable is not used in the body of the TextListView. If I simply add a Text struct to the VStack to display refresh, then the TextListView is updated whenever refresh is changed in the onTapGesture.
That said, this is not a satisfactory solution. I can click on items and change toggle their background color with each click. However, this needs to be coordinated with all the other items in the list. To do this I have to write code to turn off of the tapped state of each item and then set the selected items tapped state to true.
import SwiftUI
class TextItem: Identifiable {
var id = UUID()
var name: String = ""
var tapped = false
init(name: String) {
self.name = name
}
}
struct TextItemView: View {
var item: TextItem
var body: some View {
Text("\(item.name)")
}
}
struct TextListView: View {
var Items: [TextItem] = []
@State private var refresh = 0;
var body: some View {
VStack {
List(Items) {item in
if item.tapped {
TextItemView(item: item)
.onTapGesture {
print("tap")
item.tapped.toggle()
self.refresh += 1
}.background(Color.blue)
} else {
TextItemView(item: item)
.onTapGesture {
print("tap")
item.tapped.toggle()
self.refresh += 1
}.background(Color.white)
}
}
}
}
Topic:
UI Frameworks
SubTopic:
SwiftUI
Tags: