Day 24: Maps SDK for Android Utility–LayerManager

2023 iThome 鐵人賽

DAY 24

Mobile Development

Google Maps SDK for Android 與 GIS App 開發筆記系列第 24 篇

15th鐵人賽 android googlemapssdk layoutmanager

Daniel Huang

2023-10-08 10:18:01

178 瀏覽

分享至

今天要介紹的是 Maps SDK for Android Utility 的最後一個部分--LayerManager。

Utility 內有幾個 Manager 結尾的類別，主要是為了協助開發者管理不同類型的點擊事件，因為實務上，App 內的地圖可能會同時加入許多不同種類的圖層。

以下的步驟會是說明在多圖層的情況下，如何使用這些 Manager 們協助管理圖層。

實作

建立所需類型的 Manager

在設定圖層前先將會使用的 Manager 們實例化。

val markerManager = MarkerManager(map)
val groundOverlayManager = GroundOverlayManager(map!!)
val polygonManager = PolygonManager(map)
val polylineManager = PolylineManager(map)

將建立好的 Manager 傳入圖層的建構式

val clusterManager =
    ClusterManager<StoreClusterItem>(context, map, markerManager)
val geoJsonLineLayer = GeoJsonLayer(
    map,
    R.raw.geojson_file,
    context,
    markerManager,
    polygonManager,
    polylineManager,
    groundOverlayManager
)
val kmlPolylineLayer = KmlLayer(
    map,
    R.raw.kml_file,
    context,
    markerManager,
    polygonManager,
    polylineManager,
    groundOverlayManager,
    null
)

使用 `xxxManager.newCollection()` 新增個別的地圖項目

當我們需要新增其他的 Marker 或 Polygon 等物件到地圖上時，有別於前面幾天學到的，直接將物件新增至地圖上，官方建議可以使用以下的方式新增。

以 Marker 來說，應該要透過 MarkerManager.newCollection() 建立一個新的 Collection 再加入 Marker。

val markerCollection =
    markerManager.newCollection()
markerCollection.addMarker(
    MarkerOptions()
        .position(LatLng(51.150000, -0.150032))
        .icon(BitmapDescriptorFactory.defaultMarker(BitmapDescriptorFactory.HUE_AZURE))
        .title("Unclustered marker")
)

也可以傳入字串作為唯一碼，之後可以從 Manager 身上拿到相同的 Collection

// 建立新的 Collection
MarkerManager.newCollection("THE_VERY_UNIQUE_ID")

// 取得以該 ID 建立的 Collection
MarkerManager.getCollection("THE_VERY_UNIQUE_ID")

處理點擊事件

這是原本 KML 圖層的點擊事件

kmlPolylineLayer.addLayerToMap()
kmlPolylineLayer.setOnFeatureClickListener { feature: Feature ->
    // 處理事件點擊
}

新加入的其他 Marker 或 Polygon 類的圖形，可以針對該 Collection 設定點擊事件，例如：


markerCollection.setOnMarkerClickListener { marker: Marker ->
    Toast.makeText(
        context,
        "Marker clicked: ${marker.title}",
        Toast.LENGTH_SHORT
    ).show()
    false
}