Android Google Maps API Integration

Filed Under: Android

In this tutorial we’ll show how to integrate android google maps API in our application and customise it according to our own needs. Android Google Maps is an important utility that features in numerous apps.

Android Google Maps API

Android Google Maps v1 API is deprecated now so we’ll integrate Google Maps v2 API in our application.

The API automatically handles access to Google Maps servers, data downloading, map display, and response to map gestures.

We can use the API calls to add markers, polygons, show user location and provide additional features for the user to interact with the map.

Android Google Maps API key

To use android google maps api in our application we need to register our app in the google developer console and enable the Google Map API keys.

Click the Create Project button to create a new project and give it the desired name.

android-maps-dashboard

Select Google Maps Android API and click the Enable API button that appears on the next page.

android-maps-api-list

android-maps-enable-key

After the API is enabled, click Go to Credentials, from the left panel. From the Add Credentials menu , select API Key.

android-maps-credential

Select Android Key as shown below.

android-maps-key-type

Click the add package name and fingerprint button to add your app’s package name (We’ve used com.journaldev.integratingmaps) and the SHA1 fingerprint. After clicking the Create button, you will be shown an API key that we will use in our app.

Note : The SHA 1 fingerprint is fetched by running the following commands:

  • For Linux OS/ MAC :
    keytool -list -v -keystore ~/.android/debug.keystore -alias androiddebugkey -storepass android -keypass android
  • For Windows :
    
    keytool -list -v -keystore "%USERPROFILE%\.android\debug.keystore" -alias androiddebugkey -storepass android -keypass android
    

The SHA 1 fingerprint that we’ve added by running the above command on the terminal is shown in the image below along with the project package name. Your SHA 1 fingerprint key could be a different one.

android-maps-api-key

Adding android google map

Add the following dependency to build.gradle file.


compile 'com.google.android.gms:play-services:8.3.0'

Add the following tags under the application tag in AndroidManifest.xml.


<meta-data
            android:name="com.google.android.maps.v2.API_KEY"
            android:value="YOUR_GOOGLE_MAP_API_KEY" />

<meta-data
            android:name="com.google.android.gms.version"
            android:value="@integer/google_play_services_version" />

Add your own API key string in the android:value attribute of maps.v2.API_KEY by following the steps mentioned above.

Android Google Maps Project Structure

android google maps

Android Google Maps Example Code

Keeping this application simple we’ve just added a SupportMapFragment tag inside content_main.xml as shown below:


<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    app:layout_behavior="@string/appbar_scrolling_view_behavior"
    tools:context="com.journaldev.integratingmaps.MainActivity"
    tools:showIn="@layout/activity_main">

    <fragment
        android:id="@+id/map"
        android:name="com.google.android.gms.maps.SupportMapFragment"
        android:layout_width="match_parent"
        android:layout_gravity="center"
        android:layout_height="match_parent"
        />

</RelativeLayout>

Add the following permission to the AndroidManifest.xml file.


<uses-permission android:name="android.permission.INTERNET"/>

Build and run this application on the emulator. The following outputs would be shown:

android google map integration app error

Oops! Did we miss out something? No. This error occurs when the latest google play services version isn’t installed on the emulator. There are many workarounds to update to the latest versions like downloading and installing a play store apk using the command : adb install play_store_file.apk.

We recommend a simpler workaround. Just go to Settings->Apps->Google Play Services and use that version number in the build.gradle in place of :


compile 'com.google.android.gms:play-services:8.3.0'

The following output would be shown. A default world map.

android google map integration app

This brings an end to this tutorial. We’ll discuss and implement various features of google maps in later tutorials. Being a basic project with minimal differences from a default new project we’ve omitted the source code. Following are the major changes to be done to the default android studio project:

  • Create a new project and replace the content_main.xml with the snippet shown above.
  • Add the meta-data tags in the AndroidManifest.xml as shown above with the respective Google Map v2 API key.
  • Your first Google Map integrated application is ready!

Comments

  1. ranjith says:

    how to display map in fragment

    1. Anupam says:

      Maps are fragments themselves. Displaying a map fragment inside another fragment would mean nesting fragments. getChildFragmentManager() should be used in this case.

  2. Como Desenhar Manga says:

    Great tutorial man!

    Thank you very mch

  3. Nafees Ahmed says:

    Great tutorial man..

  4. khushbu says:

    Hi Anupam,

    Superb tutorial to generate api key also…
    Can u pls guide what should we write in this. android:value=”@integer/google_play_services_version”
    Basically how o find our google_play_services_version?

    1. Anupam says:

      Hi Khushbu,
      You don’t have to write anything in the google_play_services_version.
      After you’ve added the Google Play services library as a dependency in your build.gradle file. You just need to copy paste the meta data tag in your manifest. This is done to get a reference of the google play services library to our application. The @integer/google_play_services_version that you asked for is a kind of a reference that’s generated automatically when you build your project.

      Thanks

  5. vignesh says:

    Hello

    i have developed the application with the api key but the map is shown in the device..
    how to connect it….

  6. John says:

    I want to know how I can make that “Where To” tab like in the Uber app ? And I want it to create a route to the where to Address

  7. Deepshikha says:

    Hello,

    This is a nice tutorial that help us in google Map integration

    Thanks
    Deepshikha

    1. Anupam says:

      Glad to hear that Deepshikha. If you want me to cover any topics feel free to comment below!

Leave a Reply

Your email address will not be published. Required fields are marked *

close
Generic selectors
Exact matches only
Search in title
Search in content
Search in posts
Search in pages