.transformEffect用法

用户2031196600962025-04-23 11:21

.transformEffect 是 SwiftUI 中的一个修饰符，用于对视图应用 2D 仿射变换（Affine Transform） ，比如平移、旋转、缩放或倾斜等效果。它基于 CGAffineTransform，适用于调整视图的位置、大小或形状，但不同于 3D 变换（如 rotation3DEffect）。

基本用法

swift 复制代码

视图
    .transformEffect(CGAffineTransform(translationX: 50, y: 50)) // 平移

常见变换示例

平移（Translation）

将视图沿 X/Y 轴移动：
swift 复制代码
```
.transformEffect(CGAffineTransform(translationX: 20, y: 10))
```

旋转（Rotation）

旋转视图（弧度制）：

swift 复制代码

.transformEffect(CGAffineTransform(rotationAngle: .pi / 4)) // 45度

缩放（Scale）

调整视图大小：

swift 复制代码

.transformEffect(CGAffineTransform(scaleX: 1.5, y: 0.8))

组合变换

通过链式调用或直接组合：

swift 复制代码

let transform = CGAffineTransform(translationX: 50, y: 0)
    .rotated(by: .pi / 4)
    .scaledBy(x: 2, y: 1)

注意事项

2D 变换 ：与 .rotation3DEffect 不同，transformEffect 仅支持 2D 变换。
性能：适合轻量级动画，复杂变换建议结合 Canvas 或 Metal。
坐标系 ：变换基于视图的 局部坐标系（以自身中心为原点）。

完整示例

swift 复制代码

Text("Hello, SwiftUI")
    .padding()
    .background(Color.blue)
    .foregroundColor(.white)
    .transformEffect(CGAffineTransform(rotationAngle: .pi / 6)) // 旋转30度

如果需要 3D 变换 （如透视效果），应改用 .rotation3DEffect 或自定义 ProjectionTransform。