Campo de texto multilínea en aleteo

Puede parecer fácil, pero ¿cómo podemos hacer un campo de texto editable de varias líneas en flutter? TextField funciona solo con una sola línea.

Editar: algunas precisiones porque parece que no está claro. Si bien puede configurar multilínea para envolver virtualmente el contenido del texto, todavía no es multilínea. Es una sola línea que se muestra en varias líneas. Si quieres hacer algo como esto, no puedes. Porque no tienes acceso al ENTERbotón. Y si no hay botón de entrada, no hay multilínea.

Para usar el ajuste automático, simplemente configúrelo maxLinescomo null:

TextField(
  keyboardType: TextInputType.multiline,
  maxLines: null,
)

Si la maxLinespropiedad lo es null, no hay límite para el número de líneas y el ajuste está habilitado.

Si desea que su TextField se adapte a la entrada del usuario, haga esto:

TextField(
    keyboardType: TextInputType.multiline,
    minLines: 1,//Normal textInputField will be displayed
    maxLines: 5,// when user presses enter it will adapt to it
    );

aquí establezca las líneas máximas a lo que desee y estará listo para comenzar. En mi opinión, establecer las líneas máximas en nulo no es una buena opción, deberíamos establecerlo en algún valor.

Aunque otras personas ya mencionaron que se puede usar el tipo de teclado "TextInputType.multiline", quería agregar mi implementación de un TextField que adapta automáticamente su altura cuando se ingresa una nueva línea, ya que a menudo se desea imitar el comportamiento de entrada de WhatsApp y aplicaciones similares.

Estoy analizando la cantidad de caracteres '\ n' en la entrada para este propósito cada vez que se cambia el texto. Esto parece ser una exageración, pero desafortunadamente no encontré una mejor posibilidad de lograr este beahivour en Flutter hasta ahora y no noté ningún problema de rendimiento incluso en teléfonos inteligentes más antiguos.

class _MyScreenState extends State<MyScreen> {
  double _inputHeight = 50;
  final TextEditingController _textEditingController = TextEditingController();

  @override
  void initState() {
    super.initState();
    _textEditingController.addListener(_checkInputHeight);
  }

  @override
  void dispose() {
    _textEditingController.dispose();
    super.dispose();
  }

  void _checkInputHeight() async {
    int count = _textEditingController.text.split('\n').length;

    if (count == 0 && _inputHeight == 50.0) {
      return;
    }
    if (count <= 5) {  // use a maximum height of 6 rows 
    // height values can be adapted based on the font size
      var newHeight = count == 0 ? 50.0 : 28.0 + (count * 18.0);
      setState(() {
        _inputHeight = newHeight;
      });
    }
  }


  // ... build method here
  TextField(
    controller: _textEditingController,
    textInputAction: TextInputAction.newline,
    keyboardType: TextInputType.multiline,
    maxLines: null,
  )

utilizar esta

TextFormField(
      keyboardType: TextInputType.multiline,
      maxLines: //Number_of_lines(int),)

TextFieldtiene la propiedad maxLines .

Use expandsy no necesita dar minLinesni maxLinesningún valor específico:

TextField(
  maxLines: null,
  expands: true, 
  keyboardType: TextInputType.multiline,
)

Especifique TextInputAction.newline para que TextField responda a la tecla Intro y acepte la entrada de varias líneas :

textInputAction: TextInputAction.newline,

El documento oficial dice : La maxLinespropiedad se puede establecer en nula para eliminar la restricción en el número de líneas. De forma predeterminada , es uno, lo que significa que es un campo de texto de una sola línea.

NOTA: maxLines no debe ser cero.

Si lo anterior una vez no funcionó para usted, intente agregar minLines también

TextField(
        keyboardType: TextInputType.multiline,
        minLines: 3,
        maxLines: null);

Para el widget TextFormField , puede establecer minLines y maxLines si desea establecer un número fijo de líneas. De lo contrario, también puede establecer maxLines en nulo.

TextFormField(
      minLines: 5,
      maxLines: 7,
      decoration: InputDecoration(
          hintText: 'Address',
          border: OutlineInputBorder(
              borderRadius: BorderRadius.all(Radius.circular(10.0)),
          ),
      ),
),