swiftswiftuiuikeyboard

SwiftUI: Decide which content the keyboard overlaps


I'm trying to find a way to mark which content is overlapped by the keyboard that pops up when a TextField is focused.

Consider the minimal example below:

VStack {
            
    TextField(text: $text) {}
            
    Spacer()
            
    Circle()
        .frame(width: 100, height: 100)
}

I'm looking for a custom modifier that I could apply to the Circle. This would dictate whether the keyboard should push the Circle up above the keyboard, as is default, or if the keyboard should overlap the Circle (I'm not sure how to get the keyboard to simply overlap a view, either).

So far I've found primarily Objective-C solutions... Are there any SwiftUI ways to go about this? Thank you for the help!


Solution

  • If I understood correctly your goal then you don't need custom modifier - there is standard modifier, which you can either add or remove, or use with some condition.

    VStack {
        TextField(text: $text) {}
            .textFieldStyle(.roundedBorder)
    
        VStack {
            Spacer()
    
            Circle()
                .frame(width: 100, height: 100)
        }
        .ignoresSafeArea(.keyboard, edges: .bottom)    // << here !!
        //.ignoresSafeArea(yourFlag ? .keyboard : .container, edges: .bottom) // << alternate
    }