Dialog内でColumnとListViewを用いている場合の制約の話

mayatasomayataso

例えば、

showDialog<int>(
  context: context,
  builder: (context) => Column(
    children: [
      AlertDialog(
        content: ListView(
        children: children,
      ),
    ],
  ),
);

みたいな構造の場合、このままビルドすると、よく見るレイアウト系の

The following assertion was thrown during performLayout():

エラーになる。

対処法としては、エラー本文にもアドバイスがあるように縦横のサイズを制限してあげればよい(色々な記事を見るとListViewのみであればwidthの制限だけでよいが、Columnが絡むとheightの制限しないとダメっぽい)。

showDialog<int>(
  context: context,
  builder: (context) => SizedBox(
    width: double.infinity, // これで横幅最大にできる
    child: Column(
      children: [
        SizedBox(
          width: 0, // ここでも指定が必要だが、0でもok
          height: 100,
          child: AlertDialog(
            content: ListView(
            children: children,
          ),
        ),
      ),
    ],
  ),
);