androidkotlinmapboxandroid-jetpack-composemapbox-android

Show Mapbox using Jetpack Compose


Versions

When I run an app mapbox tiles are black. My code:

@Composable
fun MapboxScreen() {

    Box(
        contentAlignment = Alignment.Center,
        modifier = Modifier
            .background(MaterialTheme.colorScheme.background)
            .fillMaxSize()
    ) {
        AndroidView(
            modifier = Modifier,
            factory = { context ->
                ResourceOptionsManager.getDefault(
                    context,
                    context.getString(R.string.mapbox_access_token)
                )

                MapView(context).apply {
                    getMapboxMap().loadStyleUri(Style.MAPBOX_STREETS) {
                         cameraOptions {
                              zoom(19.0)
                         }
                    }
                }
            )
         }
     }

Also I tried tokens in another app (non-compose) and there map tiles are shown correctly.

Was trying code as it is shown in this post: Mapbox map is black using jetpack compose but it wasn't working...

Also tried older Mapbox v9.

Phone Screen


Solution

  • I had to remove in themes.xml item with background

    <style name="Theme.AppCompat.MyTheme" parent="Theme.AppCompat.DayNight.NoActionBar">
        <item name="android:background">@color/neutral_10</item> // remove this line
    </style> 
    

    and it worked like a charm.

    Mapbox probably take these parameter as foreground color for mapbox.

    Also posted more in details here https://github.com/mapbox/mapbox-maps-android/issues/1422