Hi,
I wanted to know if it was possible to add a done button to the number pad in Xcode. Currently, the number pad looks like this:
I want to make the keyboard disappear when the user taps “done”. Any suggestions? I found some posts on Stack Overflow, but they were confusing and I am looking for a simpler method.
Thanks in advance.
Hi,
This is what I have used in the past.
I checked and updated one of the methods, still seems to work.
Blessings,
—Mark
//Call it in viewDidLoad
addDoneButtonOnNumpad(textField: <name of text field>)
func addDoneButtonOnNumpad(textField: UITextField) {
let keypadToolbar: UIToolbar = UIToolbar()
// add a done button to the numberpad
keypadToolbar.items=[
UIBarButtonItem(title: "Done", style: UIBarButtonItem.Style.done, target: textField, action: #selector(UITextField.resignFirstResponder)),
UIBarButtonItem(barButtonSystemItem: UIBarButtonItem.SystemItem.flexibleSpace, target: self, action: nil)
]
keypadToolbar.sizeToFit()
// add a toolbar with a done button above the number pad
textField.inputAccessoryView = keypadToolbar
}//addDoneToKeyPad
1 Like
How do you call it in viewDidLoad?
This looks like the solution that I need, but I’m not sure how to implement this. Any help would be appreciated.
Thanks
@scotthu
Welcome to the community.
Are you creating an App using UIKit (Storyboard) or SwiftUI?
Hi @scotthu
Wekcine to the community!
As Chris asks, are you using UIKit?
I have been so burried in SwiftUI lately, sometimes I forgot how calls work in UIKit! lol
Blessings,
–Mark
@scotthu
If you are using SwiftUI then you add a toolbar modifier to the TextField.
See this article by Paul Hudson.
https://www.hackingwithswift.com/quick-start/swiftui/how-to-add-a-toolbar-to-the-keyboard
FoundationSoftware:
addDoneButtonOnNumpad(textField: <name of text field>)
func addDoneButtonOnNumpad(textField: UITextField) {
let keypadToolbar: UIToolbar = UIToolbar()
// add a done button to the numberpad
keypadToolbar.items=[
UIBarButtonItem(title: "Done", style: UIBarButtonItem.Style.done, target: textField, action: #selector(UITextField.resignFirstResponder)),
UIBarButtonItem(barButtonSystemItem: UIBarButtonItem.SystemItem.flexibleSpace, target: self, action: nil)
]
keypadToolbar.sizeToFit()
// add a toolbar with a done button above the number pad
textField.inputAccessoryView = keypadToolbar
}//addDoneToKeyPad
Thank much. I’m using Swift UI
I’ve tried a couple of the suggestions from the Paul Hudson site.
The following gives me an error stating that “Type ‘ToolbarItemPlacement’ has no member ‘keyboard’”
The other solution of using the focus state was stating that I couldn’t use focus state
TextField("Fluids:", text: $administeredFluids)
.toolbar{
ToolbarItemGroup(placement: .keyboard) {
Button("Done") {
}
}
}
Using the focus solution, I received this error: Cannot find ‘$isInputActive’ in scope
NavigationView {
TextField("Fluids already given (mL): ", text: $administeredFluids)
.textFieldStyle(.roundedBorder)
.focused($isInputActive)
.toolbar {
ToolbarItemGroup(placement: .keyboard) {
Spacer()
Button("Done") {
isInputActive = false
}
}
}
}
In addition, under ContentView: View, I had placed the focus state
struct ContentView: View {
@FocusState var isInputActive: Bool
Using your code names it works for me.
struct ContentView: View {
@State private var administeredFluids = ""
@FocusState var isInputActive: Bool
var body: some View {
NavigationView {
TextField("Fluids already given (mL): ", text: $administeredFluids)
.textFieldStyle(.roundedBorder)
.focused($isInputActive)
.toolbar {
ToolbarItemGroup(placement: .keyboard) {
Spacer()
Button("Done") {
isInputActive = false
}
}
}
}
}
}
By the way, you don’t need a NavigationView if you don’t want one. It’s just there as a Container.
It’s a good idea to get used to cleaning your project with Shift + Command + K
when you make lots of code changes.
Could it be because I’m still on Xcode 12?
Yes, you should update to the latest.