Flutter textfield expand as user types

As shown in the first answer, setting maxLines to null will do the trick. However this would allow the textfield to grow infinitely.

To have more control, set minLines to 1 and maxLines as needed. Hope this helps!

Code Sample: TextField(minLines:1,maxLines:8)


Using this should do the trick:

keyboardType: TextInputType.multiline,
minLines: 1,
maxLines: 20,
maxLength: 1000,

Adding the minLines and MaxLines is important in order to get the required behaviour, whereas maxLength is a treat!

Maybe too late, but better late than never!


Set maxLines to null and it will auto grow vertically.

It's documented (but not entirely clearly) here (edit: I've created a PR to update this, which I should've done to begin with for this question ;). To figure it out I ended up looking at the code for TextField and its superclass(es), seeing what the behavior would be if set to null.

So your code should be as follows:

new TextField( 
  decoration: const InputDecoration(
    hintText: 'Reply',
    labelText: 'Reply:',
  ),
  autofocus: false,
  focusNode: _focusnode,
  maxLines: null,
  controller: _newreplycontroller,
  keyboardType: TextInputType.text,
),

If you're trying to make it autogrow horizontally, you probably shouldn't - at least not based on the text content. But I'm asuming you want to make it autogrow vertically.

Tags:

Flutter