I am noticing a bug in the following code:
// MARK: - BODY
var body: some View {
NavigationView {
ScrollView(.vertical, showsIndicators: false) {
VStack(alignment: .center, spacing: 20) {
// HEADER
FruitHeaderView(fruit: fruit)
VStack(alignment: .leading, spacing: 20) {
// TITLE
Text(fruit.title)
.font(.largeTitle)
.fontWeight(.heavy)
.foregroundColor(fruit.gradientColors[1])
// HEADLINE
Text(fruit.headline)
.font(.headline)
.multilineTextAlignment(.leading)
// NUTRIENTS
// SUBHEADLINE
Text("Learn more about \(fruit.title)".uppercased())
.fontWeight(.bold)
.foregroundColor(fruit.gradientColors[1])
// DESCRIPTION
Text(fruit.description)
.multilineTextAlignment(.leading)
// LINK
SourceLinkView(fruit: fruit)
.padding(.top, 10)
.padding(.bottom, 40)
} //: VSTACK
.padding(.horizontal, 20)
.frame(maxWidth: 640, alignment: .center)
} //: VSTACK
.navigationBarTitle(fruit.title, displayMode: .inline)
.navigationBarHidden(true)
} //: SCROLL
.edgesIgnoringSafeArea(.top)
} //: NAVIGATION
.navigationViewStyle(StackNavigationViewStyle())
} //: BODY
When I initially load this view, I see this after scrolling down a little:
The NavigationView bar/title is not sticking to the top and the ScrollView overlaps with it. However, if I navigate to the link at the bottom of my view (SourceLinkView), it opens the browser and then I can navigate back to my app by tapping in the status bar as usual. Upon doing this, the NavigationView bar behaves as I originally expected it to--without any overlapping of the ScrollView, like this:
I cannot figure out how to resolve this; it appears to be a bug introduced in iOS 15. I'm using Xcode 13.1 and targeting iOS 15. I believe this is an iOS 15 issue because I'm following a course on Udemy and the instructor does not have the same issue (their code/environment was written prior to iOS 15 release).
Has anyone else experienced this? I have tried several things to no avail.
