FLUTTER ECOSYSTEM

adar2378/pin_code_fields

아름다운 디자인과 애니메이션을 갖춘 핀 코드 필드를 생성하는 데 도움이 되는 플러터 패키지입니다. OTP 또는 핀 코드 입력에 유용할 수 있습니다 🤓🤓

pin_code_fields 프로젝트 이미지
Stars
795
Forks
386
최근 푸시(UTC)
2026. 9. 11.
프로젝트 상태
활성
Adar GitHub avatar
GITHUB User

Adar ↗

CTO @DevMonks-co · Mobile · Web · Backend · Open Source Contributor · Dota 2 🎮

@DevMonks-co Dhaka, Bangladesh
언어DartSwiftHTMLKotlinObjective-C

기술 주제

이 저장소가 배포한 패키지

사용 중인 의존성

의존성 목록 1 개
  • melos개발 의존성^6.0.0

원본 README

아래는 영문 원문 스냅샷입니다. 최신 내용은 GitHub에서 확인하세요.

README 펼치기 / 접기

https://i.ibb.co/X5qxF7x/export-banner.png

https://img.shields.io/pub/v/pin_code_fields

Pin Code Fields

A highly customizable Flutter package for PIN code and OTP input fields with beautiful design and animations.

Version 9.0 introduces a new headless architecture - use the ready-made Material Design implementation or build completely custom UIs!

Package Location

The publishable package is located at:

packages/pin_code_fields/

📦 View Package README for full documentation.

Quick Start

dependencies:
  pin_code_fields: ^9.0.0
import 'package:pin_code_fields/pin_code_fields.dart';

// Material Design (ready to use)
MaterialPinField(
  length: 6,
  onCompleted: (pin) => print('PIN: $pin'),
)

// Custom UI (headless)
PinInput(
  length: 4,
  builder: (context, cells) => YourCustomUI(cells),
)

Repository Structure

pin_code_fields/
├── packages/
│   └── pin_code_fields/      # 📦 Main package
│       ├── lib/
│       │   └── src/
│       │       ├── core/     # Headless input engine
│       │       └── material/ # Material Design implementation
│       ├── example/
│       ├── test/
│       ├── README.md
│       ├── CHANGELOG.md
│       └── LICENSE
├── docs/
│   └── FEATURE_COMPARISON.md
├── melos.yaml
└── CLAUDE.md

Development

This project uses melos for monorepo management.

# Install melos
dart pub global activate melos

# Bootstrap workspace
melos bootstrap

# Run tests
melos test

# Run analyzer
melos analyze

Features

  • 🎨 Headless Architecture - Full control over UI rendering
  • 📱 Material Design Ready - Beautiful out-of-the-box implementation
  • 🎮 Unified Controller - Single controller for text, focus, and errors
  • Rich Animations - Scale, fade, slide entry animations
  • 🔐 Obscure Support - Character or custom widget obscuring
  • 📋 Paste Support - Long-press to paste from clipboard
  • 📝 Form Integration - Works with Flutter's Form widget
  • 📲 Autofill Support - SMS OTP autofill for iOS/Android
  • 💫 Error Animation - Shake animation with programmatic control

Contributing

Contributions are welcome! Please feel free to submit a Pull Request.

License

MIT License - see LICENSE for details.