Interaction with an input field in a view inside my TabView, is causing my other views to animate weirdly when they appear. In addition, the nav bar doesn't hide as it should.

I've established it is an input field + TabView problem because:

* This issue does not occur on the simulator (the keyboard doesn't push up).
* It does not occur if the user navigates to the other tab views before interacting with an input field.
* It doesn't occur when I put a tab view view's content in another view and navigate to it.

I've looked into a few solutions but had no luck:
Is there a way to override the keyboard animation?
Is there a way to force the tab view views to "appear" when the tab view loads?
Is there a way to stop other TabView sub views being impacted by changes in other TabView views

Tab iew Code

```
        TabView (){
        ViewA()
            .tabItem {
                Image("viewa").renderingMode(.template)
                  Text("viewa")
            }

        ViewB()
            .tabItem {
                  Image("viewb").renderingMode(.template)
                    Text("viewb")
            }
        ViewC()
            .tabItem {
              Image("viewc").renderingMode(.template)
                Text("viewc")

            }
        ViewD()
            .tabItem {
                Image("viewd").renderingMode(.template)
                  Text("viewd")
            }

    }

```

In the tab views child views, animation is applied to a VStack containing my items like so.

```
VStack{
items...
}.animation(.easeInOut)

```

This code is used to hide the nav:

```
        .background(NavigationConfigurator { nav in 
        nav.hidesBarsOnSwipe = true
    })

```

Expected behaviour:

[![enter image description here](https://i.stack.imgur.com/xDFS6.gif)](https://i.stack.imgur.com/xDFS6.gif)

Behaviour when interacting with an input field:

[![enter image description here](https://i.stack.imgur.com/bI7RU.gif)](https://i.stack.imgur.com/bI7RU.gif)