> For the complete documentation index, see [llms.txt](https://docs.mapbox.com/android/ja/maps/llms.txt)

# Sky Snapshotter

![Junction view showcase.](https://docs.mapbox.com/android/ja/assets/ideal-img/maps-examples-sky-snapshotter.4ddac8f.480.png)

This example demonstrates using [`Snapshotter`](https://docs.mapbox.com/android/maps/api/latest/mapbox-maps-android/com.mapbox.maps/-snapshotter/) to generate a static map image based on the main [MapView](https://docs.mapbox.com/android/maps/api/latest/mapbox-maps-android/com.mapbox.maps/-map-view/) and display it to the user. Additional configuration is applied to the snapshot image, setting a custom [`skyLayer`](https://docs.mapbox.com/android/maps/api/latest/mapbox-maps-android/com.mapbox.maps.extension.style.layers.generated/-sky-layer/) gradient. In this case, the use case for the snapshot is to display a future maneuver to a user that is navigating a route.

The implementation sets up a `MapView` with a specific camera configuration, enabling a pitched and tilted view of the map for a 3D perspective. A `SkyLayer` is added to the map style to render a gradient sky effect, transitioning from yellow to pink. The `Snapshotter` generates a snapshot of the map **with a different sky effect** using the `SkyType.ATMOSPHERE`. Once the snapshot is ready, it is displayed in an `ImageView`.

> **Note: Android Examples App Available**
> 
> This example code is part of the **Maps SDK for Android Examples App**, a working Android project [available on GitHub](https://github.com/mapbox/mapbox-maps-android/tree/v11.29.0/). Android developers are encouraged to run the examples app locally to interact with this example in an emulator and explore other features of the Maps SDK.
> 
> See our [Run the Maps SDK for Android Examples App](https://docs.mapbox.com/help/tutorials/maps-sdk-android-examples-app/) tutorial for step-by-step instructions.

**Kotlin**

Title: `SkyLayerSnapshotterActivity.kt`

[View on GitHub](https://github.com/mapbox/mapbox-maps-android/blob/v11.29.0/app/src/main/java/com/mapbox/maps/testapp/examples/sky/SkyLayerSnapshotterActivity.kt)

```kt
package com.mapbox.maps.testapp.examples.sky

import android.os.Bundle
import android.view.View
import android.widget.Toast
import androidx.appcompat.app.AppCompatActivity
import com.mapbox.geojson.Point
import com.mapbox.maps.*
import com.mapbox.maps.extension.style.expressions.dsl.generated.interpolate
import com.mapbox.maps.extension.style.layers.addLayer
import com.mapbox.maps.extension.style.layers.generated.skyLayer
import com.mapbox.maps.extension.style.layers.properties.generated.SkyType
import com.mapbox.maps.extension.style.style
import com.mapbox.maps.plugin.compass.compass
import com.mapbox.maps.plugin.scalebar.scalebar
import com.mapbox.maps.testapp.databinding.ActivitySkySnapshotterBinding

/**
 * Prototype for Junction view showing upcoming maneuver.
 */
class SkyLayerSnapshotterActivity : AppCompatActivity() {

  private var snapshotter: Snapshotter? = null
  private lateinit var binding: ActivitySkySnapshotterBinding

  override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
    binding = ActivitySkySnapshotterBinding.inflate(layoutInflater)
    setContentView(binding.root)
    binding.mapView.scalebar.enabled = false
    binding.mapView.compass.enabled = false
    binding.mapView.mapboxMap.setCamera(
      CameraOptions.Builder()
        .center(Point.fromLngLat(24.827187523937795, 60.55932732152849))
        .zoom(16.0)
        .pitch(85.0)
        .bearing(330.1)
        .build()
    )
    binding.mapView.mapboxMap.loadStyle(
      styleExtension = style(Style.STANDARD) {
        +skyLayer("sky") {
          skyType(SkyType.GRADIENT)
          skyGradient(
            interpolate {
              linear()
              skyRadialProgress()
              literal(0.0)
              literal("yellow")
              literal(1.0)
              literal("pink")
            }
          )
          skyGradientCenter(listOf(-34.0, 90.0))
          skyGradientRadius(8.0)
        }
      }
    ) { prepareSnapshotter() }
  }

  private fun prepareSnapshotter() {
    val snapshotMapOptions = MapSnapshotOptions.Builder()
      .size(Size(512.0f, 512.0f))
      .build()

    snapshotter = Snapshotter(this, snapshotMapOptions).apply {
      setStyleListener(object : SnapshotStyleListener {
        override fun onDidFinishLoadingStyle(style: Style) {
          style.addLayer(
            skyLayer("sky_snapshotter") {
              skyType(SkyType.ATMOSPHERE)
              skyAtmosphereSun(listOf(0.0, 90.0))
            }
          )
        }
      })
      setCamera(
        CameraOptions.Builder()
          .center(Point.fromLngLat(24.81958807097479, 60.56524768721757))
          .zoom(16.0)
          .pitch(85.0)
          .bearing(330.1)
          .build()
      )
      setStyleUri(Style.STANDARD)
      start { bitmap, error ->
        if (bitmap != null) {
          binding.maneuverView.setImageBitmap(bitmap)
          binding.maneuverCaption.visibility = View.VISIBLE
        } else {
          Toast.makeText(
            this@SkyLayerSnapshotterActivity,
            "Snapshotter error: $error",
            Toast.LENGTH_SHORT
          ).show()
        }
      }
    }
  }

  override fun onDestroy() {
    super.onDestroy()
    snapshotter?.cancel()
  }
}
```