【Flutter】child, childrenの違いについて

2022年7月16日

Flutterのプロパティとして存在する、childとchildrenの違いは何なのでしょうか。

端的にいうと、childは1つのwidgetを、childrenは複数のwidgetを持つことができます。
英語の単数形と複数形、その意味に近いですね。

今回はchildrenプロパティを使ってサンプルプログラムを作ってみます。

class _MyHomePageState extends State<MyHomePage> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(),
      body: Column(
        children: [
          Container(
            child: Text('child 1'),
            color: Colors.red,
            height: 100,
            width: 100,
          ),
          Container(
            child: Text('child 2'),
            color: Colors.blue,
            height: 100,
            width: 100,
          ),
          Container(
            child: Text('child 3'),
            color: Colors.yellow,
            height: 100,
            width: 100,
          )
        ],
      ),
    );
  }
}

こんな感じで、Columnウィジェットの中にList<Widget> childrenプロパティを書いて、
その中に3つのContainerウィジェットを持たせてみます。
更にその1つ1つにはchildプロパティを書いてTextウィジェットを持たせます。