Flutter 如何在颤振中垂直对齐文本字段的hintText？

奇怪的事情发生了，由于某种原因，我无法将

hintText

垂直对齐在

TextField

内，最奇怪的事情发生在文本字段有焦点时（参见gif）。

borderRadius

丢失，显然此时已修复。当文本字段的焦点丢失时，它会再次变得混乱。我怎样才能纠正它

这是我的代码：

Widget _searchBar() {
 return Container(
  height: 40,
  child: TextField(
    textAlignVertical: TextAlignVertical.center,
    style: TextStyle(
      color: _styles["gris_oscuro1"]["color"],
    ),
    onChanged: (value) {},
    decoration: InputDecoration(
      filled: true,
      fillColor: _styles["gris_claro"]["color"],
      alignLabelWithHint: true,
      hintText: "Buscar por código",
      hintStyle: TextStyle(color: _styles["gris_oscuro2"]["color"]),
      prefixIcon:
          Icon(Icons.search, color: _styles["gris_oscuro2"]["color"]),
      enabledBorder: OutlineInputBorder(
        borderRadius: BorderRadius.all(Radius.circular(40)),
        borderSide:
            BorderSide(color: _styles["gris_claro"]["color"], width: 1.0),
      ),
    ),
  ),
);


  Scaffold(
    key: _scaffoldKey,
    backgroundColor: _styles["fondo"]["bg"],
    drawer: MenuWidget(),
    body: SafeArea(
      child: _searchBar(),
    )

---

发生这种情况是因为您为父容器提供了高度。有两种方法可以垂直对齐提示文本， （它们彼此独立，可以任意选择一个）

移除容器的高度

如果要根据需要调整父容器的大小，则必须为内容指定一些内部填充

编辑：当您点击文本字段时，您将丢失边框，因为您没有向

TextField

的

focusedBorder

属性传递任何内容。请遵循以下代码：

decoration: InputDecoration(
  filled: true,
  alignLabelWithHint: true,
  hintText: "Buscar por código",
  hintStyle: TextStyle(color: Colors.red),
  prefixIcon: Icon(Icons.search, color: Colors.red),
  enabledBorder: OutlineInputBorder(
    borderRadius: BorderRadius.all(Radius.circular(40)),
    borderSide: BorderSide(color: Colors.red, width: 1.0),
  ),
  focusedBorder: OutlineInputBorder( //Add this to your code...
    borderRadius: BorderRadius.all(Radius.circular(40)),
    borderSide: BorderSide(color: Colors.red, width: 1.0),
  ),
),

---

同样的代码对我来说非常有效。你在使用哪个频道？您可以先尝试

flatter clean

，然后

flatter升级

，或者也请共享父窗口小部件。它是否在底部页上？@SanjaySharma我更新了我的代码。@SanjaySharma我运行了您提到的命令，但仍然不起作用。您可以发布

\u searchBar（）

的代码吗？非常感谢，我想我对我的问题了解多一点。但另一个问题仍然存在，当文本字段有焦点时会发生，

borderRadius

丢失没有问题，我正在更新答案。@yavg现在检查答案。您能帮我解决这个问题吗？非常感谢。

decoration: InputDecoration(
  filled: true,
  alignLabelWithHint: true,
  hintText: "Buscar por código",
  hintStyle: TextStyle(color: Colors.red),
  prefixIcon: Icon(Icons.search, color: Colors.red),
  enabledBorder: OutlineInputBorder(
    borderRadius: BorderRadius.all(Radius.circular(40)),
    borderSide: BorderSide(color: Colors.red, width: 1.0),
  ),
  focusedBorder: OutlineInputBorder( //Add this to your code...
    borderRadius: BorderRadius.all(Radius.circular(40)),
    borderSide: BorderSide(color: Colors.red, width: 1.0),
  ),
),