I am creating a game and at the end, want the sheet to appear to end the game. Eventually, it will have a few more options, but I need to get this working first. This is the first app I am creating, so I’m not sure whether this is the best way to handle it.
I added this code, and it has been working for the most part. However, I found that nothing changes when I hit New Game. If I remove the sheet dismissal, I find that the view is loading on the sheet that is being dismissed. What can I change to have it so that once a sheet is dismissed, it will load the new view instead of the current game view?
import SwiftUI
struct GameEndCustomSheet: View {
@Environment(.presentationMode) var presentationMode
@State private var navigateToNewGame = false
var body: some View {
NavigationStack {
VStack {
Text("Game Ended")
Button(action: {
// Dismiss the sheet
presentationMode.wrappedValue.dismiss()
}) {
Text("New Game")
}
}
.onDisappear {
// Navigate to the new view when the sheet disappears
navigateToNewGame = true
}
.navigationDestination(isPresented: $navigateToNewGame) {
ContentView()
}
}
}
}
struct GameEndCustomSheet_Previews: PreviewProvider {
static var previews: some View {
GameEndCustomSheet()
}
}
ObliviousOre is a new contributor to this site. Take care in asking for clarification, commenting, and answering.
Check out our Code of Conduct.
2
Here are a few thoughts:
- Note the difference between pushing a view onto the navigation stack, and modally presenting a view. From your code, my understanding is that you want to modally presenting a sheet when the game is over, and when the New Game button is tapped, a new
GameViewis pushed onto the nav stack. Below is the code based on that assumption.
import SwiftUI
struct ContentView: View {
@State private var gameEndPageIsPresented = false
@State private var navigateToNewGame = false
var body: some View {
NavigationStack {
Button("Show Game Page") {
gameEndPageIsPresented = true
}
.sheet(isPresented: $gameEndPageIsPresented) {
GameEndCustomSheet()
.onDisappear {
// Navigate to the new view when the sheet disappears
navigateToNewGame = true
}
}
.navigationDestination(isPresented: $navigateToNewGame) {
GameView()
}
}
}
}
struct GameEndCustomSheet: View {
@Environment(.dismiss) private var dismiss
var body: some View {
VStack {
Text("Game Ended")
Button("New Game") {
// Dismiss the sheet
dismiss()
}
}
}
}
struct GameView: View {
var body: some View {
Text("This is another view")
}
}
-
If you want to have a navigation stack for the modally presented sheet, then the
GameEndCustomSheetcannot be the root view of the nav stack. Because once it is dismissed, theNavigationStackis destroyed, and all its modifiers will be invalidated as well. -
Say you want to have multiple views as the root view of a navigation stack, you can create a enum as a state machine, and pass that enum value to the various views you want to display (via a view model, environment value/object, bindings, constant, etc.) So when the value is changed, the root view of a nav stack can redraw based on a switch-case conditional view.
-
If your navigation structure is more complex than a tree-like structure, consider adopting the “Coordinator” pattern in your app (search SwiftUI + Coordinator Pattern). This will allow you to navigate between views via “routes”, instead of push-popping on branches of a tree.