[Flutter]Icon(アイコン)を回転(rotate)するには？

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

回転させたアイコンを表示する方法を紹介します。

方法

回転させたアイコンを表示するには、Transform.rotateを使います。

まず、IconをTransform.rotateのchildに指定します。

そして、引数「angle」で回転する角度を指定します。

Transform.rotate(
  angle: /*角度*/,
  child: Icon(/*アイコン*/),
),

回転する角度は、「(角度) * pi / 180」のように指定します。

例えば、90度だったら「90 * pi / 180」になります。

角度を指定すれば、アイコンを回転することが出来ます。

以下は、使用例です。

使用例

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: Center(
        child: Transform.rotate(
          angle: 60 * pi / 180, //60度
          child: Icon(
            Icons.flutter_dash,
            color: Colors.blue,
            size: 200,
          ),
        ),
      ),
    );
  }