flutter - TextField 占位符和文本垂直对齐不正确

问题描述

我正在使用 Flutter 开发移动应用程序。我在对齐文本字段的占位符文本及其值垂直居中时遇到问题。

这是我的 TextField 代码。

return Container(
      color: Colors.black,
      child: Padding(
        padding: EdgeInsets.all(10),
        child: TextField(
          onChanged: (text) {
            this.filter = text.toLowerCase();
            this._refreshListItems();
          },
          style: TextStyle(
            height: 0.5
          ),
          cursorColor: Colors.black12,
          textAlignVertical: TextAlignVertical.center,
          decoration: InputDecoration(
            filled: true,
            fillColor: Colors.white,
              prefixIcon: Icon(Icons.search, color: Colors.black26,),
              border: OutlineInputBorder(
                borderRadius: const BorderRadius.all(
                  const Radius.circular(10.0),
                ),
              ),
              hintText: "Search",
            focusedBorder: OutlineInputBorder(
                borderSide: BorderSide(color: Colors.white),
              borderRadius: const BorderRadius.all(
                const Radius.circular(10.0),
              ),
            ),
          ),
        ),
      )
    );

但是，当它被渲染时，占位符和它的值会在垂直方向上稍微向上一点，如下面的屏幕截图所示。

我的代码有什么问题，我该如何解决？

标签： flutterflutter-text

将文本样式高度设置为 0.5 会导致文本跨度为字体大小的一半。删除它，因为不认为这会帮助你。

style: TextStyle(
    height: 0.5
),

为了处理内容大小，您可以使用contentPadding

decoration: InputDecoration(
   contentPadding: EdgeInsets.all(1),
   ....
   ),

我使用了以下代码，它正在工作

contentPadding: EdgeInsets.fromLTRB(0, 8, 0, 0),

flutter - TextField 占位符和文本垂直对齐不正确

问题描述

解决方案

推荐阅读