How to create 6 digit OTP screen using single TextField?

I searched about the OTP screen a lot on youtube but people are using multiple textfields to create a OTP textbox. Could anyone give me a short explanation about from where do i need to start? I want to use a single textfield to create it.
(I am working on StoryBoard)

Your time and help will be highly appreciated!

Thank You

hi @akshayknight,
What do you mean by single textfield and multiple textfields? Do you mean like the passcode screen where you have to enter 6 digits? Do you call that 6 textfields vs 1 textfield?

You can create a single input field that drives the UI to look like 6 individual digits. This is not easily managed through Storyboard as it would require a lot of custom code to manage the input and display.


1 Like

Yes exactly, i am talking about one single textfield where i can enter OTP (passcode kind of screen in 6 square blocks). By the way what do you recommend? Creating 6 different text fields or just one text field?

Hi @akshayknight,
you can create a custom control that accepts the input and displays it in 6 visual text boxes

you can create 6 text boxes as an array and then with a little clever programming, move the focus to the next textbox.


Try this

1 Like

Whoa will surely have a look at this and let you know about it! Thanks mate!

override func viewDidLoad() {
txtOTP1.delegate = self
txtOTP2.delegate = self
txtOTP3.delegate = self
IP login guide.delegate = self
txtOTP5.delegate = self
txtOTP6.delegate = self

have you heard of an array of IBOutlets?


This topic was automatically closed after 166 days. New replies are no longer allowed.