pin input text field

立即下载 ️⬇️

pub package

pin_input_text_field

PinInputTextField是一个Flutter平台上用来展示不同样式的验证码,简单好用!

例子🌰

装饰器

UnderlineDecoration

BoxLooseDecoration

BoxTightDecoration

安装

pub安装最新版.

使用

属性

PinInputTextField的自定义属性

属性名 参考值 描述
pinLength 6 验证码的长度, 默认是6
onSubmit (String pin){} 用户点击键盘右下角时触发,Android平台有时不一定生效
decoration BoxLooseDecoration 内置三种验证码样式,默认是BoxLooseDecoration
inputFormatters WhitelistingTextInputFormatter.digitsOnly 跟TextField的inputFormatters一样, 默认是WhitelistingTextInputFormatter.digitsOnly
keyboardType TextInputType.phone 跟TextField的keyboardType一样, 默认是TextInputType.phone
pinEditingController PinEditingController 控制和监听用户输入。如果为空,内部会创建一个默认的控制器
autoFocus false 跟TextField的autoFocus一样, 默认是false
focusNode FocusNode 跟TextField的focusNode一样.
textInputAction TextInputAction.done 跟TextField的textInputAction一样, 数字模式下无效
enabled true 跟TextField的enabled, 默认是true

密码模式

/// 是否需要替换[obscureText]开启密码模式.
final bool isTextObscure;
/// 当[isTextObscure]开启时,替换验证码的字符串,支持emoji
final String obscureText;

已知问题

目前PinEditingController的Listener会执行多次,可以在应用层的代码上过滤下

0%