Mxyb
Mxyb

Reputation: 415

How do I make the keyboard not shift elements in the view when initialised?

In this SwiftUI project, I have a view with some text and a red background.

When the search bar is tapped, the red box, shifts upwards. I want it to remain where it is. I tried using .ignoreSafeArea(.keyboard) modifier on the ZStack & VStack but this didn't work.

How can I make sure the view does not shift upwards when the keyboard is initialised?

Here is my reproducible code:

struct Home: View {
    var body: some View {
        NavigationView {
            VStack {                
                NavigationLink(destination: SearchView()) {
                    Text("Go to search view")
                }
            }
        }
    }
}

struct SearchView: View {
    
    @State var searchText = ""
    
    var body: some View {

        ZStack {
            
            VStack {
                
                Text("Placeholder + search results go here")
                    .frame(width: 300, height: 300)
                    .background(.red)
                
            }
        }
        .searchable(text: $searchText)
    }
}

Upvotes: 1

Views: 55

Answers (1)

aheze
aheze

Reputation: 30506

ignoresSafeArea only works when the view touches the screen edge.

After stretching the ZStack to fill the screen, ignoresSafeArea will work.

struct SearchView: View {
    @State var searchText = ""
    
    var body: some View {
        ZStack {
            VStack {
                Text("Placeholder + search results go here")
                    .frame(width: 300, height: 300)
                    .background(.red)
            }
        }
        .frame(maxWidth: .infinity, maxHeight: .infinity) /// Add this to stretch the view!
        .ignoresSafeArea(.keyboard) /// ... now, this will work
        .searchable(text: $searchText)
    }
}

Upvotes: 0

Related Questions