How can I get an expandable TextFormField in BottomNavigationBar Flutter - flutter

Question

I'm trying to get an expandableTextFormField in bottomNavBar that will automatically increase in height as the user types into a new line. In my bottomNavBar code below, I gave the container a height of 60px so it doesn't take up the whole screen.
bottomNavigationBar: SafeArea(
child: Container(
height: 60,
color: Colors.white,
margin: EdgeInsets.only(
bottom: MediaQuery.of(context).viewInsets.bottom),
padding: const EdgeInsets.only(
left: 12,
right: 8,
),
child: Row(
children: [
CircleAvatar(
backgroundImage: NetworkImage(url),
radius: 15,
),
Flexible(
child: Padding(
padding: const EdgeInsets.only(
left: 16,
right: 8,
top: 2,
bottom: 2,
),
child: TextFormField(
expands: true,
maxLines: null,
minLines: null,
style: TextStyle(
fontSize: 14,
),
textCapitalization: TextCapitalization.sentences,
controller: commentEditingController,
decoration: InputDecoration(
filled: true,
fillColor: Color(0x27AFAFAF),
hintText: 'Comment as $displayName...',
hintStyle: TextStyle(color: Color(0xFFAFAFAF)),
),
),
),
),
InkWell(
onTap: () {
},
child: Container(
padding: const EdgeInsets.symmetric(
vertical: 8, horizontal: 8),
child: const Text(
'Post',
style: TextStyle(color: Colors.blue),
),
),
)
],
),
);
},
),
),
I also attached a screenshot for more explanation of what I'm talking about:

Answer 1

here's my implementation
Container(
margin: const EdgeInsets.only(top: 20, bottom: 8),
decoration: BoxDecoration(
color: Colors.white.withOpacity(0.1),
borderRadius: BorderRadius.circular(2),
),
constraints: BoxConstraints(
minWidth: MediaQuery.of(context).size.width,
maxWidth: MediaQuery.of(context).size.width,
minHeight: 25.0,//min height you want to take by container
maxHeight: 100.0,//max height you want to take by container
),
child: Scrollbar(
child: TextField(
keyboardType: TextInputType.multiline,
textInputAction: TextInputAction.done,
onSubmitted: (value) {
},
maxLines: null,
// focusNode: focusNode,
controller: _message,
style: const TextStyle(color: Colors.white),
decoration: const InputDecoration(
border: InputBorder.none,
contentPadding:
EdgeInsets.symmetric(horizontal: 13, vertical: 13),
hintText: "Message(optional)",
hintStyle:
TextStyle(color: Colors.white24, fontSize: 14),
),
),
),
),