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.
