I’ll preface this by saying it has been years since I’ve programmed, however, after going through Chris’ courses, I got myself up-to-speed incredibly quickly. My company has been talking about an App for over 5 years, but nothing has materialized. Now, after just over a month, I have working proof-of-concept that easily could turn into the first release.
I’ve got one critical piece that I’m stuck at. In my app I show a Google Map of our location, with a search box at the bottom. When you search, a list of results come up in a Sheet (SearchResultsView). If you click on a list item from the results, it closes the sheet and returns the value of the department selected.
In GoogleMapsView, it will draw a polygon if a DepartmentName is provided. However, I can’t get it to refresh the GoogleMapsView when I close the Sheet. If I click “< Back” and then go back into the map, it forces a re-draw and looks correct.
I have tried passing @State variables (both departmentName strings and departmentChanged boolean), I’ve trying creating a Class and using @ObservedObjects, and I’ve even resorted to using a Global variable to store the departmentName.
I’m new at all of this, and I’m convinced there is just some obvious concept I’m missing, but after messing with it all day yesterday, I’m stumped.
Here is my code that shows the map, searchbox, and sheet:
//
// StoreView.swift
//
import SwiftUI
import Drawer
struct StoreView: View {
@State var heights = [CGFloat(100), CGFloat(100)]
@State var sheetVisible: Bool = false
@State var textInput: String = “”
var store: Store
var body: some View {
ZStack{
GoogleMapsView(store: store, mapLatitude: store.mapLatitude, mapLongitude: store.mapLongitude, mapZoom: store.mapZoom, mapBearing: store.mapBearing)
.edgesIgnoringSafeArea(.top)
VStack{
if store.showDetails {
HStack{
Spacer()
VStack{
//Image(systemName: "text.justify")
Image(systemName: "fish")
.background(
Circle().fill(Color(red: 0/255, green: 150/255, blue: 77/255)).scaleEffect(1.25)
)
.padding(.trailing, 20)
.onTapGesture{
selectedDepartmentName = ""
sheetVisible = true
}
}
.font(.title2)
.foregroundColor(.white)
}
Drawer(heights: $heights) {
ZStack{
RoundedRectangle(cornerRadius: 12)
.foregroundColor(.white)
.shadow(radius: 100)
VStack{
RoundedRectangle(cornerRadius: 3.0)
.foregroundColor(.gray)
.frame(width: 30.0, height: 6.0)
.padding(10)
// Drawer Content View
DrawerContentView(storeId: store.storeId)
Spacer()
}
}
}
//.rest(at: .constant([30, 100, UIScreen.main.bounds.height/2]))
.rest(at: .constant([20,100]))
.impact(.light)
Spacer()
}
}
}
.sheet(isPresented: $sheetVisible) {
StoreDetailView(store: store, sheetVisible: $sheetVisible)
}
}
}
struct StoreView_Previews: PreviewProvider {
static var previews: some View {
StoreView(store: Store(storeId: “FF”, name: “Test Store”, imageName: “fairfield-store”, iconName: “fairfield-icon”, description: “test description”,POIs: [POI(title: “Giraffe”, snippet: “Entrance”, positionLatitude: 39.335396227401546, positionLongitude: -84.52567004490223)]))
}
}
struct DrawerContentView: View {
@State var searchString: String = “”
@State var sheetVisible: Bool = false
@State private var selected = 1
@State var showInStockOnly = true
var storeId: String
var body: some View {
VStack{
HStack{
TextField("Item Search",text:$searchString)
.border(.secondary)
.textFieldStyle(.roundedBorder)
.onSubmit {
sheetVisible = true
}
Spacer()
Image(systemName: "magnifyingglass")
.onTapGesture{
sheetVisible = true
}
}
Toggle("Show In Stock Items Only", isOn: $showInStockOnly)
.padding([.top], 5.0)
}
.padding(.horizontal)
.foregroundColor(.gray)
.sheet(isPresented: $sheetVisible) {
SearchResultsView(storeId: storeId, searchTerm: searchString, showInStockOnly: showInStockOnly, sheetVisible: $sheetVisible)
}
}
}