如何在TextField中垂直居中不同大小的hintText？答案

【问题标题】：How to vertically center differently-sized hintText in TextField?如何在TextField中垂直居中不同大小的hintText？
【发布时间】：2018-04-30 15:50:06
【问题描述】：

我有一个像这样的TextField，其中输入文本和提示文本的大小不同。

TextField(
    style: Theme.of(context).textTheme.subhead.copyWith(
      fontSize: 70.0,
    ),
    decoration: InputDecoration(
      hintText: 'Enter a number',
      hideDivider: true,
      hintStyle: TextStyle(
        color: Colors.grey[500],
        fontSize: 25.0,
      ),
    ),
);

虽然用户输入文本在我的父容器中居中，但hintText 不是（顶部空间比底部空间大）。有没有办法让提示文本也垂直居中？

提示文本与输入文本大小不一样的原因是它占用的空间比绿色容器多，所以看起来像Enter a nu...，对用户不太友好。（或者，有没有办法在提示文本中添加换行符？）

【问题讨论】：

整个 TextField 已经作为一个小部件居中，我认为没有办法单独更改提示文本，你的小部件已经居中你想要实现什么？
包含输入文本的小部件居中，但其附带的尺寸较小的提示文本未居中。我用更好的图像示例更新了我的问题。我希望hintText Enter a number 垂直居中。

标签： flutter dart flutter-layout

【解决方案1】：

我看到这已经超过 2 年了，但万一其他人遇到这个问题：

InputDecoration 具有 contentPadding 属性。

TextField(
  decoration: InputDecoration(
    hintText: 'Hint Text',
    contentPadding: EdgeInsets.all(10.0),
  ),
);

【讨论】：

【解决方案2】：

new TextField(
  decoration: new InputDecoration(
    hintText: 'your hint',
  ),
  textAlign: TextAlign.center,
)

textAlign: TextAlign.center 会让你的提示出现在中心。

【讨论】：

谈身高
是的，我应该澄清一下——我说的是垂直居中，而不是水平居中。我已经更新了我的问题。

【解决方案3】：

以下是您的问题的解决方案：

Container(
  color: Colors.red,
  width: 1000,
  height: 500,
  alignment: Alignment.center,
  child: TextFormField(
    keyboardType: TextInputType.emailAddress,
    autofocus: false,
    style: new TextStyle(fontSize: 20),
    decoration: InputDecoration(
        hintText: 'Email', hintStyle: TextStyle(color: Color(0xff777777))),
  ),
)

【讨论】：