[flutter]DropdwonButtonをRowに入れると"A RenderFlex overflowed"

状況

タイトル通りだが、flutterでRowの中にDropdownButtonを入れると、"A RenderFlex overflowed"の例外が発生。

解決策

DropdwonButtonを画面いっぱいに広げたいならば、DropdownButtonをExpandedで包む。広げなくていいのならばDropdownButtonのisExpandedプロパティをfalseにする。

原因

flutterにおけるwidgetのサイズの指定がおかしかった。

Rowは子widgetに合わせてできるだけ広がろうとするが、DropdownButtonはisExpanded=trueの場合は、親widgetに合わせてできるだけ広がろうとする。つまり、DropdownButtonが広がる→Rowが広がる→DropdownButtonが広がる・・・を繰り返していって幅が無限大になってしまったのが例外の原因。

widgetのサイズの決め方はここに詳しく書かれていた。

同じ問題はRowとDropdownButtonの組み合わせだけでなく、子に合わせて広がるwidgetと親に合わせて広がるwidgetを入れ子にすると起こりうる。上記リンク先によれば初心者あるあるらしい（笑）。