一行中的多个带有填充的文本字段答案

【问题标题】：multiple text fields in a row with padding一行中的多个带有填充的文本字段
【发布时间】：2019-04-12 11:01:10
【问题描述】：

我想创建一个并排放置多个文本的行。在行小部件中添加文本文件会导致错误，所以我用谷歌搜索了这个问题并找到了一个解决方案，它使用灵活的小部件将文本字段放在一行中并且效果很好，但是当我尝试向文本文件添加填充以查看多个时提交的文本，我的代码在这里不起作用：

new Row(
      mainAxisAlignment: MainAxisAlignment.spaceBetween,
      children: <Widget>[
        new Flexible(
          child: new TextField(
              decoration: InputDecoration(
                  contentPadding: EdgeInsets.all(10)
              )
          ),
        ),
        new Flexible(
          child: new TextField(
              decoration: InputDecoration(
                  contentPadding: EdgeInsets.all(10)
              )
          ),
        ),
        new Flexible(
          child: new TextField(
              decoration: InputDecoration(
                  contentPadding: EdgeInsets.all(10)
              )
          ),
        ),
      ],
),

我想要像下面这样的图片：

如何在文本文件中添加一些填充。我想知道有没有什么方法可以通过一个文本文件来实现这一目标？

【问题讨论】：

也许看下划线输入边框？ docs.flutter.io/flutter/material/…

标签： dart flutter

【解决方案1】：

您可以在两者之间添加SizedBox。 TextField 会在您使用 Flexible 时尝试获得最大尺寸，因此即使您使用 spaceBetween，中间也不会留下空格。

new Row(
  mainAxisAlignment: MainAxisAlignment.spaceBetween,
  children: <Widget>[
    new Flexible(
      child: new TextField(
          decoration: InputDecoration(
              contentPadding: EdgeInsets.all(10)
          )
      ),
    ),
    SizedBox(width: 20.0,),
    new Flexible(
      child: new TextField(
          decoration: InputDecoration(
              contentPadding: EdgeInsets.all(10)
          )
      ),
    ),
    SizedBox(width: 20.0,),
    new Flexible(
      child: new TextField(
          decoration: InputDecoration(
              contentPadding: EdgeInsets.all(10)
          )
      ),
    ),
  ],
),

您也可以在TextField 周围使用Padding。

new Row(
  mainAxisAlignment: MainAxisAlignment.spaceBetween,
  children: <Widget>[
    new Flexible(
      child: Padding(
        padding: const EdgeInsets.all(20.0),
        child: new TextField(
            decoration: InputDecoration(
                contentPadding: EdgeInsets.all(10)
            )
        ),
      ),
    ),
    new Flexible(
      child: Padding(
        padding: const EdgeInsets.all(20.0),
        child: new TextField(
            decoration: InputDecoration(
                contentPadding: EdgeInsets.all(10)
            )
        ),
      ),
    ),
    new Flexible(
      child: Padding(
        padding: const EdgeInsets.all(20.0),
        child: new TextField(
            decoration: InputDecoration(
                contentPadding: EdgeInsets.all(10)
            )
        ),
      ),
    ),
  ],
),

【讨论】：