3

I want to have a transition between a gameView and a menuView, and no matter what I do I do not see a transition between the views either in a simulator or with my iPhone.

That's where I have conditions between views, and where I mention the transition.

struct gameApp: App {
    @ObservedObject var appState = AppState(isGameActive: false)
    
    var body: some Scene {
        WindowGroup {
            
            if appState.isGameActive == false {
                MenuView()
                    .environmentObject(appState)
                    .transition(.move(edge: .trailing))
                    .animation(.default, value: appState.isGameActive)
            } else {
                GameView(difficulity: 1)
                    .transition(.move(edge: .trailing))
                    .animation(.default, value: appState.isGameActive)
            }
        }
    }
}

Here is where the button that switch the view is, with a "withAnimation"

    
    @EnvironmentObject var appState: AppState
    
    var body: some View {
        
        ZStack {
            VStack {
                Spacer()
                Text("Tic Tac Toe")
                    .font(.title)
                    .fontWeight(.bold)
                    .foregroundColor(.indigo)
                    
                Image("MainLogo")
                    .resizable()
                    .frame(width: 150, height: 150)
                Spacer()
                Button("Start") {
                    withAnimation {
                        appState.isGameActive.toggle()
                    }
                }
                .padding()
                .padding(.horizontal, 16.0)
                .background(.indigo)
                .foregroundColor(Color.white)
                .containerShape(RoundedRectangle(cornerRadius: 16))
            .font(.headline)
                Spacer()
            }
        }
        
        
    }
}
0

1 Answer 1

2

Put it condition into animatable container, like

WindowGroup {
  ZStack {          // << here
    if appState.isGameActive == false {
        MenuView()
            .environmentObject(appState)
            .transition(.move(edge: .trailing))
    } else {
        GameView(difficulity: 1)
            .transition(.move(edge: .trailing))
    }
  }
  .animation(.default, value: appState.isGameActive) // << here !!
}

*however I would recommend to separate everything related to views into root view so scene would look like

WindowGroup {
   ContentView()   // << this !!
}
Sign up to request clarification or add additional context in comments.

Comments

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.