[Flutter]Icon(アイコン)のサイズ(size)を親ウェジェット(parent)のサイズ(size)に合わせる(fit)には？

どうも、ちょげ(@chogetarou)です。

Iconウェジェットのサイズを親となるウェジェットのサイズにフィットさせる方法を紹介します。

方法

Iconウェジェットのサイズを親となるウェジェットのサイズにフィットさせるには、FittedBoxを使います。

具体的には、IconウェジェットをFittedBoxのchildに指定します。

FittedBox(
  child: Icon(/*Your Icon*/),
),

これでIconのサイズを親ウェジェットのサイズに合わせることが出来ます。

Iconのフィットのさせ方を変更させたい場合は、FittedBoxの引数「fit」を使います。

引数「fit」にBoxFitでフィットのさせ方を指定します。

FittedBox(
  fit: BoxFit.fill,
  child: Icon(),
),

以下は、使用例です。

使用例

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: Container(
          color: Colors.blue,
          height: 200,
          width: 300,
          child: FittedBox(
            child: Icon(
              Icons.flutter_dash,
              color: Colors.white,
            ),
          ),
        ),
      ),
    );
  }