Champ de texte multiligne dans flutter

Question

Cela peut sembler facile mais comment faire un champ de texte éditable de plusieurs lignes dans Flutter ? TextField ne fonctionne qu'avec une seule ligne.

Edit : quelques précisions car il semble que ce ne soit pas clair. Bien que vous puissiez définir le multiline pour envelopper virtuellement le contenu du texte, ce n'est toujours pas un multiline. Il s'agit d'une ligne unique affichée en plusieurs lignes. Si vous voulez faire quelque chose comme ça, vous ne pouvez pas. Parce que vous n'avez pas accès à ENTER bouton. Et pas de bouton d'entrée signifie pas de ligne multiple.

Answer 1

Bien que cette question soit assez ancienne, il n'y a pas de réponse détaillée qui explique comment redimensionner dynamiquement l'écran de l'ordinateur. TextField avec peu d'efforts de la part des développeurs. Ceci est particulièrement important lorsque le TextField est soit placé dans un flexbox tel que ListView, SingleChildScrollView, etc. (le flexbox ne sera pas en mesure de déterminer la taille intrinsèque d'un élément extensible TextField ).

Comme suggéré par de nombreux autres utilisateurs, construisez votre TextField comme ça :

TextField(
  textInputAction: TextInputAction.newline,
  keyboardType: TextInputType.multiline,
  minLines: null,
  maxLines: null,  // If this is null, there is no limit to the number of lines, and the text container will start with enough vertical space for one line and automatically grow to accommodate additional lines as they are entered.
  expands: true,  // If set to true and wrapped in a parent widget like [Expanded] or [SizedBox], the input will expand to fill the parent.
)

Comment faire face à la hauteur intrinsèque manquante de la TextField ?

Enveloppez le TextField dans un IntrinsicHeight classe pour fournir la hauteur intrinsèque calculée dynamiquement de l'objet extensible. TextField à son parent (lorsque cela est demandé via, par exemple, le flexbox).

Answer 2

   TextFormField(
                  minLines: 2,
                  maxLines: 5,
                  keyboardType: TextInputType.multiline,
                  decoration: InputDecoration(
                    hintText: 'description',
                    hintStyle: TextStyle(
                      color: Colors.grey
                    ),
                    border: OutlineInputBorder(
                      borderRadius: BorderRadius.all(Radius.circular(20.0)),
                    ),
                  ),
                ),

Answer 3

Utiliser ce

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

Answer 4

Utilisez le widget Expanded pour les impressions dynamiques

Expanded( enfant : TextField( type de clavier : TextInputType.multiline, minLines : 1, maxLines : 3, ), )

Answer 5

TextField a maxLines propriété.