Question

根据我的设计，我有一个TextField，高度为30pt。

这就是我要这样做的方式：

Container(
            height: 30,
            child: new TextField(
              textAlign: TextAlign.start,
              decoration: new InputDecoration(
                  prefixIcon: Icon(Icons.search),
                  border: new OutlineInputBorder(
                    borderRadius: const BorderRadius.all(
                      const Radius.circular(30.0),
                    ),
                  ),
                  filled: true,
                  hintStyle: new TextStyle(color: Colors.grey[800]),
                  hintText: "Search",
                  fillColor: Colors.lightGreen),
            )),

结果如下：

如何垂直对齐提示和文本？

Answer 1

在InputDecoration中将contentPadding设置为EdgeInsets.symmetric（horizontal：0）。这将删除文本的默认水平填充：

Container(
    height: 35,
    child: TextField(
      decoration: InputDecoration(
          contentPadding: EdgeInsets.symmetric(horizontal: 0),
          prefixIcon: Icon(Icons.search),
          border: OutlineInputBorder(
            borderRadius: const BorderRadius.all(
              const Radius.circular(5.0),
            ),
          ),
          filled: true,
          hintStyle: TextStyle(color: Colors.grey[800]),
          hintText: "Search",
          fillColor: Colors.lightGreen),
    ),
  ),

更改高度后，文本在文本字段中的位置错误

1 个答案: