All docschevron-rightMaps SDK for Androidchevron-rightarrow-leftExampleschevron-rightToggle the visibility of a layer

Toggle the visibility of a layer

Allow the user to toggle the visibility of a CircleLayer on a map.

activity_show_hide_layers
<?xml version="1.0" encoding="utf-8"?>
<androidx.coordinatorlayout.widget.CoordinatorLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:mapbox="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent">
<com.mapbox.maps.MapView
android:id="@+id/mapView"
android:layout_width="match_parent"
android:layout_height="match_parent"
mapbox:mapbox_cameraTargetLat="-13.517379300798098"
mapbox:mapbox_cameraTargetLng="-71.97722138410576"
mapbox:mapbox_cameraZoom="15"/>
<com.google.android.material.floatingactionbutton.FloatingActionButton
android:id="@+id/fab_layer_toggle"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="end|bottom"
android:layout_margin="16dp"
android:src="@drawable/ic_layers_24dp"
tools:backgroundTint="@color/pink"/>
</androidx.coordinatorlayout.widget.CoordinatorLayout>
ShowHideLayersActivity.kt
package com.mapbox.maps.testapp.examples
import android.graphics.Color
import android.os.Bundle
import androidx.appcompat.app.AppCompatActivity
import com.mapbox.maps.Style
import com.mapbox.maps.extension.style.layers.generated.circleLayer
import com.mapbox.maps.extension.style.layers.getLayer
import com.mapbox.maps.extension.style.layers.properties.generated.Visibility
import com.mapbox.maps.extension.style.sources.generated.vectorSource
import com.mapbox.maps.extension.style.style
import com.mapbox.maps.testapp.databinding.ActivityShowHideLayersBinding
/**
* Allow the user to toggle the visibility of a CircleLayer on a map.
*/
class ShowHideLayersActivity : AppCompatActivity() {
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
val binding = ActivityShowHideLayersBinding.inflate(layoutInflater)
setContentView(binding.root)
binding.mapView.mapboxMap.loadStyle(
style(Style.LIGHT) {
+vectorSource(SOURCE_ID) {
url(SOURCE_URL)
}
+circleLayer(LAYER_ID, SOURCE_ID) {
sourceLayer(SOURCE_LAYER)
visibility(Visibility.VISIBLE)
circleRadius(8.0)
circleColor(Color.argb(255, 55, 148, 179))
}
}
)
binding.fabLayerToggle.setOnClickListener {
binding.mapView.mapboxMap.getStyle {
it.getLayer(LAYER_ID)?.let { layer ->
if (layer.visibility == Visibility.VISIBLE) {
layer.visibility(Visibility.NONE)
} else {
layer.visibility(Visibility.VISIBLE)
}
}
}
}
}
companion object {
private const val SOURCE_ID = "museums_source"
private const val SOURCE_URL = "mapbox://mapbox.2opop9hr"
private const val SOURCE_LAYER = "museum-cusco"
private const val LAYER_ID = "museums"
}
}
Was this example helpful?