Flutter 3.19 - 旋转按钮，2024 年有更好的编码方式吗？

Question

我刚刚开始学习flutter大概两周了，但是大多数时候我不喜欢flutter的widget给我们提供的标准设计风格，所以......

我需要创建一个填充黑色的购物车按钮，其中包含一个图标（图像），然后以 45 角度旋转按钮，但图标必须保持正常。*

旋转 IconButton 的示例图像

所以我想出了这个解决方案：

Column(
  children: [
    Transform.rotate(
      angle: 45 * pi / 180,
      child: IconButton(
        onPressed: () {},
        padding: EdgeInsets.all(25),
        style: IconButton.styleFrom(
          elevation: 0,
          backgroundColor: Colors.black,
          foregroundColor: Colors.white,
          shape: RoundedRectangleBorder(
            borderRadius: BorderRadius.circular(20),
          ),
        ),
        icon: Transform.rotate(
          angle: -45 * pi / 180,
          child: Image.asset(
            'assets/icons/shopping-cart.png',
            color: Colors.white,
            width: 22,
          ),
        ),
      ),
    ),
  ],
),

**问题是： 已更改//

新：有更好的方法吗？**

所以基本上，如果我不向图标（图像）添加 -45 度角度，它们就会一起转动。

Answer 1

另一种旋转按钮的方法

RotationTransition(
                turns: AlwaysStoppedAnimation(0.12),
                child: InkWell(
                  onTap: (){},
                  child: Container(
                    width: 100,
                    height: 100,
                    child: RotationTransition(
                        turns: AlwaysStoppedAnimation(-0.12),
                        child: Center(
                            child: Icon(
                          Icons.add_shopping_cart,
                          color: Colors.white,
                        ))),
                    decoration: BoxDecoration(color: Colors.black, borderRadius: BorderRadius.circular(25)),
                  ),
                ),
              ),