时间戳

首页 > 解决方案 > Mapbox 地图是黑色的使用 jetpack compose

android - Mapbox 地图是黑色的使用 jetpack compose

问题描述

我正在尝试将 Mapbox 与 compose 一起使用，但地图显示不正确。我尝试：

@Composable
fun MapView(
    modifier: Modifier = Modifier
) {
    AndroidView(
        modifier = Modifier.fillMaxSize(),
        factory = { context ->
            var map = MapView(context).apply {
                layoutParams = ViewGroup.LayoutParams(
                    ViewGroup.LayoutParams.MATCH_PARENT,
                    ViewGroup.LayoutParams.MATCH_PARENT
                )
                getMapboxMap().apply {
                    cameraOptions {
                        zoom(19.0)
                    }
                }
            }
            map
        }
    )
}

但显示为空：

安卓地图盒模拟器

标签： androidkotlinmapboxandroid-jetpack

解决方案

您首先必须获得地图框的实例

Mapbox.getInstance(context, public_api_key)

然后在地图视图中，您必须异步获取地图。

MapView(context).apply {
    getMapAsync { mapboxMap ->
        mapboxMap.setStyle(Style.MAPBOX_STREETS)
        val position = CameraPosition.Builder()
            .zoom(19.0)
            .build()
        mapboxMap.animateCamera(CameraUpdateFactory.newCameraPosition(position), 1)
    }
}

对于完整的片段

 AndroidView(
        modifier = modifier,
        factory = { context ->
            Mapbox.getInstance(
                context,
                public_api_key
            )
            MapView(context).apply {
                getMapAsync { mapboxMap ->
                    mapboxMap.setStyle(Style.MAPBOX_STREETS)

                    val position = CameraPosition.Builder()
                        .zoom(19.0)
                        .build()

                    mapboxMap.animateCamera(CameraUpdateFactory.newCameraPosition(position), 1)
                }
            }
        }
    )

推荐阅读