Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
[SwiftUI] Wrapping a UITextField into SwiftUI to use different keyboards, e.g: UIKeyboardType.twitter, UIKeyboardType.numbersAndPunctuation
// Created by Thiago Holanda on 22.06.19.
// twitter.com/tholanda
import SwiftUI
struct ContainerView: View {
@State var decimal = ""
@State var twitter = ""
@State var url = ""
@State var search = ""
var body: some View {
VStack(spacing: 2) {
HStack {
Text("Decimal Pad:")
.font(.body)
.foregroundColor(.gray)
TextFieldTyped(keyboardType: .decimalPad, text: self.$decimal)
.background(Color.gray)
.frame(width: 200)
Text("Text: \(self.decimal)")
.font(.body)
.foregroundColor(.gray)
.frame(width: 200)
}
HStack {
Text("Twitter Pad:")
.font(.body)
.color(.gray)
TextFieldTyped(keyboardType: .twitter, text: self.$twitter)
.background(Color.gray)
.frame(width: 200)
Text("Text: \(self.twitter)")
.font(.body)
.foregroundColor(.gray)
.frame(width: 200)
}
HStack {
Text("URL Pad:")
.font(.body)
.foregroundColor(.gray)
TextFieldTyped(keyboardType: .URL, text: self.$url)
.background(Color.gray)
.frame(width: 200)
Text("Text: \(self.url)")
.font(.body)
.foregroundColor(.gray)
.frame(width: 200)
}
HStack {
Text("WebSearch Pad:")
.font(.body)
.foregroundColor(.gray)
TextFieldTyped(keyboardType: .webSearch, text: self.$search)
.background(Color.gray)
.frame(width: 200)
Text("Text: \(self.search)")
.font(.body)
.foregroundColor(.gray)
.frame(width: 200)
}
}
.frame(height: 40)
}
}
struct TextFieldTyped: UIViewRepresentable {
let keyboardType: UIKeyboardType
@Binding var text: String
func makeUIView(context: Context) -> UITextField {
let textField = UITextField(frame: .zero)
textField.keyboardType = self.keyboardType
textField.delegate = context.coordinator
_ = NotificationCenter.default.publisher(for: UITextField.textDidChangeNotification, object: textField)
.compactMap {
guard let field = $0.object as? UITextField else {
return nil
}
return field.text
}
.sink {
self.text = $0
}
return textField
}
func updateUIView(_ uiView: UITextField, context: Context) {
}
func makeCoordinator() -> Coordinator {
Coordinator(self)
}
class Coordinator: NSObject, UITextFieldDelegate {
var parent: TextFieldTyped
init(_ textField: TextFieldTyped) {
self.parent = textField
}
// func textField(_ textField: UITextField, shouldChangeCharactersIn range: NSRange, replacementString string: String) -> Bool {
// if let value = textField.text {
// parent.text = value
// parent.onChange?(value)
// }
//
// return true
// }
}
}
#if DEBUG
struct ContentView_Previews : PreviewProvider {
static var previews: some View {
Group {
ContainerView().previewLayout(.fixed(width: 700, height: 200))
ContainerView().environment(\.colorScheme, .dark).previewLayout(.fixed(width: 600, height: 400))
}
}
}
#endif
@txaiwieser

This comment has been minimized.

Copy link

@txaiwieser txaiwieser commented Jun 9, 2020

Is there a reason not to use the default modifiers?

TextField(...)
    .keyboardType(.decimalPad)
    .textContentType(.creditCardNumber)
@unnamedd

This comment has been minimized.

Copy link
Owner Author

@unnamedd unnamedd commented Jun 10, 2020

Is there a reason not to use the default modifiers?

TextField(...)
    .keyboardType(.decimalPad)
    .textContentType(.creditCardNumber)

Not today. I created this gist on June 22, 2019, at the moment, SwiftUI was beta and didn't have the keyboardType property yet.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment