Confirmation Input

ConfirmationInput widget

The ConfirmationInput Widget enables the seamless rendering of a verification view. The usecases are entering OTP, Confirmation Code, PIN Number, Reset Password, Coupon and more.

Test in Kitchen Sink (opens in a new tab)

Properties

PropertyTypeDescription
lengthintegerThe number of the text fields item.
enableCursorbooleanIf the button is inside a Form and upon on tap, it will execute the form's onSubmit action if this property is TRUE.
autoCompletebooleanIf it is True, then it will trigger onComplete when the user specified length and has typed the full length, False will trigger onComplete when the user hit Enter. Defaults (True).
fieldTypestringHow the input field should be displayed.
inputTypestringPick a predefined input type.
obscureTextbooleanTo display the pin as obscure. Default is false
obscureSymbolstring/IconTo display in place of pin as obscure if obscureText is true, it can be a character of length 1 or a icon widget. Default is *
defaultFieldBorderColorstringSet the border color for inactive/unfocused state of text field.
activeFieldBorderColorstringSet the border color for active/focused state of text field.
filledFieldBorderColorstringSet the border color for filled state of text field.
defaultFieldBackgroundColorstringSet the background Color for inactive/unfocused state of text field.
activeFieldBackgroundColorstringSet the ackground Color for active/focused state of text field.
filledFieldBackgroundColorstringSet the ackground Color for filled field state of text field.
cursorColorstringSet the color for the cursor.
stylesobjectSee properties
onChangeactionExecute an action when a change is detected to the text field
onCompleteactionExecute an action when the text field fully entered or when keyboard submitted button tapped
autofillEnabledbooleanEnables or disables the autofill functionality for the input field. Default is false.