map-add-controls-android.md

title	description	author	ms.author	ms.date	ms.topic	ms.service	services	zone_pivot_groups
Add controls to an Android map | Microsoft Azure Maps	How to add zoom control, pitch control, rotate control and a style picker to a map in Microsoft Azure Maps Android SDK.	stevemunk	v-munksteve	02/26/2021	conceptual	azure-maps	azure-maps	azure-maps-android

Add controls to a map (Android SDK)

This article shows you how to add UI controls to the map.

Add zoom control

A zoom control adds buttons for zooming the map in and out. The following code sample creates an instance of the ZoomControl class and adds it to a map.

::: zone pivot="programming-language-java-android"

//Construct a zoom control and add it to the map.
map.controls.add(new ZoomControl());

::: zone-end

::: zone pivot="programming-language-kotlin"

//Construct a zoom control and add it to the map.
map.controls.add(ZoomControl())

::: zone-end

The screenshot below is of a zoom control loaded on a map.

Add pitch control

A pitch control adds buttons for tilting the pitch to map relative to the horizon. The following code sample creates an instance of the PitchControl class and adds it to a map.

::: zone pivot="programming-language-java-android"

//Construct a pitch control and add it to the map.
map.controls.add(new PitchControl());

::: zone-end

::: zone pivot="programming-language-kotlin"

//Construct a pitch control and add it to the map.
map.controls.add(PitchControl())

::: zone-end

The screenshot below is of a pitch control loaded on a map.

Add compass control

A compass control adds a button for rotating the map. The following code sample creates an instance of the CompassControl class and adds it to a map.

::: zone pivot="programming-language-java-android"

//Construct a compass control and add it to the map.
map.controls.add(new CompassControl());

::: zone-end

::: zone pivot="programming-language-kotlin"

//Construct a compass control and add it to the map.
map.controls.add(CompassControl())

::: zone-end

The screenshot below is of a compass control loaded on a map.

Add traffic control

A traffic control adds a button for toggling the visibility of traffic data on the map. The following code sample creates an instance of the TrafficControl class and adds it to a map.

::: zone pivot="programming-language-java-android"

//Construct a traffic control and add it to the map.
map.controls.add(new TrafficControl());

::: zone-end

::: zone pivot="programming-language-kotlin"

//Construct a traffic control and add it to the map.
map.controls.add(TrafficControl())

::: zone-end

The screenshot below is of a traffic control loaded on a map.

A map with all controls

Multiple controls can be put into an array and added to the map all at once and positioned in the same area of the map to simplify development. The following code adds the standard navigation controls to the map using this approach.

::: zone pivot="programming-language-java-android"

map.controls.add(
    new Control[]{
        new ZoomControl(),
        new CompassControl(),
        new PitchControl(),
        new TrafficControl()
    }
);

::: zone-end

::: zone pivot="programming-language-kotlin"

map.controls.add(
    arrayOf<Control>(
        ZoomControl(),
        CompassControl(),
        PitchControl(),
        TrafficControl()
    )
)

::: zone-end

The screenshot below shows all controls loaded on a map. The order they are added to the map, is the order they will appear.

Next steps

See the following articles for more code samples to add to your maps:

[!div class="nextstepaction"] Add a symbol layer

[!div class="nextstepaction"] Add a bubble layer

[!div class="nextstepaction"] Add a line layer

[!div class="nextstepaction"] Add a polygon layer