英文:
I want to invert "icon: Icon(Icons.xxx)" in Flutter
问题
我想要在Flutter中反转"icon: Icon(Icons.xxx)"。TopRight和bottmoLeft。
// TopLeft
Transform.rotate(
angle: 180 * pi / 180,
child: IconButton(
onPressed: () {
setState(() {});
},
icon: Icon(Icons.branding_watermark)),
),
// TopRight
IconButton(
onPressed: () {
setState(() {});
},
icon: Icon(Icons.branding_watermark)),
// bottomLeft
IconButton(
onPressed: () {
setState(() {});
},
icon: Icon(Icons.branding_watermark)),
// bottomRight
IconButton(
onPressed: () {
setState(() {});
},
icon: Icon(Icons.branding_watermark)),
我尝试过使用matrix4，但我无法设置它。
英文:
I want to invert "icon: Icon(Icons.xxx)" in Flutter.
TopRight and bottmoLeft.
//TopLeft
Transform.rotate(
angle: 180 * pi / 180,
child: IconButton(
onPressed: () {
setState(() {});
},
icon: Icon(Icons.branding_watermark)),
),
//TopRight
IconButton(
onPressed: () {
setState(() {});
},
icon: Icon(Icons.branding_watermark)),
//bottomLeft
IconButton(
onPressed: () {
setState(() {});
},
icon: Icon(Icons.branding_watermark)),
//bottomRight
IconButton(
onPressed: () {
setState(() {});
},
icon: Icon(Icons.branding_watermark)),
i did try matrix4 , but I can not set it .
答案1
得分: 1
以下是翻译好的代码部分：
应该是你所要求的：
Transform.rotate(
angle: pi,
child: IconButton(
onPressed: () {
setState(() {});
},
icon: Icon(Icons.branding_watermark)),
),
//右上角
Transform.rotate(
angle: -pi / 2,
child: IconButton(
onPressed: () {
setState(() {});
},
icon: Icon(Icons.branding_watermark)),
),
//左下角
Transform.rotate(
angle: pi / 2,
child: IconButton(
onPressed: () {
setState(() {});
},
icon: Icon(Icons.branding_watermark)),
),
//右下角
IconButton(
onPressed: () {
setState(() {});
},
icon: Icon(Icons.branding_watermark)),
这是在 DartPad 上执行后的结果：
英文:
That should be what you ask:
Transform.rotate(
angle: pi,
child: IconButton(
onPressed: () {
setState(() {});
},
icon: Icon(Icons.branding_watermark)),
),
//TopRight
Transform.rotate(
angle: -pi / 2,
child: IconButton(
onPressed: () {
setState(() {});
},
icon: Icon(Icons.branding_watermark)),
),
//bottomLeft
Transform.rotate(
angle: pi / 2,
child: IconButton(
onPressed: () {
setState(() {});
},
icon: Icon(Icons.branding_watermark)),
),
//bottomRight
IconButton(
onPressed: () {
setState(() {});
},
icon: Icon(Icons.branding_watermark)),
This is the result when I execute on dartpad:
答案2
得分: 1
你可以使用缩放代替旋转：
// 右上角
Transform.scale(
scaleX: -1,
scaleY: 1,
child: IconButton(
onPressed: () {
setState(() {});
},
icon: Icon(Icons.branding_watermark),
),
)
通过将scaleX设为负数，你可以在水平方向上翻转它，将scaleY设为负数，你可以在垂直方向上翻转它。
英文:
You could use scale instead of rotate:
//TopRight
Transform.scale(
scaleX: -1,
scaleY: 1,
child: IconButton(
onPressed: () {
setState(() {});
},
icon: Icon(Icons.branding_watermark)),
),
By making scaleX negative, you can flip it over horizontally, and by making scaleY negative, you can flip it over vertically.
答案3
得分: 1
这可以通过使用两个变换来实现：
Transform(
transform: Matrix4.rotationX(math.pi),
alignment: Alignment.center,
child: Transform(
alignment: Alignment.center,
transform: Matrix4.rotationY(math.pi),
child: Icon(Icons.rotate_left, size: 100,),
),
),
英文:
This can be done by using two transforms:
Transform(
transform:Matrix4.rotationX(math.pi),
alignment: Alignment.center,
child: Transform(
alignment: Alignment.center,
transform: Matrix4.rotationY(math.pi),
child: Icon(Icons.rotate_left, size: 100,),
),
),
答案4
得分: 1
请使用 transform 小部件，因为它具有更高级的属性，如矩阵旋转。
右上角：-
Transform(
transform: Matrix4.rotationX(pi), // 反转 Y 轴
alignment: Alignment.center,
child: IconButton(
onPressed: () {
setState(() {});
},
icon: const Icon(Icons.branding_watermark),
),
)
输出：-
左下角：-
Transform(
transform: Matrix4.rotationY(pi), // 反转 Y 轴
alignment: Alignment.center,
child: IconButton(
onPressed: () {
setState(() {});
},
icon: const Icon(Icons.branding_watermark),
),
)
输出：-
英文:
Use the transform widget instead because it has more advanced property like matrix rotation.
Top right : -
Transform(
transform: Matrix4.rotationX(pi), // Invert Y-axis
alignment: Alignment.center,
child: IconButton(
onPressed: () {
setState(() {});
},
icon: const Icon(Icons.branding_watermark)),
),
Output : -
Bottom left : -
Transform(
transform: Matrix4.rotationY(pi), // Invert Y-axis
alignment: Alignment.center,
child: IconButton(
onPressed: () {
setState(() {});
},
icon: const Icon(Icons.branding_watermark)),
),
Output : -
答案5
得分: 1
剩下的两个按钮：
IconButton(
onPressed: () {},
icon: Transform(
alignment: Alignment.center,
transform: Matrix4.rotationY(pi),
child: Icon(Icons.branding_watermark))),
IconButton(
onPressed: () {},
icon: Transform(
alignment: Alignment.center,
transform: Matrix4.rotationY(math.pi)..rotateZ(pi),
child: Icon(Icons.branding_watermark))))
英文:
The 2 remaining button:
IconButton(
onPressed: () {},
icon: Transform(
alignment: Alignment.center,
transform: Matrix4.rotationY(pi),
child: Icon(Icons.branding_watermark))),
IconButton(
onPressed: () {},
icon: Transform(
alignment: Alignment.center,
transform: Matrix4.rotationY(math.pi)..rotateZ(pi),
child: Icon(Icons.branding_watermark))),
通过集体智慧和协作来改善编程学习和解决问题的方式。致力于成为全球开发者共同参与的知识库，让每个人都能够通过互相帮助和分享经验来进步。
评论