# KeyboardTypes in SwiftUI

This blog post will show you the different iOS keyboard types (screenshots) and how to apply them to SwiftUI views.

I will also share a project that can help you build custom keyboard extensions with SwiftUI.

# Keyboard Types

Apple provides 12 types of the iOS keyboard with the enum [`UIKeyboardType`](https://developer.apple.com/documentation/uikit/uikeyboardtype) in the `UIKit` framework.

All of these specialized keyboard types are available in `SwiftUI` and can be applied to through an existing extension on `View`. Example:

```Swift
TextField("someone@example.com", text: $emailAddress)
  .keyboardType(.emailAddress)
```

This extension is available for iOS and tvOS since 13.0.

```Swift
extension View {
    @available(iOS 13.0, tvOS 13.0, *)
    @available(macOS, unavailable)
    @available(watchOS, unavailable)
    public func keyboardType(_ type: UIKeyboardType) -> some View

}
```

## Default

Specifies the default keyboard for the current input method.

```Swift
.keyboardType(.default)
```

![default.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1653170568256/h-4W8fYu7.png align="left")

## ASCII Capable

Specifies a keyboard that displays standard ASCII characters.

```Swift
.keyboardType(.asciiCapable)
```

![asci.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1653170582538/NtQMAB-4Z.png align="left")

## Numbers And Punctuation

Specifies the numbers and punctuation keyboard.

```Swift
.keyboardType(.numbersAndPunctuation)
```

![numbersPunc.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1653170593942/bmDmsyJ8A.png align="left")

## URL

This keyboard type prominently features the period (“.”) and slash (“/”) characters and the “.com” string.

```Swift
.keyboardType(.URL)
```

![url.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1653170602883/1nh8YpfKG.png align="left")

## Numbers Pad

This keyboard type prominently features the numbers 0 through 9. This keyboard type does not support auto-capitalization.

```Swift
.keyboardType(.numberPad)
```

![numberpad.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1653170616113/mgsQbtnwk.png align="left")

## Phone Pad

This keyboard type prominently features the numbers 0 through 9 and the “*” and “#” characters. This keyboard type does not support auto-capitalization.

```Swift
.keyboardType(.alphabet)
```

![phonepad.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1653170632343/3shWJ2tyK.png align="left")

## Name Phone Pad

Specifies a keypad for entering a person’s name or phone number. This keyboard type does not support auto-capitalization.

```Swift
.keyboardType(.namePhonePad)
```

![namephonepad.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1653170645681/b6xil3jRx.png align="left")

## Email Address

This keyboard type prominently features the at (“@”), period (“.”) and space characters.

```Swift
.keyboardType(.emailAddress)
```

![email.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1653170655182/WnEpG_9qb.png align="left")

## Decimal Pad

Specifies a keyboard with numbers and a decimal point.

```Swift
.keyboardType(.decimalPad)
```

![decimalPad.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1653170665816/a3MDz5cJL.png align="left")

## Twitter

Specifies a keyboard for Twitter text entry, with easy access to the at (“@”) and hash (“#”) characters.

```Swift
.keyboardType(.twitter)
```

![twitter.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1653170675714/Vqgj7urj4.png align="left")

## WebSearch

This keyboard type prominently features the space and period (“.”) characters.

```Swift
.keyboardType(.webSearch)
```

![websearch.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1653170684599/7XoFIoJRe.png align="left")

## ASCII Capable Number Pad

Specifies a number pad that outputs only ASCII digits.

```Swift
.keyboardType(.asciiCapableNumberPad)
```

![asciicapblenumberpad.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1653170695661/ikuau-8xW.png align="left")

## Alphabet

> Use UIKeyboardType.asciiCapable instead.

```Swift
.keyboardType(.alphabet)
```

![alphabet.png](https://cdn.hashnode.com/res/hashnode/image/upload/v1653170707761/5BlSzysX_.png align="left")

# Custom Keyboard

If you are interested in building your custom keyboard extension, you should look if [`KeyboardKit](https://github.com/KeyboardKit/KeyboardKit) can help you. This project is brought to you by [Daniel Saidi](https://twitter.com/danielsaidi).

> KeyboardKit helps you build custom keyboard extensions with Swift and SwiftUI. It extends the native keyboard APIs and provides you with a lot more functionality than is otherwise available. 

> The end result can look something like this...or entirely different:

![KeyboardKit Demo](https://github.com/KeyboardKit/KeyboardKit/raw/master/Resources/Demo.gif)