Flutter之TextFormField组件 - 简书

来源: Flutter之TextFormField组件 – 简书

/**
* 大部分属性同TextFiled
*
* TextFormField({
Key key,
this.controller,//控制正在编辑的文本。如果为空,这个小部件将创建自己的TextEditingController并使用initialValue初始化它的TextEditingController.text
String initialValue,//初始值
FocusNode focusNode,
InputDecoration decoration = const InputDecoration(),//输入器装饰
TextInputType keyboardType,//弹出键盘的类型
TextCapitalization textCapitalization = TextCapitalization.none,//户输入中的字母大写的选项,TextCapitalization.sentences每个句子的首字母大写,TextCapitalization.characters:句子中的所有字符都大写,TextCapitalization.words : 将每个单词的首字母大写。
TextInputAction textInputAction,//更改TextField的textInputAction可以更改键盘右下角的操作按钮,搜索,完成
TextStyle style,
TextDirection textDirection,//文字显示方向
TextAlign textAlign = TextAlign.start,//文字显示位置
bool autofocus = false,//自动获取焦点
bool obscureText = false,//是否隐藏输入,true密码样式显示,false明文显示
bool autocorrect = true,
bool autovalidate = false,//是否自动验证值
bool maxLengthEnforced = true,
int maxLines = 1,//编辑框最多显示行数
int maxLength,//输入最大长度,并且默认情况下会将计数器添加到TextField
VoidCallback onEditingComplete,//当用户提交时调用
ValueChanged onFieldSubmitted,
FormFieldSetter onSaved,//当Form表单调用保存方法save时回调
FormFieldValidator validator,//Form表单验证
List inputFormatters,
bool enabled = true,
Brightness keyboardAppearance,
EdgeInsets scrollPadding = const EdgeInsets.all(20.0),
bool enableInteractiveSelection = true,
})
*/

body: Container(
padding: EdgeInsets.all(12.0),
color: Color(0xfff1f1f1),
child: Form(
key: _globalKey,
child: Column(
children: [
TextFormField(
decoration: InputDecoration(
labelText: "请输入用户名",
labelStyle: TextStyle(
color: Colors.green,
fontSize: 20.0
)
),
onSaved: (value) { //formState.save()方法执行完之后执行onSaved方法
print("!!!!!!!!!!!!!!!! onSaved");
name = value;
},
onFieldSubmitted: (value) {
print("!!!!!!!!!!!!!!!! onFieldSubmitted:$value");
},
onEditingComplete: () {
print("!!!!!!!!!!!!!!!! onEditingComplete");
},
),
TextFormField(
decoration: InputDecoration(
labelText: "请输入密码"
),
onSaved: (value) {
passWord = value;
},
obscureText: true,
autovalidate: true,
validator: (value) {
return value.length < 4 ? "密码长度不够4位" : null;
},
),
Container(
margin: EdgeInsets.only(top: 20.0),
width: 200,
height: 40,
child: RaisedButton(
onPressed: dologin,
child: Text("登录"),
),
)
],
),
),
),

/**
* 表单
*
* const Form({
Key key,
@required this.child,
this.autovalidate = false,//是否自动提交表单
this.onWillPop,
this.onChanged,//当FormFiled值改变时的回调函数
})
*/

赞(0) 打赏
分享到: 更多 (0)

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏