如何通过顶层TextField对齐底层TextField？

Question

我需要对齐底部输入字段与顶部输入字段。像这样：

下面是我的代码：

class CustomerInput extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Column(
      children: <Widget>[
        Row(
          children: <Widget>[
            Expanded(
              child: TextField(),
            ),
            RaisedButton(
              child: Icon(Icons.search),
              onPressed: () {},
            ),
          ],
          //   ),
        ),
          TextField(
            enabled: false,
          )
      ],
    );
  }
}

该怎么做呢？

Answer 1

在此代码中，TextField的flex属性为3，RaisedButton为1<代码>E29

“这些的总和等于4"

TextField将扩展3/4或75%，并扩展1/4或<代码>e12325%

通过这个概念，我创建了新的行并放入其中

• TextField它的flex等于top one
  • TextField它的flex等于Raisedbutton的flex。

编辑后的代码为：

      `

      Column(
      children: <Widget>[
        Row(
          children: <Widget>[
            Expanded(
              flex: 3,
              child: TextField(),
            ),
            Expanded(
              flex: 1,
              child: RaisedButton(
                child: Icon(Icons.search),
                onPressed: () {},
              ),
            ),
          ],
          //   ),
        ),
        Row(
          children: <Widget>[
            Expanded(
              flex: 3,
              child: TextField(
                enabled: false,
              ),
            ),
            Expanded(
              child: Container(),
              flex: 1,
            )
          ],
        )
      ],
    ))

`

Answer 2

下面的代码将给出您需要的确切视图。在第二个raw中，您将只为edittext/textview添加一个TextFormField/TextField。

     Column(
          children: <Widget>[
            Row(
              children: <Widget>[
                Expanded(
                  flex: 3,
                  child: TextFormField(

                  ),
                ),
                Expanded(
                  flex: 1,
                  child: RaisedButton(
                    child: Icon(Icons.search),
                    onPressed: () {},
                  ),
                ),
              ],
              //   ),
            ),
            Row(
              children: <Widget>[
                Expanded(
                  child: TextFormField(
                  ),
                )
              ],
            )
          ],
        ));