PinPlusKeyBoardPackage class

A customizable PIN input widget with a custom numeric keyboard.

This widget provides a complete PIN entry solution with:

  • Customizable input fields (shape, color, size, etc.)
  • Custom numeric keyboard (0-9)
  • Support for hidden input (password-style)
  • Automatic submission when all fields are filled
  • Error handling and validation
  • Accessibility support (screen readers, keyboard navigation)
  • Animations and micro-interactions
  • Material 3 design support
  • Platform-specific optimizations
  • Biometric authentication support
  • Security features (auto-clear, rate limiting)

Example usage:

PinPlusKeyBoardPackage(
  pinInputController: PinInputController(length: 6),
  spacing: 40,
  onSubmit: () {
    print('PIN entered: ${controller.text}');
  },
)
Inheritance

Constructors

PinPlusKeyBoardPackage({Key? key, KeyboardButtonShape keyboardButtonShape = KeyboardButtonShape.defaultShape, InputShape inputShape = InputShape.defaultShape, double keyboardMaxWidth = 80, double keyboardVerticalSpacing = 8, required double spacing, Color? buttonFillColor, Color? buttonBorderColor, Color? btnTextColor, bool btnHasBorder = true, double? btnBorderThickness, double? btnElevation, Color? btnShadowColor, double? inputWidth, bool isInputHidden = false, Color inputHiddenColor = Colors.black, double inputsMaxWidth = 70, required PinInputController pinInputController, required VoidCallback onSubmit, Color? inputFillColor, Color? inputBorderColor, Color? inputTextColor, bool inputHasBorder = true, double? inputBorderThickness, double? inputElevation, Color? inputShadowColor, Color errorColor = Colors.red, double? keyboardFontSize, BorderRadius? inputBorderRadius, double? inputHeight, Color? cancelColor, String? extraInput, Icon? backButton, Icon? doneButton, InputType inputType = InputType.box, BorderRadius? keyoardBtnBorderRadius, TextStyle? inputTextStyle, Widget? leftExtraInputWidget, double? keyboardBtnSize, Color? focusColor, String? keyboardFontFamily, bool enableHapticFeedback = false, String validator(String pin)?, void onDigitEntered(String digit, int position)?, String? semanticLabel, bool enableKeyboardNavigation = true, bool enableAnimations = true, Curve animationCurve = Curves.easeInOut, Duration animationDuration = const Duration(milliseconds: 200), bool enableShakeAnimation = true, bool enableSuccessAnimation = true, bool showLoadingState = false, bool useMaterial3 = true, ColorScheme? colorScheme, bool usePlatformSpecificStyling = true, bool enableBiometric = false, BiometricService? biometricService, VoidCallback? onBiometricSuccess, VoidCallback? onBiometricFailure, String? biometricReason, SecurityService? securityService, Duration? autoClearTimeout, bool enableScreenshotBlocking = false, int maxFailedAttempts = 5, Duration rateLimitWindow = const Duration(minutes: 15), Gradient? buttonGradient, Gradient? inputGradient, Widget inputFieldBuilder(BuildContext context, int position, bool hasCharacter, String? character)?, Widget keyboardButtonBuilder(BuildContext context, String number)?, bool enableRandomKeyboard = false, bool reshuffleOnClear = false, bool reshuffleOnResume = false})
Creates a PinPlusKeyBoardPackage widget.
const

Properties

animationCurve → Curve
Animation curve for input fill animations Default: Curves.easeInOut
final
animationDuration → Duration
Duration for input fill animations Default: Duration(milliseconds: 200)
final
autoClearTimeout → Duration?
Auto-clear timeout duration PIN will be cleared after this duration of inactivity If null, auto-clear is disabled
final
backButton → Icon?
Custom icon for the backspace button
final
biometricReason → String?
Biometric authentication reason shown to user
final
biometricService → BiometricService?
Biometric service instance (optional, will create default if not provided)
final
btnBorderThickness → double?
Thickness of keyboard button borders
final
btnElevation → double?
Elevation/shadow depth for keyboard buttons
final
btnHasBorder → bool
Whether keyboard buttons should have borders
final
btnShadowColor → Color?
Shadow color for keyboard buttons
final
btnTextColor → Color?
Text color for keyboard button numbers
final
buttonBorderColor → Color?
Border color for keyboard buttons
final
buttonFillColor → Color?
Fill color for keyboard buttons
final
buttonGradient → Gradient?
Gradient for keyboard buttons If provided, overrides buttonFillColor
final
cancelColor → Color?
Color for the cancel/backspace button
final
colorScheme → ColorScheme?
Custom ColorScheme to use (overrides theme)
final
doneButton → Icon?
Custom icon for the done/submit button
final
enableAnimations → bool
Whether to enable input fill animations When enabled, input fields animate when filled
final
enableBiometric → bool
Whether to show biometric authentication button
final
enableHapticFeedback → bool
Whether to enable haptic feedback when buttons are pressed Haptic feedback provides tactile response on supported devices Default: false
final
enableKeyboardNavigation → bool
Whether to enable keyboard navigation When enabled, users can navigate using keyboard arrows
final
enableRandomKeyboard → bool
Enable random keyboard layout for enhanced security When enabled, numbers 1-9 are shuffled randomly, making it harder for observers to see which numbers are being pressed (shoulder surfing protection) Default: false
final
enableScreenshotBlocking → bool
Whether to enable screenshot blocking (Android only)
final
enableShakeAnimation → bool
Whether to show shake animation on validation errors
final
enableSuccessAnimation → bool
Whether to show success animation on completion
final
errorColor → Color
Color for error messages
final
extraInput → String?
Extra input character to display on the keyboard (e.g., "*" or "#")
final
focusColor → Color?
Color for focused/active input fields
final
hashCode → int
The hash code for this object.
no setterinherited
inputBorderColor → Color?
Border color for input fields
final
inputBorderRadius → BorderRadius?
Custom border radius for input fields
final
inputBorderThickness → double?
Thickness of input field borders
final
inputElevation → double?
Elevation/shadow depth for input fields
final
inputFieldBuilder → Widget Function(BuildContext context, int position, bool hasCharacter, String? character)?
Custom builder for input fields If provided, allows complete customization of input field appearance
final
inputFillColor → Color?
Fill color for empty input fields
final
inputGradient → Gradient?
Gradient for input fields If provided, overrides inputFillColor
final
inputHasBorder → bool
Whether input fields should have borders
final
inputHeight → double?
Height of individual input fields
final
inputHiddenColor → Color
Color used to hide the input when isInputHidden is true
final
inputShadowColor → Color?
Shadow color for input fields
final
inputShape → InputShape
Shape of the input fields
final
inputsMaxWidth → double
Maximum width of the input container as a percentage of screen width (0-100) Default: 70
final
inputTextColor → Color?
Text color for input field numbers
final
inputTextStyle → TextStyle?
Custom text style for input field text
final
inputType → InputType
Visual style of input fields (dash or box)
final
inputWidth → double?
Width of individual input fields
final
isInputHidden → bool
Whether input should be hidden (password-style)
final
key → Key?
Controls how one widget replaces another widget in the tree.
finalinherited
keyboardBtnSize → double?
Custom size for keyboard buttons
final
keyboardButtonBuilder → Widget Function(BuildContext context, String number)?
Custom builder for keyboard buttons If provided, allows complete customization of button appearance
final
keyboardButtonShape → KeyboardButtonShape
Shape of the keyboard buttons
final
keyboardFontFamily → String?
Font family for keyboard button text If null, uses the theme's default font family
final
keyboardFontSize → double?
Font size for keyboard button text
final
keyboardMaxWidth → double
Maximum width of the keyboard as a percentage of screen width (0-100) Default: 80
final
keyboardVerticalSpacing → double
Vertical spacing between keyboard button rows
final
keyoardBtnBorderRadius → BorderRadius?
Custom border radius for keyboard buttons
final
leftExtraInputWidget → Widget?
Custom widget to display on the left side of the bottom keyboard row
final
maxFailedAttempts → int
Maximum failed attempts before rate limiting Default: 5
final
onBiometricFailure → VoidCallback?
Callback when biometric authentication fails
final
onBiometricSuccess → VoidCallback?
Callback when biometric authentication succeeds
final
onDigitEntered → void Function(String digit, int position)?
Optional callback called when each digit is entered This can be used for analytics, logging, or custom behavior
final
onSubmit → VoidCallback
Callback function called when PIN is submitted This is called automatically when all fields are filled, or when the done button is pressed
final
pinInputController → PinInputController
Controller that manages the PIN input state This is required and must be initialized with the desired PIN length
final
rateLimitWindow → Duration
Rate limiting time window Default: Duration(minutes: 15)
final
reshuffleOnClear → bool
Reshuffle the keyboard layout when PIN is cleared Only effective when enableRandomKeyboard is true Default: false
final
reshuffleOnResume → bool
Reshuffle the keyboard layout when app comes to foreground Only effective when enableRandomKeyboard is true Default: false
final
runtimeType → Type
A representation of the runtime type of the object.
no setterinherited
securityService → SecurityService?
Security service instance (optional, will create default if not provided)
final
semanticLabel → String?
Semantic label for the PIN input widget Used by screen readers to describe the widget
final
showLoadingState → bool
Whether to show loading state during submission
final
spacing → double
Spacing between the input fields and the keyboard This is required to ensure proper layout
final
useMaterial3 → bool
Whether to use Material 3 design tokens When enabled, colors are derived from the theme's ColorScheme
final
usePlatformSpecificStyling → bool
Whether to use platform-specific styling When enabled, iOS and Android will have platform-appropriate styles
final
validator → String Function(String pin)?
Optional validation function that returns an error message if PIN is invalid If this returns a non-empty string, it will be displayed as an error This allows for custom validation logic (e.g., PIN must not be all same digits)
final

Methods

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