flutter - Flutter TextFormField 带有动态后缀图标
问题描述
目的是显示/隐藏清除 Flutter TextFormField 上的字段的 suffixIcon。只有在框中有文本时它才应该可见。
该字段如下所示:
TextFormField(
controller: _usernameController,
decoration: InputDecoration(
labelText: 'Username',
suffixIcon: usernameNotEmpty == true ? IconButton(
onPressed: () {
_usernameController.clear();
},
icon: Icon(Icons.cancel, color: Colors.grey)
) : null
),
)
事件侦听器如下所示:
var usernameNotEmpty;
_usernameController.addListener(() {
usernameNotEmpty = _usernameController.text.length > 0 ? true : false;
print(_usernameController.text);
});
所以实时更新的文本确实出现在控制台中。但suffixIcon
从未显示。由于 TextFormField 没有onChange
事件,如何suffixIcon
显示/隐藏?
解决方案
清理和工作:
_usernameController.addListener(() {
setState(() {});
});
TextFormField(
controller: _usernameController,
decoration: InputDecoration(
labelText: 'Username',
suffixIcon: _usernameController.text.length > 0 ? IconButton(
onPressed: () {
_usernameController.clear();
},
icon: Icon(Icons.cancel, color: Colors.grey)
) : null
),
)
推荐阅读
- python - 如何使用时间在 datetimeIndex 数组中进行索引
- php - 404 未找到;Apache Server 无法加载简单的 php 文件
- arrays - 使用数组将文本从一个工作表传递到另一个工作表
- python - 协助 Python 函数
- react-native - 反应本机和 fblogin - ld:找不到 -lBolts 的库
- angular - 如何从 Angular 的 PrimeNG 库中为 AutoComplete 组件设置焦点
- r - 在 R 中,如何定义模型对比以比较两个条件相对于一个公共控件?
- webpack - mini-css-extract-plugin TypeError:无法匹配“未定义”或“空”
- ruby-on-rails - Rails/Sidekiq:帮助我理解这个 `initializers/sidekiq.rb` 示例中的重复
- android - 色调属性导致矢量图形上的像素化