I'm trying to implement a list where I have 200 or 300 elements, and I want to change the color of the text on a hover event. But the app starts to show a delay on the hover events. Check the example code below:
struct ContentView: View {
var body: some View {
VStack {
ForEach(0...1000, id:\.self) {index in
Element()
}
}
}
}
struct Element: View {
@State private var hover = false
var body: some View {
Text("Not a fast hover!")
.foregroundColor(hover ? Color.blue : Color.white)
.onHover {_ in self.hover.toggle()}
}
}
UPDATE:
This seems to improve the responsiveness. Also if I change the background instead of the foreground color, the code is also more responsive.
struct Element: View {
@State private var hover = false
var body: some View {
ZStack {
Text("Not a fast hover!").foregroundColor(Color.blue)
Text("Not a fast hover!").opacity(hover ? 0 : 1).foregroundColor(Color.white)
}
.frame(width: 200)
.onHover {_ in self.hover.toggle()}
}
}
