MojtabaHs / iPhoneNumberField

Elegant SwiftUI phone number textField.
MIT License
542 stars 88 forks source link

iPhoneNumberField โ˜Ž๏ธ

Format phone numbers as they're typedโ€”entirely in SwiftUI. ๐Ÿ“ฑ

Get Started | Examples | Customize | Features | Install | Pricing

CI


## And it's as easy as ```swift iPhoneNumberField("Phone", text: $text) ```

CI

## Get Started 1. [Install](./INSTALL.md) `iPhoneNumberField`. 2. Add `iPhoneNumberField` to your project. ```swift import SwiftUI import iPhoneNumberField struct ContentView: View { @State var text = "" var body: some View { iPhoneNumberField("Phone", text: $text) } } ``` 3. Customize your `iPhoneNumberField` ## Examples ### Flags ๐Ÿ‡ฆ๐Ÿ‡ถ Show the flag, and make it selectable, so your users can find their region. ```swift import SwiftUI import iPhoneNumberField struct ContentView: View { @State var text = "" var body: some View { iPhoneNumberField(text: $text) .flagHidden(false) .flagSelectable(true) .font(UIFont(size: 30, weight: .bold, design: .rounded)) .padding() } } ```

Focus and unfocus ๐Ÿ”

Use iPhoneNumberField's optional binding and programmatically change the text field.

```swift import SwiftUI import iTextField import iPhoneNumberField struct ContentView: View { @State var nameText = "" @State var phoneText = "" @State var phoneEditing = false var body: some View { VStack { TextField("Name", text: $nameText) .padding() iPhoneNumberField("Phone", text: $phoneText, isEditing: $phoneEditing) .font(UIFont(size: 24, weight: .light, design: .monospaced)) .padding() } } } ```


### Custom style ๐ŸŽ€ Use our modifiers to create a fully customized field. ```swift import SwiftUI import iPhoneNumberField struct ContentView: View { @State var text: String = "" @State var isEditing: Bool = false var body: some View { iPhoneNumberField("(000) 000-0000", text: $text, isEditing: $isEditing) .flagHidden(false) .flagSelectable(true) .font(UIFont(size: 30, weight: .light, design: .monospaced)) .maximumDigits(10) .foregroundColor(Color.pink) .clearButtonMode(.whileEditing) .onClear { _ in isEditing.toggle() } .accentColor(Color.orange) .padding() .background(Color.white) .cornerRadius(10) .shadow(color: isEditing ? .lightGray : .white, radius: 10) .padding() } } ```


## Customize `iPhoneNumberField` takes 2 required parameters: 1๏ธโƒฃ a `String` placeholder, and 2๏ธโƒฃ a binding to a phone number string. All customizations are built into our modifiers. **Example**: Customize the text field style, and call a closure when editing ends. ```swift iPhoneNumberField("", text: $text) .accentColor(Color.green) .clearsOnBeginEditing(true) .clearButtonMode(.always) .onEditingEnded { print("DONE โœ…") } ``` Use our exhaustive input list to customize your view.
| | Modifier | Description --- | --- | --- ๐Ÿ”  | `.font(_:)` | Modifies the text fieldโ€™s **font** from a `UIFont` object. ๐ŸŽจ | `.foregroundColor(_:)` | Modifies the **text color** of the text field. ๐Ÿ– | `.accentColor(_:)` | Modifies the **cursor color** while typing on the text field. ๐ŸŒˆ | `.placeholderColor(_:)` | Modifies the entire **placeholder color** of the text field. ๐Ÿ– | `.numberPlaceholderColor(_:)` | Modifies solely the **phone number placeholder color** of the text field โ€“ without the country code. ๐Ÿ  | `.countryCodePlaceholderColor(_:)` | Modifies solely the **country code placeholder color** of the text field โ€“ without the phone number. โ†”๏ธ | `.multilineTextAlignment(_:)` | Modifies the **text alignment** of a text field. โ˜Ž๏ธ | `.textContentType(_:)` | Modifies the **content type** of a text field for implied formatting. โ–ถ๏ธ | `.clearsOnEditingBegan(_:)` | Modifies the **clear-on-begin-editing** setting of a text field. ๐Ÿ‘† | `.clearsOnInsert(_:)` | Modifies the **clear-on-insertion** setting of a text field. โŒ | `.clearButtonMode(_:)` | Modifies whether and when the text field **clear button** appears on the view. โ˜‘๏ธ | `.textFieldStyle(_:)` | Modifies the style of the text field to one of Apple's three pre-designed styles. ๐Ÿ”Ÿ | `.maximumDigits(_:)` | Modifies the maximum number of digits the text field allows. ๐Ÿ‡ฆ๐Ÿ‡ถ | `.flagHidden(_:)` | Modifies whether the text field hides the country flag on the left ๐Ÿ‡ธ๐Ÿ‡ช๐Ÿ‡น๐Ÿ‡ผ๐Ÿ‡จ๐Ÿ‡ฌ. ๐Ÿ‡ธ๐Ÿ‡ฎ | `.flagSelectable(_:)` | Modifies whether the flag is selectable. โž• | `.prefixHidden(_:)` | Modifies whether the country code prefix should be hidden. Note: prefix will only be shown if using the default placeholder (`placeholder = nil`). ๐Ÿ“ž | `.formatted(_:)` | Modifies whether the binding you pass as the `text` parameter gets formatted. โœ‹ | `.disabled(_:)` | Modifies whether the text field is **disabled**. โ–ถ๏ธ | `.onEditingBegan(perform: { code })` | Modifies the function called when text editing **begins**. ๐Ÿ’ฌ | `.onNumberChange(perform: { code })` | Modifies the function called when the user makes any **changes** to the text in the text field. ๐Ÿ’ฌ | `.onEdit(perform: { code })` | Modifies the function called when the user makes any **changes** to the text in the text field. ๐Ÿ”š | `.onEditingEnded(perform: ({ code })` | Modifies the function called when text editing **ends**. ๐Ÿ”˜ | `.onClear(perform: { code })` | Modifies the function called when the user clears the text field. โ†ช๏ธ | `.onReturn(perfom: { code })` | Modifies the function called when the user presses return. ๐Ÿณ๏ธ| `.defaultRegion(_:)` | Receives a country string and selects the default phone format.
## Features
| |Features | --------------------------|------------------------------------------------------------ :phone: | Validate, normalize and extract the elements of any phone number string. :checkered_flag: | Fast. 1000 parses -> ~0.4 seconds. :books: | Best-in-class metadata from Google's libPhoneNumber project. :trophy: | Fully tested to match the accuracy of Google's JavaScript implementation of libPhoneNumber. :iphone: | Built for iOS. Automatically grabs the default region code from the phone. ๐Ÿ“ | Editable (!) AsYouType formatter for UITextField. :us: | Convert country codes to country names and vice versa โš™๏ธ | Access to all native `UITextField` configurations ๐Ÿ” | Searchable and customizable country code and name list โˆž | Many more features to discover
## Install You can use the Swift package manager to install `iPhoneNumberField`. Find Xcode SPM instructions [here](./INSTALL.md) ``` dependencies: [ .package(url: "https://github.com/MojtabaHs/iPhoneNumberField.git", .upToNextMinor(from: "0.10.0")) ] ``` # ๐ŸŒŸ Become a Paid Subscriber This library is under the **MIT** license and completely **FREE**. Anyone can use it anywhere, and any contribution is welcome. In addition, you can show your support and [become My sponsor](https://www.buymeacoffee.com/mojtabahs/membership). By supporting me, you will gainยน: - Tickets for code-level support in any project you want (not just this one) - Access me through my socials and we can discuss technologies together. - Discounts and early access to my premium products. - Early access to updates and bug fixes. - We can even discuss your project entirely and build it together ๐Ÿ’ช๐Ÿป. Remember that it is my pleasure to be a part of the community and try my best to deliver my experience to anyone who needs it. ยน Paid program options are related to the chosen level.