Google地图的自定义信息窗口 [英] Custom Info Window for Google Maps

问题描述

我想为iOS的Google Maps创建一个自定义的信息窗口，如下图所示.是否可以像创建GMSMarker，GMSPolyline和GMSPolygon那样扩展GMSOverlay以创建自定义图形?

I'd like to make a custom Info Window for Google Maps for iOS like the photo below. Is it possible to extend GMSOverlay like GMSMarker, GMSPolyline, and GMSPolygon do to create custom graphics?

推荐答案

对于那些试图在表示信息窗口的自定义视图中添加按钮的人来说，这似乎是不可能的，因为Google Maps SDK会将其绘制为图像或这样的事情.但是有一个非常简单的解决方案:

For those who's trying to add buttons to a custom view representing info window - it seems to be impossible to do, because Google Maps SDK draws it as an image or something like this. But there is a quite simple solution:

1. 您必须使用按钮以及需要在信息窗口中显示的内容来创建自定义视图.
2. 将其添加为您的 mapView(mapView:GMSMapView，didTapMarker标记:GMSMarker)方法中的子视图.您可以通过 mapView.projection.pointForCoordinate(marker.position)
获取点击标记的坐标来设置自定义视图的位置

3. 您的自定义视图可能必须通过跟随摄像机的位置来更改其位置，因此您必须处理 mapView(mapView:GMSMapView，didChangeCameraPosition位置:GMSCameraPosition)，在这里您可以轻松更新自定义视图查看位置.

1. You have to create a custom view with buttons and whatever you need to be displayed in your info window.
2. Add it as a subview in your mapView(mapView: GMSMapView, didTapMarker marker: GMSMarker) method. You can set a position of a custom view by getting a coordinates of a marker tapped with a help of mapView.projection.pointForCoordinate(marker.position)

3. Your custom view possibly has to change it position by following camera position, so you have to handle mapView(mapView: GMSMapView, didChangeCameraPosition position: GMSCameraPosition) where you could easily update your custom view position.

var infoWindow = CustomInfoView()
var activePoint : POIItem?

func mapView(mapView: GMSMapView, didTapMarker marker: GMSMarker) -> Bool {
    if let poiItem = marker as? POIItem {
    // Remove previously opened window if any
        if activePoint != nil {
            infoWindow.removeFromSuperview()
            activePoint = nil
        }
        // Load custom view from nib or create it manually
        // loadFromNib here is a custom extension of CustomInfoView
        infoWindow = CustomInfoView.loadFromNib()
        // Button is here
        infoWindow.testButton.addTarget(self, action: #selector(self.testButtonPressed), forControlEvents: .AllTouchEvents)

        infoWindow.center = mapView.projection.pointForCoordinate(poiItem.position)
        activePoint = poiItem
        self.view.addSubview(infoWindow)
    }
    return false
}

func mapView(mapView: GMSMapView, didChangeCameraPosition position: GMSCameraPosition) {

    if let tempPoint = activePoint {
        infoWindow.center = mapView.projection.pointForCoordinate(tempPoint.position)
    }

}

这篇关于Google地图的自定义信息窗口的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！