MaterialPinField class

A ready-to-use Material Design PIN field.

This widget provides a complete, styled PIN input experience using Material Design principles. It wraps PinInput with Material-styled cells and animations.

Example:

MaterialPinField(
  length: 6,
  onCompleted: (pin) => print('PIN: $pin'),
  theme: MaterialPinTheme(
    shape: MaterialPinShape.outlined,
    cellSize: Size(56, 64),
  ),
)
Inheritance

Constructors

MaterialPinField({Key? key, required int length, MaterialPinTheme theme = const MaterialPinTheme(), PinInputController? pinController, String? initialValue, TextInputType keyboardType = TextInputType.number, TextInputAction textInputAction = TextInputAction.done, List<TextInputFormatter>? inputFormatters, TextCapitalization textCapitalization = TextCapitalization.none, Iterable<String>? autofillHints, bool enableAutofill = false, AutofillContextAction autofillContextAction = AutofillContextAction.commit, bool enabled = true, bool autoFocus = false, bool readOnly = false, bool autoDismissKeyboard = true, bool clearErrorOnInput = true, bool obscureText = false, Widget? obscuringWidget, bool blinkWhenObscuring = true, Duration blinkDuration = const Duration(milliseconds: 500), bool enableHapticFeedback = true, HapticFeedbackType hapticFeedbackType = HapticFeedbackType.light, bool enablePaste = true, ValueChanged<String>? onClipboardFound, bool clipboardValidator(String text, int length)?, ValueChanged<String>? onChanged, ValueChanged<String>? onCompleted, ValueChanged<String>? onSubmitted, VoidCallback? onEditingComplete, VoidCallback? onTap, VoidCallback? onLongPress, void onTapOutside(PointerDownEvent event)?, String? hintCharacter, Widget? hintWidget, TextStyle? hintStyle, Widget separatorBuilder(BuildContext context, int index)?, MainAxisAlignment mainAxisAlignment = MainAxisAlignment.center, CrossAxisAlignment crossAxisAlignment = CrossAxisAlignment.center, MouseCursor? mouseCursor, Brightness? keyboardAppearance, EdgeInsets scrollPadding = const EdgeInsets.all(20), String? errorText, Widget errorBuilder(String? errorText)?, TextStyle? errorTextStyle, String? semanticLabel})
const

Properties

autoDismissKeyboard → bool
Whether to dismiss the keyboard when PIN is complete.
final
autofillContextAction → AutofillContextAction
The action to take when the autofill context is disposed.
final
autofillHints → Iterable<String>?
Autofill hints for the text field.
final
autoFocus → bool
Whether to auto-focus on mount.
final
blinkDuration → Duration
Duration to show the character before obscuring.
final
blinkWhenObscuring → bool
Whether to briefly show the character before obscuring.
final
clearErrorOnInput → bool
Whether to automatically clear error state when user types.
final
clipboardValidator → bool Function(String text, int length)?
Custom validator for clipboard content.
final
crossAxisAlignment → CrossAxisAlignment
How the cells should be aligned vertically.
final
enableAutofill → bool
Whether to enable autofill functionality.
final
enabled → bool
Whether the field is enabled.
final
enableHapticFeedback → bool
Whether to trigger haptic feedback on input.
final
enablePaste → bool
Whether to enable paste functionality.
final
errorBuilder → Widget Function(String? errorText)?
Custom builder for error display.
final
errorText → String?
Error text to display below the PIN field.
final
errorTextStyle → TextStyle?
Text style for the default error text display.
final
hapticFeedbackType → HapticFeedbackType
Type of haptic feedback to trigger.
final
hashCode → int
The hash code for this object.
no setterinherited
hintCharacter → String?
Hint character to show in empty cells.
final
hintStyle → TextStyle?
Style for hint character.
final
hintWidget → Widget?
Custom widget to show in empty cells.
final
initialValue → String?
Initial value for the PIN input.
final
inputFormatters → List<TextInputFormatter>?
Additional input formatters to apply.
final
key → Key?
Controls how one widget replaces another widget in the tree.
finalinherited
keyboardAppearance → Brightness?
The brightness of the keyboard.
final
keyboardType → TextInputType
The type of keyboard to display.
final
length → int
Number of PIN cells.
final
mainAxisAlignment → MainAxisAlignment
How the cells should be aligned horizontally.
final
mouseCursor → MouseCursor?
The mouse cursor to show when hovering over the widget.
final
obscureText → bool
Whether to obscure the entered text.
final
obscuringWidget → Widget?
Custom widget to show when obscuring text.
final
onChanged → ValueChanged<String>?
Called when the text changes.
final
onClipboardFound → ValueChanged<String>?
Called when the clipboard contains valid PIN-like content on focus.
final
onCompleted → ValueChanged<String>?
Called when the PIN is complete.
final
onEditingComplete → VoidCallback?
Called when editing is complete.
final
onLongPress → VoidCallback?
Called when the widget is long pressed.
final
onSubmitted → ValueChanged<String>?
Called when the user submits.
final
onTap → VoidCallback?
Called when the widget is tapped.
final
onTapOutside → void Function(PointerDownEvent event)?
Called when user taps outside the field.
final
pinController → PinInputController?
Controller for the PIN input.
final
readOnly → bool
Whether the field is read-only.
final
runtimeType → Type
A representation of the runtime type of the object.
no setterinherited
scrollPadding → EdgeInsets
Padding when scrolling the field into view.
final
semanticLabel → String?
Semantic label for accessibility.
final
separatorBuilder → Widget Function(BuildContext context, int index)?
Optional builder for separators between cells.
final
textCapitalization → TextCapitalization
How to capitalize text input.
final
textInputAction → TextInputAction
The action button to display on the keyboard.
final
theme → MaterialPinTheme
Theme configuration for the PIN field.
final

Methods

createElement() → StatefulElement
Creates a StatefulElement to manage this widget's location in the tree.
inherited
createState() → State<MaterialPinField>
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