secure_pin_input 0.0.1

A customizable and secure PIN input field widget for Flutter apps.

🔐 SecurePinInput

A customizable and secure PIN input field widget for Flutter apps. Supports clipboard autofill, field validation, visibility toggle, and custom styling — perfect for OTPs, PINs, and access codes.

✨ Features

🔢 Customizable PIN length

🛡 Obscure or reveal input characters

🎨 Custom box decoration and text style

📋 Autofill from clipboard (e.g., OTP)

✅ Real-time validation support

⚙ Fully customizable & developer-friendly

📦 Installation

Add this to your pubspec.yaml:

dependencies:
  secure_pin_input: ^1.0.0

Then run: flutter pub get

🧑‍💻 Usage

import 'package:secure_pin_input/secure_pin_input.dart';

SecurePinInput(
  length: 6,
  onCompleted: (pin) {
    print("PIN Entered: $pin");
  },
  validator: (pin) {
    if (pin != '123456') {
      return 'Invalid PIN';
    }
    return null;
  },
  obscureText: true,
  showVisibilityToggle: true,
  enableClipboardAutofill: true,
  fillColor: Colors.grey.shade200,
  boxDecoration: BoxDecoration(
    border: Border.all(color: Colors.blue),
    borderRadius: BorderRadius.circular(10),
  ),
  textStyle: const TextStyle(
    fontSize: 18,
    color: Colors.black,
    fontWeight: FontWeight.bold,
  ),
)

🧰 Parameters

Name | Type | Description | Default length | int | Number of digits in the PIN input | 6 onCompleted | ValueChanged

Example (With Validation)

SecurePinInput(
  length: 4,
  onCompleted: (pin) => debugPrint('Entered PIN: $pin'),
  validator: (pin) {
    if (pin != '0000') return 'Incorrect PIN';
    return null;
  },
  fillColor: Colors.grey.shade100,
)

✅ TODO

Add animation support

Add accessibility enhancements

Add support for paste handling via long-press

🧑‍💼 Maintainer

Developed and maintained by Abiola Gbode 🛠 For bugs or feature requests, open an issue.

📄 License

MIT