【Flutter/Dart】collection if と collection for が便利 (Control Flow Collection)

普段は Go を触ってるので Collection if / for が新鮮だったのでメモ。

• Collections | Dart

var nav = ['Home', 'Furniture', 'Plants', if (promoActive) 'Outlet'];

これは promoActive が Outlet ならコレクションに追加。

var nav = [for (i = 0; i < 10; i++) "aaa"]

これは aaa を10回追加したコレクションの生成。

Control Flow Collection の Proposal

• language/accepted/2.3/control-flow-collections/feature-specification.md at main · dart-lang/language

モチベーションとしては Flutter の構築時は上から下へ、外側から内側にウィジェットを読むとそれがそのままアプリの見た目になっているのが良いとされている。ただ条件分岐を使うと、別のところでウィジェットを組み立てて追加したり消したりなどが発生する。

Widget build(BuildContext context) {
  var buttons = <Widget>[
      IconButton(icon: Icon(Icons.menu)),
      Expanded(child: title),
  ];

  if (isAndroid) {
    buttons.add(IconButton(icon: Icon(Icons.search)));
  }

  return Row(
    children: buttons,
  );
}

すると良いアプローチがとれなくなるので、コレクション内でコントロールできるようになる。 提案されてたのがこちら。

Widget build(BuildContext context) {
  return Row(
    children: [
      IconButton(icon: Icon(Icons.menu)),
      Expanded(child: title),
      if (isAndroid) IconButton(icon: Icon(Icons.search)),
    ]
  );
}

memo

• 他の言語で（自分が）見たことないのは、Flutter の構築時は上から下へ、外側から内側にウィジェットを読むとそれがそのままアプリの見た目になっているのが良い という言語思想が強いから？
• proposal みると面白い、モチベーションのところでカルチャーが学べる
• flutter 公式 docs から proposal 飛べるのよい
• control flow collection 便利