如何放置 "X" 来清除我的 Flutter TextField Widget 中的搜索框？

Question

下面的代码提供了用于搜索的 TextField，但是，我希望在右侧清除 "X"，这样用户就可以清除搜索而无需退格。

TextField(
            decoration: InputDecoration(
                contentPadding: EdgeInsets.all(16.0),
                prefixIcon: Icon(
                  Icons.search,
                  color: Colors.white,
                ),
                //Placeholder potential X for clearing search
                /*suffix: IconButton(
                    icon: Icon(Icons.clear), onPressed: () => TODO),*/
                hintText: 'Search by name',
                hintStyle: TextStyle(
                    fontWeight: FontWeight.w500, color: Colors.white)),
            onChanged: (string) {
              setState(() {
                filterAssets = assets
                    .where((test) => (test.name
                        .toLowerCase()
                        .contains(string.toLowerCase())))
                    .toList();
              });
            },
          ),

Answer 1

给它一个textController..

而且onPressed你可以清除它..


TextField(
            controller: textController,
            decoration: InputDecoration(
                contentPadding: EdgeInsets.all(16.0),
                prefixIcon: Icon(
                  Icons.search,
                  color: Colors.white,
                ),
                //Placeholder potential X for clearing search
                suffix: IconButton(
                    icon: Icon(Icons.clear), onPressed: () => textController.clear()),
                hintText: 'Search by name',
                hintStyle: TextStyle(
                    fontWeight: FontWeight.w500, color: Colors.white)),
            onChanged: (string) {
              setState(() {
                filterAssets = assets
                    .where((test) => (test.name
                        .toLowerCase()
                        .contains(string.toLowerCase())))
                    .toList();
              });
            },
          ),

希望它能解决您的问题..

如何放置 "X" 来清除我的 Flutter TextField Widget 中的搜索框？

How to I put an "X" to clear the search box in my Flutter TextField Widget?

widget

textfield

flutter