We might have seen OTP(ONE TIME PASSWORD) usage in many bank transactions/Social media accounts to validate particular User or transactions
We have many libraries and packages to have the same functionality in iOS Apps.
In this article am going to show, how to create a OTP(ONE TIME PASSWORD)VIEW AND FUNCTIONALITY using swiftUI without any libraries and packages for an iOS APP.
Steps To Create a OTP View
1. Create an Xcode project with SWIFTUI interface
2. Create A Custom TextView to show entered OTP as shown in below Image3. Above shown selected and deselected textviews can be achieved with the below code
4. Create a view for verification with the OTP Text boxes as shown below
5. Create a data model to observe the changes
63. Above shown selected and deselected textviewsOTP Text boxes view can be achieved with the below code
7. To achieve the functionality, OTP text box should recognise the backspace,However our default keyboard in iOS cannot recognise backspace in empty TextFields/TextViews. To overcome this situation we have to create a custom key board where we can recognise the usage of back button.
Creation of Custom numerical keyboard in swiftUI is explained in my previous blog. CLICK HERE to check for Creation of Custom numerical keyboard in swiftUI
Custom numerical keyboard in SwiftUI8. On successful integration of Custom numerical keyboard in the project. Replace the function buttonAction in Custom numerical keyboard as shown below
That it our project is ready to test OTP functionality.
9. On execution of above steps we can experience OTP(ONE TIME PASSWORD)VIEW AND FUNCTIONALITY IN SWIFTUI