I am using many TextFields in my SwiftUI Mac OS app. I am a main form, where the user adds data, which is composed of multiple Stacks/ views which contain TextFields/ and Text()
I noticed a strange bug, when I am using many TextFields combined in different views, I get some very heavy lags when selecting the TextField. Also when I skip to the next one with Tab it takes time.
It is really strange behavior and I am not sure what is causing that. I have a different view with many TextFields aswell, where everything is working smooth.
Also sometimes I can not jump back to the prior TextField with Shift+Tab.
Edit: I could figure out how to get rid of it. However, only if I remove one view. I don't want to.
My main container looks like that:
HStack
{
//Left Side
VStack{
Text("Here is the next #1")
}
VStack
{
//The View posted below
ViewBelow()
}
}
If I remove the first VStack, the issue is solved. Nothing lagging. If I add it, it is there again.
Just to give you a neckline of my code (many Stacks with TextFields)
ZStack
{
VStack
{
HStack
{
Text("Personal Data")
.font(.title)
.fontWeight(.bold)
.padding(.horizontal, 0)
.padding(.vertical, 5)
Spacer()
}
Divider()
.padding(.bottom, 5)
//Personal Data Types
HStack(spacing: 0)
{
//Left Element
VStack(alignment: .center)
{
Text("Vorname")
.foregroundColor(Color.gray)
} .frame(minWidth: 0, maxWidth: .infinity, alignment: .leading)
//Right Elemenet
VStack()
{
Text("Nachname")
.foregroundColor(Color.gray)
}
.frame(minWidth: 0, maxWidth: .infinity, alignment: .leading)
}.frame(minWidth: 0, maxWidth: .infinity)
HStack(spacing: 0)
{
VStack(alignment: .center)
{
//Left Element
if (self.editMode)
{
TextField("Enter some text", text: $s_test)
.frame(maxWidth:250)
}
else
{
Text(self.person.firstName)
.font(.body)
}
} .frame(minWidth: 0, maxWidth: .infinity, alignment: .leading)
VStack()
{
//Left Element
if (self.editMode)
{
TextField("Enter some text", text: self.$s_test)
.frame(maxWidth:250)
}
else
{
Text(self.person.lastName)
.font(.body)
}
}
.frame(minWidth: 0, maxWidth: .infinity, alignment: .leading)
}.frame(minWidth: 0, maxWidth: .infinity)
.padding(.top, 0)
//Personal Data Types
HStack(spacing: 0)
{
//Left Element
VStack(alignment: .center)
{
Text("Nickname")
.foregroundColor(Color.gray)
} .frame(minWidth: 0, maxWidth: .infinity, alignment: .leading)
//Right Elemenet
VStack()
{
Text("Birthday")
.foregroundColor(Color.gray)
}
.frame(minWidth: 0, maxWidth: .infinity, alignment: .leading)
}.frame(minWidth: 0, maxWidth: .infinity)
.padding(.top, 10)
HStack(spacing: 0)
{
VStack(alignment: .center)
{
//Left Element
if (self.editMode)
{
TextField("Enter some text", text: self.$s_test)
.frame(maxWidth:250)
}
else
{
Text(self.person.nickname)
.font(.body)
}
} .frame(minWidth: 0, maxWidth: .infinity, alignment: .leading)
VStack()
{
//Right Element
if (self.editMode)
{
TextField("Enter some text", text: self.$s_test)
.frame(maxWidth:250)
}
else
{
Text(self.person.birthdate)
.font(.body)
}
}
.frame(minWidth: 0, maxWidth: .infinity, alignment: .leading)
}.frame(minWidth: 0, maxWidth: .infinity)
.padding(.top, 0)
}
Maybe someone experienced the same already.. I am not quiet sure how to solve it. I removed many views, then it is working better. However I am not sure if it is just the quantity of TextFields or some bug in the other view.
I demonstrate the lag in the Gif. I press instantly when I hover above the TextField. See that lag..
