如何删除 Flutter Widget 上 TextField 的背景颜色？

Question

我无法删除 TextField 的阴影和背景，这是我的代码：

TextFormField(
                            decoration: InputDecoration.collapsed(),
                            validator: (input) =>
                                input == "" ? 'The task is empty' : null,
                            onSaved: (input) => task = input,
                          )

这是我想要的结果

我总是尝试 BoxDecoration 但没有成功，因为不与 TextFormField 兼容。

Answer 1

您应该将填充设置为 true。

TextField(decoration: InputDecoration( fillColor: Colors.red, filled: true)),

Answer 2

将您的TextFormField包裹在Container并更改其color属性以匹配您的背景颜色（从您的图片中我会假设它是white ）：

     Container(
        color: Colors.white, // or any color that matches your background
        child: TextFormField(
                 decoration: InputDecoration.collapsed(),
                 validator: (input) => input == "" ? 'The task is empty' : null,
                 onSaved: (input) => task = input,
               )
     ),

Answer 3

您可以通过将TextField包装在Theme小部件中并将splashColor设置为透明来使其透明

Theme(
  data: Theme.of(context).copyWith(splashColor: Colors.transparent),
  child: TextField(
    autofocus: false,
    style: TextStyle(fontSize: 22.0, color: Color(0xFFbdc6cf)),
    decoration: InputDecoration(
      filled: true,
      fillColor: Colors.white,
      hintText: 'Search',
    ),
  ),
);