I'm using a view modifier in my Form view in order to push up the view when the keyboard appears to avoid the keyboard hiding the text field, it used to work perfectly but I don't understand why suddenly when the keyboard appears there is a strange white padding.
As you can see the View going up but from the keyboard to the textfield appear a strange white spot, cant understand why and how to remove.
here my MainView
var body: some View {
NavigationStack{
ZStack{
// change view base on index
switch selectedIndex {
case 0 : Text("HOME")
case 1 : Logbook(dm: dm)
case 2 : AddFlightView(dm: dm)
default: Text("Default")
}
// Overlay tab bar
VStack{
Spacer()
BottomBar(selectedIndex: $selectedIndex, items: $items)
.cornerRadius(15)
.padding(.horizontal)
.shadow(color: Color.darkTextColorMain.opacity(0.1), radius: 10,
x: 10,
y: 5)
}
}
.navigationTitle(titleChange(selectedIndex: selectedIndex))
}
}
My Add flight view where the Form that should move up is:
var body: some View {
Form{
Section("Flight") {
Picker("Select ", selection: $selected) {
ForEach(DutyType.allCases,id: \.self) { type in
Text(stringPicker(dutyType:type))
}
}
DatePicker(selection: $flightDate, displayedComponents: .date) {
Text("Select a date")
}.environment(\.timeZone, TimeZone(abbreviation: "UTC")!)
}
Section("Departure and Destination") {
HStack{
Text("Departure Airport")
TextField(text: $departure_Apt) {
Text("Departure Airport")
}.multilineTextAlignment(.trailing)
}
HStack{
Text("Arrival Airport")
TextField(text: $arrival_Apt) {
Text("Arrival Airport")
}.multilineTextAlignment(.trailing)
}
}
Section("Time Selection"){
DatePicker(selection: $chockoff, displayedComponents: .hourAndMinute) {
Text("Chock OFF \(convertDateToString(date: chockoff))")
}.environment(\.timeZone, TimeZone(abbreviation: "UTC")!)
DatePicker(selection: $chockin, in: convertToUTCDate(dateToConvert: Date.now)... , displayedComponents: .hourAndMinute) {
Text("UTC Selected: \(convertDateToString(date: chockin))")
}.environment(\.timeZone, TimeZone(abbreviation: "UTC")!)
TextField("Add", text: $test)
// .textContentType(.oneTimeCode)
.keyboardType(.numberPad)
Spacer()
}
}
.modifier(Keyboard())
}
and the ViewModifier that notify the keyboard change:
struct Keyboard : ViewModifier {
@State var offset: CGFloat = 0
func body(content: Content) -> some View {
content.padding(.bottom,offset).onAppear(perform: {
NotificationCenter.default.addObserver(forName: UIResponder.keyboardDidShowNotification, object: nil, queue: .main) { notification in
let val = notification.userInfo?[UIResponder.keyboardFrameEndUserInfoKey] as! CGRect
let height = val.height
self.offset = height
}
NotificationCenter.default.addObserver(forName: UIResponder.keyboardWillHideNotification, object: nil, queue: .main) { notification in
self.offset = 0
}
})
}
}
here is what happens without the modifier... When the keyboard shows up it hides my text field in the form

