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

# Scale Bar

![Show scale bar at custom position.](https://docs.mapbox.com/android/ja/assets/ideal-img/maps-examples-scale-bar.be0bbeb.480.png)

This example demonstrates how to create a scale bar using XML with the **Mapbox Maps SDK for Android**.

The code below sets adds a scale bar to the activity layout to show how many miles a segment of the map covers. This XML element renders the `R.layout.activity_scale_bar` visual which shifts in scale as you zoom in and out of the map.

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

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

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

import android.os.Bundle
import androidx.appcompat.app.AppCompatActivity
import com.mapbox.maps.testapp.R

/**
 * Activity to showcase scale bar custom configuration using xml attributes.
 */
class ScaleBarActivity : AppCompatActivity() {

  override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
    setContentView(R.layout.activity_scale_bar)
  }
}
```

**XML**

Title: `activity_scale_bar.xml`

[View on GitHub](https://github.com/mapbox/mapbox-maps-android/blob/v11.31.0/app/src/main/res/layout/activity_scale_bar.xml)

```xml
<?xml version="1.0" encoding="utf-8"?>
<com.mapbox.maps.MapView xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/mapView"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    app:mapbox_cameraTargetLat="61.489557808394814"
    app:mapbox_cameraTargetLng="23.735379149896005"
    app:mapbox_cameraZoom="14.940602577615023"

    app:mapbox_scaleBarBorderWidth="1dp"
    app:mapbox_scaleBarHeight="5dp"
    app:mapbox_scaleBarGravity="bottom|center_horizontal"
    app:mapbox_scaleBarDistanceUnits="metric"
    app:mapbox_scaleBarMarginBottom="50dp"
    app:mapbox_scaleBarMarginRight="0dp"
    app:mapbox_scaleBarPrimaryColor="@android:color/black"
    app:mapbox_scaleBarRatio="0.8"
    app:mapbox_scaleBarSecondaryColor="@android:color/white"
    app:mapbox_scaleBarShowTextBorder="true"
    app:mapbox_scaleBarTextBarMargin="10dp"
    app:mapbox_scaleBarTextBorderWidth="5dp"
    app:mapbox_scaleBarTextColor="@android:color/black"
    app:mapbox_scaleBarTextSize="10dp" />
```