TextField à l'intérieur de la ligne provoque l'exception de disposition: Impossible de calculer la taille

Question

Je reçois une exception de rendu que je ne comprends pas comment résoudre. J'essaye de créer une colonne qui a 3 rangées.

Row [Image]

Row [TextField]

Row [Boutons]

Voici mon code pour construire le conteneur:

Container buildEnterAppContainer(BuildContext context) { 
    var container = new Container(
     padding: const EdgeInsets.all(8.0), 
     child: new Column(
     mainAxisAlignment: MainAxisAlignment.start, 
     children: <Widget>[ 
      buildImageRow(context), 
      buildAppEntryRow(context), 
      buildButtonRow(context) 
     ], 
    ), 
    ); 
    return container; 
    } 

et mon code buildAppEntryRow pour la conteneur de texte

Widget buildAppEntryRow(BuildContext context) { 
    return new Row(
     children: <Widget>[ 
     new TextField(
      decoration: const InputDecoration(helperText: "Enter App ID"), 
      style: Theme.of(context).textTheme.body1, 
     ) 
     ], 
    ); 
    } 

Quand je lance je reçois l'exception suivante:

I/flutter (7674): BoxConstraints forces an infinite width. 
I/flutter (7674): These invalid constraints were provided to RenderStack's layout() function by the following 
I/flutter (7674): function, which probably computed the invalid constraints in question: 
I/flutter (7674): RenderConstrainedBox.performLayout (package:flutter/src/rendering/proxy_box.dart:256:13) 
I/flutter (7674): The offending constraints were: 
I/flutter (7674): BoxConstraints(w=Infinity, 0.0<=h<=Infinity) 

Si je change buildAppEntryRow juste un champ de texte au lieu comme celui-ci

Widget buildAppEntryRow2(BuildContext context) { 
    return new TextField(
     decoration: const InputDecoration(helperText: "Enter App ID"), 
     style: Theme.of(context).textTheme.body1, 
    ); 
    } 

Je ne reçois plus l'exception. Que manque-t-il à l'implémentation de Row qui ne permet pas de calculer la taille de cette ligne?

Answer 1

(je suppose que vous utilisez un parce que vous voulez mettre d'autres widgets à côté du TextField à l'avenir.)

Le widget veut déterminer la taille intrinsèque de ses enfants non flexibles, il sait combien d'espace il a laissé pour les flexibles. Cependant, TextField n'a pas de largeur intrinsèque; il ne sait comment se dimensionner sur toute la largeur de son conteneur parent. Essayez d'envelopper dans un Flexible ou Expanded de dire au que vous vous attendez à la TextField de prendre l'espace restant:

 new Row(
     children: <Widget>[ 
      new Flexible(
      child: new TextField(
       decoration: const InputDecoration(helperText: "Enter App ID"), 
       style: Theme.of(context).textTheme.body1, 
      ), 
     ), 
     ], 
    ),