How to display view within a sheet programmatically in SwiftUI? - google-maps

Question

I am currently using Google Maps API in SwiftUI, and am trying to get a sheet to appear after a marker infoWindow is tapped programmatically.
In other parts of my app I’m displaying sheets like this, and it’s the same thing I’m trying to achieve here but programmatically:
https://blog.kaltoun.cz/swiftui-presenting-modal-sheet/
Right now I have a function that prints a message when an infoWindow is tapped, but don’t know how to make a SwiftUI view appear within a sheet using the function.
-
Since I’m using SwiftUI, the way I implement the Google Maps API is a little different than in plain Swift.
Here are the basics of my GMView.swift file that handles all the google maps stuff.
import SwiftUI
import UIKit
import GoogleMaps
import GooglePlaces
import CoreLocation
import Foundation
struct GoogMapView: View {
var body: some View {
GoogMapControllerRepresentable()
}
}
class GoogMapController: UIViewController, CLLocationManagerDelegate, GMSMapViewDelegate {
var locationManager = CLLocationManager()
var mapView: GMSMapView!
let defaultLocation = CLLocation(latitude: 42.361145, longitude: -71.057083)
var zoomLevel: Float = 15.0
let marker : GMSMarker = GMSMarker()
override func viewDidLoad() {
super.viewDidLoad()
locationManager = CLLocationManager()
locationManager.desiredAccuracy = kCLLocationAccuracyBest
locationManager.requestAlwaysAuthorization()
locationManager.distanceFilter = 50
locationManager.startUpdatingLocation()
locationManager.delegate = self
let camera = GMSCameraPosition.camera(withLatitude: defaultLocation.coordinate.latitude, longitude: defaultLocation.coordinate.longitude, zoom: zoomLevel)
mapView = GMSMapView.map(withFrame: view.bounds, camera: camera)
mapView.autoresizingMask = [.flexibleWidth, .flexibleHeight]
mapView.isMyLocationEnabled = true
mapView.setMinZoom(14, maxZoom: 20)
mapView.settings.compassButton = true
mapView.isMyLocationEnabled = true
mapView.settings.myLocationButton = true
mapView.settings.scrollGestures = true
mapView.settings.zoomGestures = true
mapView.settings.rotateGestures = true
mapView.settings.tiltGestures = true
mapView.isIndoorEnabled = false
marker.position = CLLocationCoordinate2D(latitude: 42.361145, longitude: -71.057083)
marker.title = "Boston"
marker.snippet = "USA"
marker.map = mapView
// Add the map to the view, hide it until we've got a location update.
view.addSubview(mapView)
// mapView.isHidden = true
}
// Handle incoming location events.
func locationManager(_ manager: CLLocationManager, didUpdateLocations locations: [CLLocation]) {
let location: CLLocation = locations.last!
print("Location: \(location)")
let camera = GMSCameraPosition.camera(withLatitude: location.coordinate.latitude, longitude: location.coordinate.longitude, zoom: zoomLevel)
if mapView.isHidden {
mapView.isHidden = false
mapView.camera = camera
} else {
mapView.animate(to: camera)
}
}
// Handle authorization for the location manager.
func locationManager(_ manager: CLLocationManager, didChangeAuthorization status: CLAuthorizationStatus) {
switch status {
case .restricted:
print("Location access was restricted.")
case .denied:
print("User denied access to location.")
// Display the map using the default location.
mapView.isHidden = false
case .notDetermined:
print("Location status not determined.")
case .authorizedAlways: fallthrough
case .authorizedWhenInUse:
print("Location status is OK.")
}
}
// Handle location manager errors.
func locationManager(_ manager: CLLocationManager, didFailWithError error: Error) {
locationManager.stopUpdatingLocation()
print("Error: \(error)")
}
}
struct GoogMapControllerRepresentable: UIViewControllerRepresentable {
func makeUIViewController(context: UIViewControllerRepresentableContext<GMControllerRepresentable>) -> GMController {
return GMController()
}
func updateUIViewController(_ uiViewController: GMController, context: UIViewControllerRepresentableContext<GMControllerRepresentable>) {
}
}
Here is the function I'm putting within GMView.swift's UIViewController (GMController) that I’m trying to use to make a view appear within a sheet:
// Function to handle when a marker's infowindow is tapped
func mapView(_ mapView: GMSMapView, didTapInfoWindowOf didTapInfoWindowOfMarker: GMSMarker) {
print("You tapped a marker's infowindow!")
return
}
Here is the view I’m trying to get to appear:
struct SortBy: View {
var body: some View {
VStack(alignment: .leading) {
Text("Sort By")
.font(.title)
.fontWeight(.black)
.padding(.trailing, 6)
Rectangle()
.fill(Color.blue)
.frame(width: 200, height: 200)
}
}
}
Does anyone know how I can get my function above to make a SwiftUI view appear within a sheet?

Answer 1

Use .sheet similarly like here:
https://blog.appsbymw.com/posts/how-to-present-and-dismiss-a-modal-in-swiftui-155c/

Answer 2

You will need:
In your UIViewControllerRepresentable, add a State object, let's say #State var showModal = false
In your parent view, Use .sheet(isPresented: $showModal) { CONTENT_VIEW(showModal: $showModal) }
In your UIViewControllerRepresentable, also add a Binding for showModal .
In your UIViewControllerRepresentable, use Coordinator to set your UIViewController and GMSMapViewDelegate
In your UIViewController, Now you can access the Binding via owner.showModal
Hope it helps. Good luck.