THIS SDK ISDEPRECATED.

We rolled out a new and better SDK for you.

Map UI Extensions

Use default compass, current location buttons, zooming, and panning controls built into the Maps SDK. You can read more on the Map UI extensions page.

Sample use case 1: You want to provide your users with the compass, current location, and panning and zooming controls so they can quickly center the map on their current location, set it to display north at the top of the screen after rotating the map, and pan or zoom the map. You can use the default controls provided with the Maps SDK.

Sample use case 2: You want to provide your users with the compass, current location, panning and zooming controls and you want to use custom icons that are designed for your app style.

Sample use case 3: In some of the screens in your app, you want to remove the compass, current location, and panning and zooming controls.

Since all ui elements are fully customizable because the Android view’s properties are exposed, changing the default icons for them is straight forward:

1ArrowButtonsGroup arrowButtons = tomtomMap.getUiSettings().getPanningControlsView().getView()
2arrowButtons.getArrowDownButton().setImageResource(R.drawable.btn_down_custom);
3arrowButtons.getArrowUpButton().setImageResource(R.drawable.btn_up_custom);
4arrowButtons.getArrowLeftButton().setImageResource(R.drawable.btn_left_custom);
5arrowButtons.getArrowRightButton().setImageResource(R.drawable.btn_right_custom);
1val arrowButtonGroup: ArrowButtonsGroup =
2 tomtomMap.uiSettings.panningControlsView.view as ArrowButtonsGroup
3arrowButtonGroup.arrowDownButton.setImageResource(R.drawable.arrow_button_down_custom)
4arrowButtonGroup.arrowUpButton.setImageResource(R.drawable.arrow_button_up_custom)
5arrowButtonGroup.arrowLeftButton.setImageResource(R.drawable.arrow_button_left_custom)
6arrowButtonGroup.arrowRightButton.setImageResource(R.drawable.arrow_button_right_custom)
1ZoomButtonsGroup zoomButtons = tomtomMap.getUiSettings().getZoomingControlsView().getView();
2zoomButtons.getZoomInButton().setImageResource(R.drawable.btn_zoom_in_custom);
3zoomButtons.getZoomOutButton().setImageResource(R.drawable.btn_zoom_out_custom);
1val zoomButtonsGroup: ZoomButtonsGroup =
2 tomtomMap.uiSettings.zoomingControlsView.view as ZoomButtonsGroup
3zoomButtonsGroup.zoomInButton.setImageResource(R.drawable.zoom_in_button_custom)
4zoomButtonsGroup.zoomOutButton.setImageResource(R.drawable.zoom_out_button_custom)

image

Default ui extensions controls

image

Default ui extensions controls - Hidden

image

Custom ui extensions controls