什么是TextField

TextField是用于输入文本信息的UI控件.常见效果如下：

基础样例

1.普通输入

效果图

代码

TextField()

2.设置输入框提示信息

效果图

代码

TextField(decoration: InputDecoration(hintText: "花生皮编程"),)

3.设置文字颜色

效果图

代码

TextField(style: TextStyle(color: Color.fromRGBO(0xFF, 0x50, 0xa1, 1)))

4.显示外边框

效果图

代码

TextField(decoration: InputDecoration(border: OutlineInputBorder()),)

常用属性及方法

属性(方法)名	用途
controller	文本控制器
focusNode	获取键盘焦点
decoration	InputDecoration
inputType	keyboardType
textInputAction	键盘的操作按钮类型
textCapitalization	TextCapitalization.none
style	输入文本样式
textAlign	TextAlign.start
textDirection	文本方向
readOnly	只读
showCursor	显示光标
autofocus	是否自动对焦
obscureText	是否隐藏内容，例如密码格式
obscuringCharacter	隐藏格式
autocorrect	是否自动校正
maxLines	最大行数，设置为null表示支持多行输入，不显示行数
minLines	最小行数
maxLength	允许输入的最大长度
maxLengthEnforced	是否允许超过输入最大长度
onChanged	文本内容变更时回调
onEditingComplete	提交内容时回调
onSubmitted	用户提示完成时回调
inputFormatters	验证及格式
enabled	是否不可点击
cursorWidth	光标宽度
cursorRadius	光标圆角弧度
cursorColor	光标颜色
keyboardAppearance	键盘亮度,仅限于iOS设备
scrollPadding	滚动到视图中时，填充边距
enableInteractiveSelection	长按是否展示【剪切/复制/粘贴菜单LengthLimitingTextInputFormatter】
onTap	点击时回调
scrollController	滑动控制器
scrollPhysics	滑动样式

完整源代码

https://gitee/hspbc/flutter_demos/tree/master/text_field_demo

其他零基础系列

《零基础学安卓编程》
《零基础学Java编程》
《零基础学鸿蒙编程》

关于我

厦门大学计算机专业 | 前华为工程师
专注《零基础学编程系列》，包含：Java | 安卓 | 前端 | Flutter | iOS | 小程序 | 鸿蒙
全网可关注：花生皮编程