flutterotpfield

Description:

flutterotpfield

Flutter Otp Field #
Customizable OTP field.



Checkout example project
Installation #

Run this command:

$ flutter pub add flutterotpfield
copied to clipboard
or manually add this to your pubspec.yaml
dependencies:
flutterotpfield: ^0.0.3
copied to clipboard

Import package

import 'package:flutterotpfield/flutterotpfield.dart';
copied to clipboard

Use FlutterOtpField widget

FlutterOtpField(
inputFieldLength: 6,
spaceBetweenFields: 10,
onValueChange: (String value) {
print("otp changed $value");
},
onCompleted: (String value) {
print("otp $value");
},)
copied to clipboard
Documentation #

Name
Default Value
Description
Required/Optional

inputFieldLength
No default value
Length of the otp boxes
Required


inputFieldHeight
50
Height of the single otp field
Optional


inputFieldWidth
50
Width of the single otp field
Optional


otpWidgetHeight
50
Height of the otp widget
Optional


spaceBetweenFields
5
Space between two otp fields
Optional


autoFocus
true
Focus of the first otp field
Optional


onValueChange
-
Callback function. When single field value is changed, you'll receive value in the onValueChange.
Required


onCompleted
-
Callback function. When all otp fields are filled, you'll receive otp value in the onCompleted.
Required


inputDecoration
-
Input decoration for the otp field
Optional


cursorColor
Black
Color of the cursor
Optional


scrollPhysics
NeverScrollableScrollPhysics
ScrollPhysics for otp widget
Optional