top of page

[flutter]"A RenderFlex overflowed" when DropdwonButton is put in Row


Situation


As the title says, when I put a DropdownButton inside a Row with flutter, I get an exception of "A RenderFlex overflowed".



Solution


If you want to expand the DropdwonButton to fill the screen, wrap the DropdownButton in Expanded. If you don't need to expand it, set the DropdownButton's isExpanded property to false.



Cause


The size of the widget was specified incorrectly.

Row tries to expand as much as possible to fit the child widget, but DropdownButton tries to expand as much as possible to fit the parent widget if isExpanded = true.

In other words, the cause of the exception is that the width becomes infinite by repeating the process of expanding DropdownButton → expanding Row → expanding DropdownButton...


The same problem can occur not only with the combination of Row and DropdownButton, but also with a widget that spreads according to the child and a widget that spreads according to the parent.

Recent Posts

See All

[Flutter/Dart] Format string with TextField

What want to do I want to create an input form using TextField. For example, if the input content is a monetary amount, I would like to display it in 3-digit delimiters with a ¥ prefix. Rather than ha

Comments


Let's do our best with our partner:​ ChatReminder

iphone6.5p2.png

It is an application that achieves goals in a chat format with partners.

google-play-badge.png
Download_on_the_App_Store_Badge_JP_RGB_blk_100317.png

Let's do our best with our partner:​ ChatReminder

納品:iPhone6.5①.png

It is an application that achieves goals in a chat format with partners.

google-play-badge.png
Download_on_the_App_Store_Badge_JP_RGB_blk_100317.png

Theme diary: Decide the theme and record for each genre

It is a diary application that allows you to post and record with themes and sub-themes for each genre.

google-play-badge.png
Download_on_the_App_Store_Badge_JP_RGB_blk_100317.png
bottom of page