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

# Tint a fill layer

![Add an image to a style and use it to display a pattern in the landuse FillLayer in the Mapbox Streets style.](https://docs.mapbox.com/android/ja/assets/ideal-img/maps-examples-tint-a-fill-layer.3897ab8.480.png)

This example demonstrates adding an image to a map's [style](https://docs.mapbox.com/style-spec/guides/) and using it to present a pattern within the landuse [`FillLayer`](https://docs.mapbox.com/android/maps/api/latest/mapbox-maps-android/com.mapbox.maps.extension.style.layers.generated/-fill-layer/) of the [Mapbox Streets](https://docs.mapbox.com/api/maps/styles/#classic-mapbox-styles) style.

> **Note (legacy): Classic styles are no longer maintained**
> 
> This example uses classic Mapbox styles (for example: `MAPBOX_STREETS`,`SATELLITE`, `OUTDOORS`, etc). These styles are no longer maintained and may not include the latest features or updates. Developers are encouraged to use the [Mapbox Standard](https://docs.mapbox.com/map-styles/standard/guides#mapbox-standard-satellite) or Mapbox Standard Satellite styles]([https://docs.mapbox.com/map-styles/standard/guides#mapbox-standard-satellite](https://docs.mapbox.com/map-styles/standard/guides#mapbox-standard-satellite)) or to build a custom style using [Mapbox Studio](https://docs.mapbox.com/help/tutorials/aa-standard-in-studio/).

The implementation dynamically changes the fill pattern color on a button click event, configuring the opacity based on zoom level transitions, and applying filters to specific features within the map layer. Key components utilized in this example include the [`style`](https://docs.mapbox.com/android/maps/api/latest/mapbox-maps-android/com.mapbox.maps.extension.style/style.html) class for defining the map style, [`fillLayer`](https://docs.mapbox.com/android/maps/api/latest/mapbox-maps-android/com.mapbox.maps.extension.style.layers.generated/fill-layer.html) for creating the landuse fill layer, [`addImage`](https://docs.mapbox.com/android/maps/api/latest/mapbox-maps-android/com.mapbox.maps/-mapbox-style-manager/add-image.html) for adding the image used for the pattern, and [`linearInterpolator`](https://docs.mapbox.com/android/maps/api/latest/mapbox-maps-android/com.mapbox.maps.extension.style.expressions.generated/-expression/-companion/linear-interpolator.html) for setting opacity levels based on zoom levels. The code showcases how to customize map layers with unique patterns and colors for enhanced map visualization.

> **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: `TintFillPatternActivity.kt`

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

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

import android.graphics.Bitmap
import android.graphics.BitmapFactory
import android.graphics.Canvas
import android.graphics.Paint
import android.graphics.PorterDuff
import android.graphics.PorterDuffColorFilter
import android.os.Bundle
import androidx.annotation.ColorInt
import androidx.appcompat.app.AppCompatActivity
import com.mapbox.maps.Style
import com.mapbox.maps.extension.style.expressions.dsl.generated.eq
import com.mapbox.maps.extension.style.expressions.dsl.generated.literal
import com.mapbox.maps.extension.style.expressions.dsl.generated.zoom
import com.mapbox.maps.extension.style.expressions.generated.Expression.Companion.linearInterpolator
import com.mapbox.maps.extension.style.image.image
import com.mapbox.maps.extension.style.layers.generated.fillLayer
import com.mapbox.maps.extension.style.style
import com.mapbox.maps.testapp.R
import com.mapbox.maps.testapp.databinding.ActivityRtsFillPatternTintBinding

/**
 * Add an image to a style and use it to display a pattern in the landuse
 * FillLayer in the Mapbox Streets style.
 */
class TintFillPatternActivity : AppCompatActivity() {

  private lateinit var initialBitmap: Bitmap

  public override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
    val binding = ActivityRtsFillPatternTintBinding.inflate(layoutInflater)
    setContentView(binding.root)

    initialBitmap = BitmapFactory.decodeResource(resources, R.drawable.fill_pattern)

    binding.fabPaint.setOnClickListener {
      binding.mapView.mapboxMap.style?.apply {
        addImage(FILL_PATTERN_ID, changeBitmapColor(initialBitmap, randomColor()))
      }
    }

    binding.mapView.mapboxMap.loadStyle(
      style(Style.MAPBOX_STREETS) {
        +image(FILL_PATTERN_ID, changeBitmapColor(initialBitmap, randomColor()))
        +fillLayer(FILL_LAYER_ID, STREETS_SOURCE_ID) {
          sourceLayer(SOURCE_LAYER)
          fillPattern(FILL_PATTERN_ID)
          fillOpacity(
            linearInterpolator(
              input = zoom(),
              stops = arrayOf(
                literal(13.0) to literal(0.0),
                literal(15.0) to literal(0.5),
                literal(17.0) to literal(0.75)
              )
            )
          )
          filter(
            eq {
              get { literal(FILTER_FIELD) }
              literal(FILTER_VALUE)
            }
          )
        }
      }
    )
  }

  private fun changeBitmapColor(sourceBitmap: Bitmap, @ColorInt color: Int): Bitmap {
    val config = sourceBitmap.config ?: return sourceBitmap
    val resultBitmap: Bitmap = sourceBitmap.copy(config, true)
    val paint = Paint()
    paint.colorFilter = PorterDuffColorFilter(color, PorterDuff.Mode.SRC_IN)
    val canvas = Canvas(resultBitmap)
    canvas.drawBitmap(resultBitmap, 0f, 0f, paint)
    return resultBitmap
  }

  private fun randomColor(): Int {
    return (Math.random() * 16777215).toInt() or (0xFF shl 24)
  }

  companion object {
    private const val FILL_LAYER_ID = "fill_layer_id"
    private const val FILL_PATTERN_ID = "fill_pattern_id"
    private const val STREETS_SOURCE_ID = "composite"
    private const val SOURCE_LAYER = "landuse"
    private const val FILTER_FIELD = "class"
    private const val FILTER_VALUE = "parking"
  }
}
```