[Flutter]Iconの形を指定するには？

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

Iconの形を指定する方法を紹介します。

方法

Iconの形を指定する方法は２つあります。

Container

１つは、Containerを使う方法です。

1. IconをContainerのchildに指定
2. Containerの引数「decoration」にBoxDecorationを指定
3. BoxDecorationの引数「shape」に形を指定

Container(
  decoration: BoxDecoration(
    shape: BoxShape.circle, //形
    color: Colors.blue,
  ),
  child: Icon(
    Icons.account_balance,
    color: Colors.white,
    size: 100,
  ),
  padding: EdgeInsets.all(8),
)

Material

もう１つは、Materialを使う方法です。

1. ContainerをMaterialのchildに指定
2. Materialの引数「shape」に形を指定

Material(
  shape: CircleBorder(),
  child: Icon(
    Icons.flutter_dash,
    color: Colors.white,
    size: 100,
  ),
  color: Colors.blue,
)

まとめ

Iconの形を指定するには、ContainerもしくはMaterialを使います。