如何在没有动画的情况下在颤动中旋转材质图标？

Question

我希望图标details向上指向，如图所示。但是材质图标列表中有图标details指向下方，那么如何在不下载图标图像的情况下旋转我的flutter项目中的材质图标。

Column(
  children: <Widget>[
    Container(
      height: 48,
      decoration: BoxDecoration(
          color: Color(0xFFFBBC05),
          borderRadius: BorderRadius.circular(48),
          boxShadow: [
            BoxShadow(
                blurRadius: 16,
                offset: Offset(0, 8),
                color: Color(0XFFFBBC05),
                spreadRadius: -10)
          ]),
      child: IconButton(
        icon: Icon(
          Icons.details,
          color: Colors.white,
        ),
        onPressed: null,
      ),
    ),
    SizedBox(
      height: 8,
    ),
    Text(
      "Historical",
      style: TextStyle(fontFamily: 'AirbnbCerealMedium', fontSize: 12),
    ),
  ],
)

Answer 1

您可以使用旋转构造函数将您IconButton的Transform小部件包装在一个小部件中：

import 'dart:math' as math;

Transform.rotate(
  angle: 180 * math.pi / 180,
  child: IconButton(
    icon: Icon(
      Icons.details,
      color: Colors.white,
    ),
    onPressed: null,
  ),
),

Answer 2

另一种解决方案是：

RotatedBox(
  quarterTurns: 2,
  child: IconButton(
    icon: Icon(
      Icons.details,
      color: Colors.white,
    ),
    onPressed: null,
  ),
),

Answer 3

Transform.rotate(
  angle: 180 * pi / 180,
  child: IconButton(
    icon: Icon(
      Icons.details,
      color: Colors.white,
    ),
    onPressed: null,
  ),
),

Answer 4

如果你想旋转像 arrow_forward_ios 这样的图标，可以帮助下面的代码。

icon: Transform.rotate(
       angle: 90 *math.pi /180,
       child: Icon(Icons.arrow_forward_ios,
       color: Colors.white,size: 18,),,