ios – SwiftUi Listing content material pushed to the underside earlier than keyboard proven

I’ve a structure like beneath, with Listing and TextField in a VStack (chat-like interface).

struct ContentView: View {
    @State var enter: String = ""
    
    var physique: some View {
        VStack(alignment: .middle) {
            Listing ((1...40), id: .self) { index in
                row(forIndex: index)
                    .padding(.backside)
                    .listRowSeparator(.hidden)
                    .listRowInsets(.init())
            }
            .listStyle(.plain)
            
            TextField("Enter", textual content: $enter)
                .padding(.init(prime: 0, main: 15, backside:0 , trailing: 15))
                .foregroundColor(.blue)
                .textFieldStyle(RoundedBorderTextFieldStyle.init())
        }
    }

    func row(forIndex index: Int) -> some View {
        Textual content("# (index)")
            .body(maxWidth: .infinity)
            .background(index % 2 == 0 ? .yellow : .inexperienced )
    }
}

I face an issue ocuring when the listing is scrolled to the very backside and software program keyboard is proven. In the meanwhile the keyboard begins showing on the display screen the entire context of the listing is immediately pushed to the underside, by the worth that is equal the peak of TextField. See hooked up gif.

That is smart to some lengthen because the TextField is respecting keyboard secure space and thus is pushed to the highest along with keyboard. However appears to be like that on the identical time Listing is increasing by the house taken earlier than by TextView.

However how one can keep away from this “bounce” of the Listing content material? It positively has one thing to do with secure space, I attempted taking part in with properties like .ignoresSafeArea however with none success.

There is no such thing as a impact like this when utilizing ScrollView with VStack or LazyVStack, however for some causes I would like to stay with Listing.

Edit: I’ve tried offering TextField as a customized safeAreaInset, this fixes the issue for exhibiting the keyboard, however there may be one other glitch when the keyboard is being hidden, equally, the content material is pushed to a lot to the underside.

var physique: some View {
    Listing ((1...40), id: .self) { index in
        row(forIndex: index)
            .padding(.backside)
            .listRowSeparator(.hidden)
            .listRowInsets(.init())
    }
    .listStyle(.plain)
    .safeAreaInset(edge: .backside) {
        TextField("Enter", textual content: $enter)
            .padding(.init(prime: 0, main: 15, backside:0 , trailing: 15))
            .foregroundColor(.blue)
            .textFieldStyle(RoundedBorderTextFieldStyle.init())
    }
}