How do I stop my text field from growing horizontally? - flutter

Question

I have a text field in a modal sheet that is wrapped with a column. When I type text in the text field it grows horizontally instead of vertically, I've tried setting maxLines to null but it still behaves the same way. I want it to expand vertically.
showModalBottomSheet(
isScrollControlled: true,
context: context,
builder: (BuildContext context) {
return Padding(
padding: EdgeInsets.only(
bottom: MediaQuery.of(context)
.viewInsets
.bottom), //keeps above keyboard
child: SizedBox(
height: 150,
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
createSpace(1),
const TextField(
keyboardType: TextInputType.multiline,
autofocus: true,
maxLines: null,
decoration: InputDecoration(
contentPadding: EdgeInsets.only(left: 10),
border: InputBorder.none,
hintText: "Title",
),
),
const TextField(
style: TextStyle(height: 1),
decoration: InputDecoration(
border: InputBorder.none,
contentPadding: EdgeInsets.only(left: 20),
hintText: "Description",
),
),
TextButton(onPressed: () {}, child: const Text("Save"))
],
),
),
);
});

Answer 1

Just add below code in TextField.
minLines: 1,
maxLines: null,

Answer 2

You need to set Size box width also. so that the line takes a constant width then goes to next line. you can also fix minLines and maxLines in TextField that can help to take max line
showModalBottomSheet(
isScrollControlled: true,
context: context,
builder: (BuildContext context) {
return Padding(
padding: EdgeInsets.only(
bottom: MediaQuery.of(context)
.viewInsets
.bottom), //keeps above keyboard
child: SizedBox(
height: 150,
width: MediaQuery.of(context).size.width,
child: Column(
mainAxisSize: MainAxisSize.min,
children: [
createSpace(1),
const TextField(
keyboardType: TextInputType.multiline,
autofocus: true,
minLines: 1,
maxLines: 3,
decoration: InputDecoration(
contentPadding: EdgeInsets.only(left: 10),
border: InputBorder.none,
hintText: "Title",
),
),
const TextField(
style: TextStyle(height: 1),
decoration: InputDecoration(
border: InputBorder.none,
contentPadding: EdgeInsets.only(left: 20),
hintText: "Description",
),
),
TextButton(onPressed: () {}, child: const Text("Save"))
],
),
),
);
});