This is part of the code from my project - the issue that I am getting is that the bottom sheet when it appears it appears infront of the tabview items - while I want it to appear behind the tabview.
import SwiftUI
import MapKit
import CoreLocation
import UIKit
...
struct ContentView: View {
@State private var mapType: MKMapType = .standard
@State private var selectedTab = 0
@State private var ShowingBottomSheet = false
...
VStack {
ZStack(alignment: .topLeading) {
MapView(region: $mapAPI.region, mapType: $mapType, imageLocations: imageLocations,
weatherInfo: $weatherInfo, showWeatherInfo: $showWeatherInfo)
.ignoresSafeArea(edges: .top)
VStack {
HStack {
TextField("Enter an address", text: $text, onCommit: {
fetchLocationInfoFromWikipedia(for: text)
mapAPI.getLocation(address: text, delta: 0.5)
showLocationInfo = true
ShowingBottomSheet.toggle()
// Save the image location
if let location = mapAPI.locations.last?.coordinate {
ImageDataManager.shared.saveImageLocation(location)
}
})
.textFieldStyle(.roundedBorder)
.padding(.horizontal)
.foregroundColor(.black)
.frame(width: UIScreen.main.bounds.size.width - 40)
.sheet(isPresented: $ShowingBottomSheet, content: {
ZStack(content: {
ScrollView {
Text(locationInfo)
.foregroundColor(.black)
.frame(maxWidth: .infinity, alignment: .leading)
.padding()
.fixedSize(horizontal: false, vertical: true)
.font(.custom("SanFranciscoDisplay-Bold", size: 13))
}
})
.presentationDetents([.fraction(0.2), .fraction(0.4), .fraction(0.6)])
.zIndex(1)
})
...
}
.zIndex(0)
}
.tabItem {
Image(systemName: "location.circle.fill")
.accentColor(.black)
Text("Map")
}
.tag(0)
...
}
.tag(1)
...
}
.tag(3)
}
.accentColor(.black)
}
...
