Working with minLines and maxLines properties in Flutter TextField

Text input in Flutter is simple to use. But when we want certain behaviors to occur each property, e.g. maxline and minline, when combined, has some unpredictable behavior when we try to understand their usage for the first time. In this article, I will provide you with examples for each behavior and its code example.

Behavior 0: Single-line text field.

This is the default behavior when not supplying neither maxLines on minLines . The text field will stay in one line.

Behavior 1: Multi-line text field.

Expand the text input field to numbers of maxLine parameters.

TextFormField{
    maxLines: 3
}

Behavior 2: Expandable text field.

This could be what most people looking for, the text field shows as a single-line text field, minLines: 1, but will expand as users type beyond a line and capped out at a number of lines indicated at maxLines.

TextFormField{
    minLines: 1,
    maxLines: 3
}

Assert error: when minLine > maxLine.

The compiler will give us an error when trying to use only minLine or when minLine is higher than maxLine which conflicts with each other.

Hope this article helps save you some time in customizing your text field to match the desired behavior. Cheers, and happy coding.