Пользовательское информационное окно маркера с использованием карт Google ios sdk и swiftui

Question

В моем приложении я пытаюсь заставить настраиваемое информационное окно появляться при нажатии маркера (GMSMarker) с помощью GoogleMaps и представления SwiftUI.

Я ссылаюсь на документацию Google здесь: https://developers.google.com/maps/documentation/ios-sdk/reference/protocol_g_m_s_map_view_delegate-p

В настоящее время я могу отображать пользовательское информационное окно, используя метод markerInfoWindow на моем GMSMapViewDelegate, возвращая UIView, но, поскольку почти все мое приложение построено с использованием представлений swiftui, я хотел бы иметь возможность отображать существующее представление swiftui, а нечем воссоздать представление как UIView.

Вот моя текущая функция, которая создает, а затем отображает базовый UIView в качестве информационного окна (его серый прямоугольник с текстом на нем):

    func mapView(_ mapView: GMSMapView, markerInfoWindow marker: GMSMarker) -> UIView {
        print("Showing marker infowindow")
        let mInfoWindow = UIView(frame: CGRect(x: 0, y: 0, width: self.view.frame.width - 48, height: 200))
        mInfoWindow.backgroundColor = UIColor.lightGray
        mInfoWindow.layer.cornerRadius = 6

        let lbl1 = UILabel(frame: CGRect.init(x: 8, y: 8, width: view.frame.size.width - 16, height: 15))
        lbl1.text = "Hi there!"
        mInfoWindow.addSubview(lbl1)


        return mInfoWindow
    }

Здесьэто вид swiftui, который я хотел бы показать вместо этого:

import SwiftUI
import UIKit

struct MarkerInfoWindow: View {
    var body: some View {

        HStack {
            Text("Image here")

            VStack {
                Text("Content 1")
                Text("Content 2")

            }

            Text("button here")
        }

    }
}

Я довольно новичок в swift, так что это может быть очевидно для более опытных разработчиков, , но есть ли способ, которым я могу вернутьсямой вид swiftui как UIView, чтобы я мог отобразить его в информационном окне?

Или есть способ легколе мой UIView, так что это может быть смесь HStacks и VStacks, если это мой единственный вариант?

Answer 1

Я думаю, что вы могли бы использовать UIHostingController в этой ситуации. Я не пробовал это на картах Google, так как у меня нет проекта, который использует их, поэтому YMMV, но это может, по крайней мере, дать вам отправную точку.

Чтобы использовать UIHostingController, мы можем передать SwiftUI представление, которое мы хотим использовать. Вы можете указать его размер внутри вашего SwiftUI или добавить рамку в выноску.

func mapView(_ mapView: GMSMapView, markerInfoWindow marker: GMSMarker) -> UIView {
    print("Showing marker infowindow") 
    let callout = UIHostingController(rootView: MarkerInfoWindow())
    callout.view.frame = CGRect(x: 0, y: 0, width: self.view.frame.width - 48, height: 200)
    return callout.view
}

Ваш MarkerInfoWindow выглядит так, как будто вы планируете иметь кнопку в нем, я не уверен, как бы вы это реализовали, это может быть простой случай добавления кнопки в SwiftUIкод, хотя из прошлого опыта я знаю, что трудно взаимодействовать с выноской, если кнопка не находится внутри одной из принадлежностей выноски.

---

Это то, что я сделал в MapKit, чтобы показать выноску

func mapView(_ mapView: MKMapView, didSelect view: MKAnnotationView) {
    let callout = UIHostingController(rootView: MarkerInfoWindow())
    callout.view.frame = CGRect(x: 0, y: 0, width: mapView.frame.width - 48, height: 200)
    view.addSubview(callout.view)
}