PrismOtpField class

A one-time-code / PIN field with paste, auto-submit and SMS autofill.

Every friction point of OTP entry is handled for you: typing fills boxes left to right, backspace deletes from the end, pasting a whole code from an SMS fills every box at once, and onCompleted fires as soon as the last digit lands. The field advertises the oneTimeCode autofill hint, so iOS and Android can offer their native code suggestions.

PrismOtpField(
  length: 6,
  onCompleted: (code) => verify(code),
)

Digit boxes are pure decoration — a single transparent TextField behind them owns the text. That keeps platform behaviour (IME, autofill, paste, selection, screen readers) exactly as users expect, instead of fighting it with six separate fields.

Inheritance

Constructors

PrismOtpField({Key? key, int length = 6, ValueChanged<String>? onChanged, ValueChanged<String>? onCompleted, TextEditingController? controller, bool autofocus = false, bool enabled = true, bool obscure = false, double boxSize = 48, double gap = 8, String? errorText, String? helperText, Iterable<String> autofillHints = const [AutofillHints.oneTimeCode], TextInputType keyboardType = TextInputType.number, int? groupSeparatorAfter, Color? accentColor, bool hasError = false, String semanticLabel = 'Verification code', Widget boxBuilder(BuildContext context, int index, String char, bool focused)?})
Creates an OTP field.
const

Properties

accentColor → Color?
Border/accent color when focused or filled. Defaults to the primary color.
final
autofillHints → Iterable<String>
Autofill hints handed to the platform.
final
autofocus → bool
Whether to focus the field on mount.
final
boxBuilder → Widget Function(BuildContext context, int index, String char, bool focused)?
Replaces the default digit box rendering.
final
boxSize → double
Width and height of each digit box.
final
controller → TextEditingController?
Optional external controller.
final
enabled → bool
Whether the field accepts input.
final
errorText → String?
Error text shown below the field.
final
gap → double
Gap between digit boxes.
final
groupSeparatorAfter → int?
Draw a wider gap after this many boxes (3 gives the familiar 123 456).
final
hasError → bool
Forces error styling on.
final
hashCode → int
The hash code for this object.
no setterinherited
helperText → String?
Helper text shown below the field.
final
key → Key?
Controls how one widget replaces another widget in the tree.
finalinherited
keyboardType → TextInputType
Keyboard type for code entry.
final
length → int
Number of digits.
final
obscure → bool
Masks digits as bullets — use for PINs and passcodes.
final
onChanged → ValueChanged<String>?
Called whenever any digit changes, with the current (possibly partial) code.
final
onCompleted → ValueChanged<String>?
Called when every box is filled.
final
runtimeType → Type
A representation of the runtime type of the object.
no setterinherited
semanticLabel → String
Accessibility label for the field.
final

Methods

createElement() → StatefulElement
Creates a StatefulElement to manage this widget's location in the tree.
inherited
createState() → State<PrismOtpField>
Creates the mutable state for this widget at a given location in the tree.
override
debugDescribeChildren() → List<DiagnosticsNode>
Returns a list of DiagnosticsNode objects describing this node's children.
inherited
debugFillProperties(DiagnosticPropertiesBuilder properties) → void
Add additional properties associated with the node.
inherited
noSuchMethod(Invocation invocation) → dynamic
Invoked when a nonexistent method or property is accessed.
inherited
toDiagnosticsNode({String? name, DiagnosticsTreeStyle? style}) → DiagnosticsNode
Returns a debug representation of the object that is used by debugging tools and by DiagnosticsNode.toStringDeep.
inherited
toString({DiagnosticLevel minLevel = DiagnosticLevel.info}) → String
A string representation of this object.
inherited
toStringDeep({String prefixLineOne = '', String? prefixOtherLines, DiagnosticLevel minLevel = DiagnosticLevel.debug, int wrapWidth = 65}) → String
Returns a string representation of this node and its descendants.
inherited
toStringShallow({String joiner = ', ', DiagnosticLevel minLevel = DiagnosticLevel.debug}) → String
Returns a one-line detailed description of the object.
inherited
toStringShort() → String
A short, textual description of this widget.
inherited

Operators

operator ==(Object other) → bool
The equality operator.
inherited