如何将清除按钮添加到TextField小部件 [英] How to add clear button to TextField Widget

问题描述

是否有正确的方法向 TextField 添加清除按钮？

Is there a proper way to add a clear button to the TextField?

就像材料设计指南中的这张图片一样：

Just like this picture from Material design guidelines:

我发现是在 InputDecoration IconButton $ c>的 suffixIcon 。

What I found is to set a clear IconButton in the InputDecoration's suffixIcon. Is this the right way?

推荐答案

输出：

创建变量

var _controller = TextEditingController();

和您的 TextField ：

TextField(
  controller: _controller,
  decoration: InputDecoration(
    hintText: "Enter a message",
    suffixIcon: IconButton(
      onPressed: () => _controller.clear(),
      icon: Icon(Icons.clear),
    ),
  ),
)

这篇关于如何将清除按钮添加到TextField小部件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！