BT-OtpView

An off-the-shelf, 4-digit, One-Time-Password View For iOS.

Quickstart

1- Drag View object from the Object Library into your storyboard.

2- Set the view's class to OtpView in the Identity Inspector. Set its module property to BT_OtpView.

3- add import BT_OtpView to the header of your view controller.

4- Create an outlet in the corresponding view controller.

  @IBOutlet weak var otpView: OtpView!

5- Set the delegate of the otpView and implement OtpViewDelegate.

   
override func viewDidLoad() {
      ...
      otpView.delegate = self
}


extension ViewController : OtpViewDelegate {
  
  func shouldReceive(otpCode code: String, at otpView: OtpView) -> Bool {
      // code is the 4-digit code entered
      return true
}
  
}

shouldReceive(otpCode code: String, at otpView: OtpView) is invoked automatically once 4-digit code is entered.

Notes

• shouldReceive : this function returns boolean, true to dismiss the keyboard when 4 digits are entered, otherwise false.

• alternatively, you can access the code as follows..

    otpView.verificationCode  

  Customization

  You can customize OtpView for the following attributes

All you need to do is to set the decorator attribute on OtpView as follows..

      otpView.decorator = OtpViewDecorator(
        defaultBorderColor: .gray,
        focusedBorderColor: .black,
        cornerRadius: 8,
        borderWidth: 1,
        defaultFillColor: .clear,
        focusedFillColor: .clear,
        hideCursor: true,
        isSecuredTextEntry: false,
        onlyNumbers: true,
        placeHolder: "*",
        textColor: .brown,
        font: UIFont.boldSystemFont(ofSize: 24)
      )

Installation

To install OtpView, simply add the following line to your Podfile:

pod 'BT-OtpView'

License

BT-OtpView is available under the MIT license. See the LICENSE file for more info.