dart - 在一行中对齐 TextField 和 FlatButton

Question

下面的代码运行良好，并在 TextField 下显示 FlatButton:

import 'package:flutter/material.dart';

class LocationCapture extends StatelessWidget {
  LocationCapture(this.clickCallback, this.tc);
  final TextEditingController tc;
  final VoidCallback clickCallback;

  @override
  Widget build(BuildContext context) {
    return Column(
        mainAxisSize: MainAxisSize.min,
        children: <Widget>[
      //    Row(
      //        children: <Widget>[
                TextField(controller: tc,),
                FlatButton(
                  child: const Icon(Icons.my_location),
                  onPressed: () => clickCallback(),
                )
      //    ])
    ]);
  }
}

我尝试添加 Row 使它们成为单行，但它不起作用，并且显示空白屏幕!!

**更新**

通过将每个元素包装到一个容器中，我能够将它们排成一行，但仍然对此不满意，因为它需要我分配容器宽度，我需要自动完成:

Row(
    mainAxisAlignment: MainAxisAlignment.center,
    children: <Widget>[
      Container(
          width: 180,
          child: TextField(
              controller: tc,
              enabled: false,
              textAlign: TextAlign.center,
              decoration: InputDecoration.collapsed(hintText: "")
          )
      ),
      Container(
          child: FlatButton(
                 child: const Icon(Icons.my_location),
                 onPressed: () => clickCallback(),
          )
      ),
    ]
);

Answer 1

这就是您可以做到的。

Row() 小部件的

textDirection 属性将允许您从上述方向开始定位子小部件。

注意:- **如果您在项目中使用 MaterialApp() 小部件，则可以删除或注释掉“textDirection”。它负责 textDirection。

Expanded() 小部件用于占据剩余的整个空间。

 child: Row(
            textDirection: TextDirection.rtl,
            children: <Widget>[
              FlatButton(onPressed: () {}, child: Text("Demo Button")),
              Expanded(child: TextFormField())
            ],
          )