我下面的代码工作正常,并在 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(),
)
),
]
);
这就是你可以做到的。
textDirection Row() 小部件的属性将允许您从上述方向开始定位子小部件。
注意:- **如果您在项目中使用 MaterialApp() 小部件,则可以删除或注释掉“textDirection”。它负责处理 textDirection。
Expanded()小部件用于占据剩余的整个空间。
child: Row(
textDirection: TextDirection.rtl,
children: <Widget>[
FlatButton(onPressed: () {}, child: Text("Demo Button")),
Expanded(child: TextFormField())
],
)
您可以使用
Expanded or Flexible
小部件,如下所示:
Row(
children: <Widget>[
Expanded(
child: TextFormField(
controller: contrllerName,
),
),
TextButton(
onPressed: () {
// To do
},
child: Text("Demo Button")
),
],
)
不要忘记初始化
contrllerName