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 属性将使您可以从上述方向开始定位子小部件。

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

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

连续对齐TextField和FlatButton

1 个答案: