Is it possible to flip a SwiftUI View vertically?

Question

Looks like you can rotate a view upside down with UIView, but I can't find anything saying it's possible to do the same thing with a SwiftUI View.

Any help will be appreciated :)

score 21 · Answer 1 · edited Aug 23 '22 at 10:13

21

Actually approach is the same to referenced post

Text("Test").font(.largeTitle)
    .scaleEffect(CGSize(width: 1.0, height: -1.0))  // << here !!

edited Aug 23 '22 at 10:13

Martijn Pieters

1,048,767
296
4,058
3,343

answered Dec 08 '20 at 04:32

Asperi

228,894
20
464
690

score 2 · Answer 2 · answered May 25 '22 at 09:19

Here is a convenience extension:

extension View {
    func flipped(_ axis: Axis = .horizontal, anchor: UnitPoint = .center) -> some View {
        switch axis {
        case .horizontal:
            return scaleEffect(CGSize(width: -1, height: 1), anchor: anchor)
        case .vertical:
            return scaleEffect(CGSize(width: 1, height: -1), anchor: anchor)
        }
    }
}

Use it:

Text("Flip me")
    .flipped(.vertical)

score 0 · Answer 3 · edited Sep 20 '22 at 18:24

Rotate Image As Mirror image by SwiftUI:

struct Rotate3DView: View {
    @State var imagename: String = "exImage"

     var body: some View {

       VStack {
           ZStack{
               
               Image(imagename).resizable().opacity(0.3)
                   .rotation3DEffect(.degrees(180), axis: (x: -10, y: 0, z: 0))
                   .rotationEffect(.radians(.pi))
                   .padding(.top,60)
                   .cornerRadius(5)
                   .frame(width: 180, height: 280)

               Image(imagename).resizable().padding(.bottom,45).frame(width: 180, height: 280)
                  
                  
           }

       }
     }
   }

This is very easy for native Users.

Your answer could be improved with additional supporting information. Please [edit] to add further details, such as citations or documentation, so that others can confirm that your answer is correct. You can find more information on how to write good answers [in the help center](/help/how-to-answer). — Community, Sep 20 '22 at 10:18

score -2 · Accepted Answer · answered Dec 07 '20 at 23:59

-2

Turns out I can just apply this to the surrounding Stack:

.rotationEffect(.degrees(-180))

To flip it vertically

answered Dec 07 '20 at 23:59

Lemon

1,184
11
33

9

This is not flipping the view, it is just rotating it. – vicegax Mar 29 '21 at 11:05

Is it possible to flip a SwiftUI View vertically?

4 Answers4