[Flutter] Align TextField and FlatButton in a Row

I've the below code working fine, and showing the FlatButton under the TextField:

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(),
)
// ])
]);
}
}


I tried adding Row to make them in single line, but it is not working, and showing blank screen!!

** UPDATE**

I was able to put them in line, by wrapping each element into a container, but still not happy for this as it require me to assign the container width, I need this to be done automatically:

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(),
)
),
]
);

Continue reading...