Flutter textfield expand as user types

flutter

I have a textfield and need to have multi-line as below so that the text wraps, however it takes up the space of all the lines that is defined in maxLines. I want to be able to have it look like 1 line and expand as the text wraps. Any ideas of how to do this is flutter?

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

Best Answer

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.

Related Topic