零基础学Flutter编程-UI控件_TextField
·
什么是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.com/hspbc/flutter_demos/tree/master/text_field_demo
其他零基础系列
《零基础学安卓编程》
《零基础学Java编程》
《零基础学鸿蒙编程》
关于我
厦门大学计算机专业 | 前华为工程师
专注《零基础学编程系列》,包含:Java | 安卓 | 前端 | Flutter | iOS | 小程序 | 鸿蒙
更多推荐


所有评论(0)