Flutter:如何翻转图标以获得镜像效果?

Mic*_*thi 30 flutter flutter-layout

我想翻转这个重播素材图标,以便它可以用作转发。

礼物图标:

预设图标

要求的结果:

在此处输入图片说明

Cop*_*oad 88

之前

在此处输入图片说明


之后

在此处输入图片说明

import 'dart:math' as math; // import this

Transform(
  alignment: Alignment.center,
  transform: Matrix4.rotationY(math.pi),
  child: Icon(Icons.rotate_left, size: 100,),
)
Run Code Online (Sandbox Code Playgroud)

  • 惊人的。为了根据语言环境规则工作,我们可以执行 `Matrix4.rotationY(isRtl() ? math.pi : 0),` (3认同)

Kwa*_*edu 76

接受的答案有效,但要添加我的两分钱,您可以使用以下内容:

Transform.scale(
  scaleX: -1,
  child: Icon(
    Icons.rotate_left, 
    size: 100,
  ),
)
Run Code Online (Sandbox Code Playgroud)

效果相同,但没有import声明或任何显式矩阵规范

  • 请参阅 [Transform.scale](https://api.flutter.dev/flutter/widgets/Transform/Transform.scale.html) 上的 Flutter 文档。`Transform.scale` 有一个 `scaleX` 属性。此外,比例尺旨在执行其限制内的数学操作,其中包括如果比例尺 < 0,则在特定轴上反转... (2认同)

Dee*_*hah 24

使用 Flutter 3.10.2(不确定之前是否可用),可以如下翻转:

Transform.flip(
  flipX: true,
  child: const Icon(Icons.rotate_right),
)
Run Code Online (Sandbox Code Playgroud)