You can apply mirroring to a SwiftUI view by using the scaleEffect(x:y:anchor:)
modifier to flip the view horizontally or vertically. Specifically, you can set the x
or y
scale to -1.0
to mirror the view along that axis.
Example of Horizontal Mirroring:
To mirror a view horizontally, you can set the x
scale to -1.0
.
import SwiftUI
struct ContentView: View {
var body: some View {
VStack {
Text("Original View")
.font(.title)
.padding()
Image(systemName: "arrow.right")
.resizable()
.frame(width: 100, height: 100)
.padding()
Text("Mirrored View")
.font(.title)
.padding()
Image(systemName: "arrow.right")
.resizable()
.frame(width: 100, height: 100)
.padding()
.scaleEffect(x: -1, y: 1) // Horizontally mirrored
}
}
}
@main
struct MirroredApp: App {
var body: some Scene {
WindowGroup {
ContentView()
}
}
}
Example of Vertical Mirroring:
Similarly, if you want to mirror the view vertically, you can set the y
scale to -1.0
.
.scaleEffect(x: 1, y: -1) // Vertically mirrored
Example of both Vertical and Horizontal Mirroring:
If you want to apply both horizontal and vertical mirroring (flip both axes), you can set both x
and y
scales to -1.0
.
.scaleEffect(x: -1, y: -1) // Both horizontally and vertically mirrored
Summary:
- Horizontal Mirroring: Use
.scaleEffect(x: -1, y: 1)
- Vertical Mirroring: Use
.scaleEffect(x: 1, y: -1)
- Both Axes Mirroring: Use
.scaleEffect(x: -1, y: -1)
- No Mirroring: Use
.scaleEffect(x: 1, y: 1)
You can apply these transformations to any view, such as text, images, buttons, or even custom shapes.