iPad External Keyboard “Predictive” Toolbar Blocking App bottomBar

Question

Created Mar ’23

Replies 2

Boosts 1

Participants 2

Hi, when using a text field with an external keyboard on iPad & SwiftUI, the iPadOS external keyboard toolbar pops up and also displays a toolbar-like item under it, spanning the entire width of the iPad screen, blocking any existing .bottomBar items.

I’m using swift playgrounds specifically, but the issue persists on a testflight of the app, so I don’t think that’s a contributing factor. Also, the animation for the bar makes it seem like it’s an overlay of sorts, instead of just cutting off the view, and I’m certain the issue is to do with the “predictive” typing bar, since the user disabling it in their iPad’s keyboard settings resolves the issue.

If anyone’s faced the same issue or knows a fix to get rid of the background bar it presents, please let me know, thanks!

Screenshot from Swift Playgrounds’ “Date Planner” example app, showing the white bar at the bottom spanning the entire width of the screen, under the keyboard’s “predictive” toolbar:

Boost

Answer 1

VectorMonkey OP

Mar ’23

First of all I want to thank you for this ‘predictive’ hint. I’ve wrestled with that space moving up and down in the Canvas and running apps during development on iPad and had resigned to tricks to make it go away. Turning off predictive ‘fixes’ it and thank you.

About your problem there’s a ViewModifier that I think is supposed keep the view from getting pushed up

.ignoresSafeArea(.keyboard, edges: .bottom)

Or maybe there’s a .predictive option. I don’t know, I understood that annoyance to be a safe area for the keyboard and so only tried that but couldn’t get it to reliably work but maybe you know more/better. However now knowing that it’s not strictly the keyboard but this predictive thing I’ll look again.

1

Answer 2

VectorMonkey OP

Mar ’23

Hi, sorry for the long delay, I’m not familiar with these forums and didn’t realize no incremented post count doesn’t mean no new activity. Anyways I noticed a day or two after posting that turning off Predictive doesn’t actually fix my problem, but I’ve fiddled some more with this issue and learned a little.

Mainly what I learned is we have separate primary problems. My main problem is that views get pushed up and down by that keyboard thingy coming and going. I’ve kinda figured that out by putting ignoresSafeArea in certain multiple places but reading your post more carefully I see you don’t have that problem, your view isn’t pushed up, instead it stays down and gets covered by that opaque backing of the keyboard widget.

I’m guessing you’ve already discovered this but that opaque backing appears to be a bug because when I use a UITextField instead then the keyboard thingy comes up and it’s transparent outside the actual widget.

In fact, using a SwiftUI.TextField, when that keyboard widget initially comes up its the full width of the screen (like some older style of this widget) but then it quickly scales out and is replaced by the shorter widget (except it has the opaque backing). A UITextField doesn’t do any of that, it only comes up with the shorter widget with no backing.

I wonder if that initial full width widget that SwiftUI.TextField shows is supposed to be for a compact size class. Like it thinks its showing the keyboard thing for an iPhone or iPad Split View, but then once shown it realizes its got the whole iPad width so it switches to the shorter widget but leaves behind the opaque backing of the full width widget.

I don’t know if there’s a way to fix this in SwiftUI. I’m almost certain it’s a bug and if it has to do with size class then maybe there’s a way to force or push the correct size class before it appears. Idk seems a long shot. Otherwise the only workaround I can think of is to switch a UITextField representable wrapper which may be no easy feat.

1