In Chapter 3 when you embed the VStack in a NavigationView, the canvas shows a blank area over the top of the view and when the simulator is run the entire screen is blank. At first I thought it was my code but if I run the Final project from the Chapter 3 folder, it has the same problem. If I remove the NavigationView, everything seems fine
I’m running Xcode Version 11.1 (11A1027) which I believe is the latest.
This is an issue in Apple’s SwiftUI sample code as well where the BuildingListsAndNavigation example does not include this and also does not work properly.
by default I choose the iPad as device. When you embed the VStack into the NavigationView the screen of the iPad goes white (perhaps black when you are in dark mode). This is also valid for the physical device!
changing the device to e.g iPhone Pro everything works fine.
hi Fritz! On an iPad, the default is split-view, so you have to swipe from the leading edge to show the initial view. This is discussed in Chapter 10, just before the Displaying a list of data section.
hi Amir! the width size class of 11 Max in landscape is regular vs compact for 11, so it behaves like an iPad. Unfortunately, it seems to be ignoring StackNavigationViewStyle(). I’m updating this chapter to avoid NavigationView — I only used it to show dark mode, but that has stopped working in preview.
I am confused by the comments that dark mode has stopped working in preview and that StackNavigationViewStyle() is being ignored. I am running the current version of Xcode, 11.4, and both are dark mode and StackNavigationViewStyle() are working for me in the example. Here is my body (not sure how to format code for insertion so hopefully this works without making a mess).
var body: some View {
NavigationView {
VStack(spacing: -6.0) {
HStack {
VStack {
Color(red: rTarget, green: gTarget, blue: bTarget)
self.showAlert ? Text("R: \(Int(rTarget * 255.0))"
+ " G: \(Int(gTarget * 255.0))"
+ " B: \(Int(bTarget * 255.0))")
: Text("Match this color")
}
VStack {
ZStack(alignment: .center) {
Color(red: rGuess, green: gGuess, blue: bGuess)
Text(String(timer.counter))
.padding(.all, 5)
.background(Color.white)
.mask(Circle())
.foregroundColor(.black)
}
Text("R: \(Int(rGuess * 255.0))" +
" G: \(Int(gGuess * 255.0))" +
" B: \(Int(bGuess * 255.0))")
}
}
Button(action: {
self.showAlert = true
self.timer.killTimer()
}) {
Text("Hit Me!")
}.alert(isPresented: $showAlert) {
Alert(title: Text("Your Score"), message: Text(String(computeScore())))
}.padding()
VStack {
ColorSlider(value: $rGuess, textColor: .red)
ColorSlider(value: $gGuess, textColor: .green)
ColorSlider(value: $bGuess, textColor: .blue)
}.padding(.horizontal)
}
.padding(.top, -45.0)
.navigationBarTitle("Bullseye")
.navigationBarHidden(true)
}
// Need to set the navigationViewStyle here for the views to work in landscape on iPhone 11 Pro Max
.navigationViewStyle(StackNavigationViewStyle())
.environment(\.colorScheme, .dark)
}
thanks! that location for navigationViewStyle works!
but colorScheme really wasn’t working for me, not even in debug preview, and I’m pretty sure I was using 11.4, possibly beta.
thanks again! maybe I won’t have to rewrite so much of this chapter after all
Edited to add: I remember now: I was trying to get .colorScheme(.dark) to work without using NavigationView, because I couldn’t get StackNavigationViewStyle to work. Although it still doesn’t seem right that you have to use NavigationView for dark mode.