Flutter TextField

本文详细介绍了Flutter中的TextField组件,包括如何监听文本输入变化和处理焦点事件。通过示例代码展示了两种监听输入内容的方法,并解释了如何利用FocusNode控制文本框的聚焦与失焦状态。
摘要由CSDN通过智能技术生成

TextField

textField用于文本输入,它提供了很多属性:

const TextField({
   ...
   TextEditingController controller, 
   FocusNode focusNode,
   InputDecoration decoration = const InputDecoration(),
   TextInputType keyboardType,
   TextInputAction textInputAction,
   TextStyle style,
   TextAlign textAlign = TextAlign.start,
   bool autofocus = false,
   bool obscureText = false,
   int maxLines = 1,
   int maxLength,
   this.maxLengthEnforcement,
   ToolbarOptions? toolbarOptions,
   ValueChanged<String> onChanged,
   VoidCallback onEditingComplete,
   ValueChanged<String> onSubmitted,
   List<TextInputFormatter> inputFormatters,
   bool enabled,
   this.cursorWidth = 2.0,
   this.cursorRadius,
   this.cursorColor,
   this.onTap,
   ...
 })

属性 类型 说明
controller TextEditingController 控制器,通过它可以获取文本内容,监听编辑文本事件,大多数情况下我们需要主动提供一个控制器
focusNode InputDecoration 焦点控制
decoration InputDecoration 用于控制文本的外观,如提示文本、背景色、边框等
keyboardType TextInputType 用于设置输入框的默认键盘类型
textInputAction TextInputAction 键盘动作图标按钮,他是一个枚举值
style TextStyle 正在编辑的文本样式
textAlign TextAlign 文本框的在水平方向的对齐方式
autofocus bool 是否自动获取焦点
obscureText bool 是否隐藏正在编辑的文本,用于密码输入场景
maxLines int 输入框的最大行数
maxlength int 文本框的最大长度
maxLengthEnforcement 当文本长度超出文本框长度时如何处理
toolbarOptions ToolbarOptions 长按时出现的选项
onChange</
  • 1
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值