Как флаттер заставляет текстовое поле динамически отображать несколько строк?

Эффект, которого я хочу добиться, заключается в том, что исходное текстовое поле отображает одну строку, а когда содержимое превышает одну строку, текстовое поле отображает две строки. Проблема в том, что базовая линия текстового поля сдвинется вниз, в результате чего его закроет виджет ниже. Я хочу, чтобы базовая линия оставалась в ряду.

введите здесь описание изображения

введите здесь описание изображения

код:

return Scaffold(
      appBar: AppBar(),
      body: Column(
        children: <Widget>[
          ConstrainedBox(
            constraints: BoxConstraints(
              maxHeight: 60.0
            ),
            child: TextField(
              maxLines: null,
              maxLengthEnforced: false,
              keyboardType: TextInputType.multiline,
            ),
          ),
          Container(height: 20.0,width: 200.0,color: Colors.red),
        ],
      )
    );

Ожидаемый эффект должен быть:

Текстовый эффект в одну строку:

Многострочный текстовый эффект:

Обратите внимание, что базовая позиция не сместилась вниз.


person long    schedule 18.08.2018    source источник
comment
Просто установите свойство maxLines: 1 для TextField   -  person ap14    schedule 18.08.2018
comment
Если это так, он всегда будет показывать только одну строку. Я хочу, чтобы текстовое поле отображало две строки, когда содержимое превышает две строки, которые могут динамически меняться в зависимости от содержимого. На самом деле мой код уже достиг этого эффекта, но базовая линия текстового поля будет двигаться вниз, в результате чего текст перекрывается.   -  person long    schedule 19.08.2018


Ответы (1)


Просто установите для свойства maxLines значение null. Виджет TextField автоматически переносит текст, динамически изменяя количество строк.

Документация

person Community    schedule 10.11.2018