How to solve: Flutter TextField width should match width of contained text


Asked by SteveM on January 24, 2019 (source).

In flutter, TextField doesn't have an intrinsic width; it only knows how to size itself to the full width of its parent container. How do I set the width to the width of the contained text.

I tried putting the TextField inside a container

As outlined here How to update flutter TextField's height and width?

new Container(              
  width: 100.0,
  child: new TextField()

I expect the width of the TextField to match the width of the text it contains. The TextField should grow wider as text is typed, and shrink narrower as text is deleted.


Question answered by Philip C (source).

Flutter has IntrinsicWidth to do the calculation for you. Just wrap your TextField or TextFormField in it as follow:

IntrinsicWidth(child: TextField())