How to disable opacity with transitions in SwiftUI?

Viewed 400

I'm using SwiftUI.

I have a transition that I'm using to bring up my SignInView. However, this transition seems to be automatically applying an opacity effect on the view it's replacing. This wouldn't be a problem, however, it seems like the Safe Area on both the top and the bottom have different rates of receiving the opacity than the rest of the view.

I'm trying to find 1 of 2 solutions:

  1. How can I get rid of the opacity effect altogether, or
  2. How can I get the opacity effect to be applied evenly everywhere.

Here is the code for my transition:

struct AuthView: View {
    
    @State var showSignIn: Bool = false
    
    var body: some View {
        ZStack {
            if !showSignIn {
                WelcomeView(showSignIn: $showSignIn)
                    
            } else {
                SignInView(showSignIn: $showSignIn)
                    .transition(AnyTransition.move(edge: .trailing))
                    .zIndex(1)
            }
        }
    }
}

Here is the button controlling the state variable:

Button(action: { withAnimation(.easeInOut) { showSignIn.toggle() } }) {
                         //Button text
                        }

I also have a video (GIF) that better shows what I'm talking about, when I mention the uneven distribution of opacity.

https://i.stack.imgur.com/KXEcF.gif

If you look closely at the top and bottom safe area it fades faster than the rest of the view, which is undesired.

Note: When I changed the appearance to Dark Mode, it turned black instead of white on the top and bottom.

1 Answers

I assume you want identity transition for original view (opacity transition is applied by default if none other specified)

if !showSignIn {
    WelcomeView(showSignIn: $showSignIn)
      .transition(.identity)                // << here !!
Related