Maps SDK ( TomTom) — quick tutorial

New SDK for displaying a map is on the market. TomTom Maps SDK. If you want to display in your app map quickly you should take a look. It is for android (https://developer.tomtom.com/maps-sdk-android) and ios (https://developer.tomtom.com/maps-ios-sdk/) platform. The good news is that you can check that sdk for free ( 2500 requests/per day are free).

www.developer.tomtom.com — SDKs for IOS and Android

How display a map — quick tutorial

Go to developer.tomtom.com and register. Log in and go to your dashboard.

Press add a new App, choose a name and select product which you will use

On your dashboard is a new app, please select the app to expand product and check key. The most important is Customer API Key ( 2500 request/per day are for free) This key is needed for sdk please copy this key to clipboard because it is needed in next steps.

Now you are ready to create a new application and display a map.


Android — create a new app

Create new android project — kotlin support
Empty activity — with default names for layout and activity

add to root/build.gradle a maven tomtom repository.

maven {
url 'https://maven.tomtom.com:8443/nexus/content/repositories/releases/'
}

In AndroidManifest.xml add your key OnlineMaps.Key:

and last thing is adding a dependency to app/build.gradle

implementation("com.tomtom.online:sdk-maps:2.+@aar"){
transitive = true;
}

in android section please enable multidex ( it is simple when minSDKVersion is 21 or higher)

android {
defaultConfig {
...
minSdkVersion 21
targetSdkVersion 26
multiDexEnabled true
}
...
}

Coding

Add a map to layout

<com.tomtom.online.sdk.map.MapView
android:id="@+id/map_view"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"
>

</com.tomtom.online.sdk.map.MapView>

and voila — in our app is a displayed a map:

Map manipulation

We can add a marker or/and change map to 3d mode. We should do this in MainActivity.kt. We need inflate a mapview and pass lifecycle to the view:

class MainActivity : AppCompatActivity() {
lateinit var mapView: MapView
override fun onCreate(savedInstanceState: Bundle?) {
super.onCreate(savedInstanceState)
setContentView(R.layout.activity_main)
Timber.plant(Timber.DebugTree())
mapView = findViewById<MapView>(R.id.map_view);
mapView.addOnMapReadyCallback { tomtomMap ->
val
amsterdam = LatLng(52.36,4.88)
tomtomMap.centerOn(amsterdam, 12)
tomtomMap.addMarker(MarkerBuilder(amsterdam))
}
}

override fun onResume() {
super.onResume()
mapView.onResume()
}

override fun onPause() {
mapView.onPause()
super.onPause()

}
}

and that all, you are ready to play with the map.

Example code is on github (https://github.com/mariopce/tomtom-sdk-example ), please check out the new TomTom SDK.

Like what you read? Give Mariusz Saramak a round of applause.

From a quick cheer to a standing ovation, clap to show how much you enjoyed this story.