Keyboard animation not in sync with TextField and List, chat UI

37 views Asked by At

I have a simple UI with an input beneath a list. You can see in this slowed down screen recording that the animation is not in sync.

Shouldn't this be out of the box? Is this a SwiftUI bug?

enter image description here

    @State private var userInput: String = ""

    var body: some View {
        VStack {
            List(1..<101) { index in
                Text("Row \(index)")
            }
            .frame(maxWidth: .infinity, maxHeight: .infinity)

            TextField("Enter something", text: $userInput)
                .padding()
                .background(Color.orange)
                .padding()
        }
    }
}

1

There are 1 answers

0
Mecid On

It looks like the keyboard and the view content has different animations. I can only suggest to solve the issues by using safeAreaInset view modifier:

struct ContentView: View {
    @State private var userInput: String = ""
    
    var body: some View {
        List(1..<101) { index in
            Text("Row \(index)")
        }
        .safeAreaInset(edge: .bottom) {
            TextField("Enter something", text: $userInput)
                .padding()
                .background(Color.orange)
        }
    }
}