flutter - 单击TextFormField后，容器装饰消失

当我单击带有子textformfield的容器时，装饰消失。
这是应用程序的当前行为：

似乎backgroundBlendMode属性有问题，但我不知道如何在没有它的情况下创建相同的设计。

  static Decoration _buttonDecoration = BoxDecoration(
      backgroundBlendMode: BlendMode.modulate,
      color: Color(0xFF938890),
      borderRadius: BorderRadius.all(Radius.circular(45)));

  Widget _emailTextField = _createTextField('Email', TextInputType.emailAddress,
      Icon(Icons.email, color: Colors.white));

  Widget _passwordTextField = _createTextField(
      'Password',
      TextInputType.text,
      Icon(
        Icons.lock,
        color: Colors.white,
      ));

static Widget _createTextField(
      String hintText, TextInputType textInputType, Icon icon) {
    return Container(
      padding: EdgeInsets.only(left: 20, right: 20),
      decoration: _buttonDecoration,
      margin: EdgeInsets.only(top: 20),
      width: 250,
      child: TextFormField(
        focusNode: FocusNode(),
        obscureText: textInputType == TextInputType.text ? true : false,
        maxLines: 1,
        keyboardType: textInputType,
        autocorrect: true,
        textInputAction: TextInputAction.done,
        style: TextStyle(color: Colors.white),
        decoration: InputDecoration(
            border: InputBorder.none,
            icon: icon,
            hintText: hintText,
            hintStyle: TextStyle(color: Colors.white)),
      ),
    );
  }

最佳答案

您的代码中有一些东西需要更改。
首先，不要使用Container来装饰TextFormField，因为这个小部件已经处理了这种样式。
如果您需要的话，可以使用prefixIcon而不是icon将其保存在TextFormField中。
如果需要设置小部件的大小（不带宽度属性），则使用SizedBox是更好的选择。
它不是直接相关的，但不使用返回小部件的方法。您应该创建单独的Stateless或Stateful小部件。
这里有一个例子：

OutlineInputBorder _outlineBorder = OutlineInputBorder(
  borderRadius: BorderRadius.all(Radius.circular(45)),
  borderSide: BorderSide(
    style: BorderStyle.none,
  ),
);


SizedBox(
  width: 250.0,
  child: TextFormField(
    style: TextStyle(
      color: Colors.white,
    ),
    decoration: InputDecoration(
      border: _outlineBorder,
      enabledBorder: _outlineBorder,
      focusedBorder: _outlineBorder,
      prefixIcon: Icon(
        Icons.mail,
        color: Colors.white,
      ),
      hintText: 'Email',
      hintStyle: TextStyle(color: Colors.white),
      filled: true,
      fillColor: Colors.black45.withOpacity(0.4),
    ),
  ),
),

更新：
测试了它，但忘了对enabledBorder和focusedBorder应用相同的样式。这样，当聚焦于TextFormField时，边框颜色不会改变。我已经更新了代码来反映这一点。

关于flutter - 单击TextFormField后，容器装饰消失，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/56775291/