devxlogo

Using Google Maps in Android

Using Google Maps in Android

n this previous article, you learned about the Eclipse development IDE and how to create a simple Android application and debug it on the Android emulator. Continuing with our exploration of Android, this article will show you how to incorporate Google Maps in your Android application.

In Android, Google Maps is now a first-class citizen. Your applications can easily integrate mapping functions. For this article, you will learn:

  • How to display Google Maps in your application
  • How to animate to a particular location
  • How to display different views for Google Maps
  • How to zoom in and out of Google Maps

Creating the Android Project
First, fire up Eclipse and create a new Android project. Call it GoogleMaps.

To display a Google Maps application in your Android application, you need to configure the required permission in your application. The permissions required are:

  • android.permission.ACCESS_COARSE_LOCATION or android.permission.ACCESS_FINE_LOCATION
  • android.permission.INTERNET

To configure your application with these permissions, you need to modify the AndroidManifest.xml file. Double-clicking on this file will display it as shown in Figure 1.


Figure 1. Configuring the File: Editing the AndroidManifest.xml file.
 
Figure 2. Adding Permissions: Click on the Permission tab, select the Uses Permission item, and click OK.

There are two ways to modify the AndroidManifest.xml file: use the tools available in the editor, or manually edit the XML file by clicking on the AndroidManifest.xml tab located at the bottom of Figure 1. If you are not familiar with the layout of the XML file, I suggest you use the editor tools available (which I am going to show shortly). If you are a seasoned Android developer, editing the XML directly is much faster.

Figure 3. Selecting Permissions: Select the various permissions you need from a drop-down list.

To add a permission to the AndroidManifest.xml file, click on the Permission tab, select the Uses Permission item, and click OK (see Figure 2).

You will now be able to select the various permissions you need from a drop-down list (see Figure 3).

Once a permission is selected, press Ctrl-S to save the AndroidManifest.xml file. Ensure that you add the permission for ACCESS_COARSE_LOCATION (or ACCESS_FINE_LOCATION) and INTERNET.

If you examine the XML file now, you will notice the two new elements added: (see Listing 1).

Observe that the location of the element is within the element and outside the element.

To use the Google Maps in your application, you need to add one more element to your AndroidManifest.xml file. Add the element as shown in Listing 2.

Modifying the UI
You can now modify the UI to display the map. In main.xml, replace the element with the element, like this:

     

Take note that in this version of the Android SDK (0.9 beta), you need not supply a valid Map API key for the maps (as represented in the apiKey attribute). In the final release, you would need to apply for a free Map API key and specify the key in the apiKey attribute before you can use the the maps in your application.

Finally, in the GoogleMaps.java file, modify the GoogleMaps class to extend the MapActivity base class:

Figure 4. The Emulator: Press F11 in Eclipse and you should be able to see the map displayed in the emulator.

package net.learn2develop.GoogleMaps;import com.google.android.maps.MapActivity;import android.os.Bundle;public class GoogleMaps extends MapActivity  {    /** Called when the activity is first created. */    @Override    public void onCreate(Bundle savedInstanceState) {        super.onCreate(savedInstanceState);        setContentView(R.layout.main);    }    @Override    protected boolean isRouteDisplayed() {        // TODO Auto-generated method stub        return false;    }}

Note that the MapActivity base class requires you to implement the isRouteDisplayed() method.

You are now ready to debug the application on the Android emulator. Press F11 in Eclipse and you should be able to see the map displayed in the emulator (see Figure 4).

Author’s Note: Remember to ensure that you have Internet access on the computer hosting the emulator.

You can now pan the map using the mouse (just click and drag).

Animating to a Specific Location
Now that you are able to display the map in your Android application, you want to be able to manipulate it programmatically.

To do this, you need two classes: MapView and MapController. The MapView class represents a Google map while the MapController class is an utility class to manage panning and zooming of the map.

Modify the GoogleMaps.java file as shown in Listing 3.

In Listing 3, you first obtain a reference to the map using the findViewById() method. After a reference to the map is obtained, you get the controller for the map and assign it to a MapController object (mc in Listing 3).

You use a GeoPoint object to represent a geographical location. This class stores the latitude and longitude values for a location in micro degrees as integer values. In other words, you would need to multiply a latitude value such as 40.744448 by 1e6 to obtain an integer value of 40747778.

To navigate the map to a particular location, you can use the animateTo() method of the MapController class. The setZoom() method allows you to specify the zoom level at which the map is displayed.

Press F11 to debug the application again. This time, you will see the map as shown in Figure 5.


Figure 5. Navigation: Displaying the map at the zoom level of 17.
 
Figure 6. Switching Views: Displaying the map in satellite view.

You can switch the map to satellite view by using the setSatellite() method:

        mc.animateTo(p);        mc.setZoom(17);         mapView.setSatellite(true);        mapView.invalidate();        

Figure 6 shows the map in satellite view.

You can also overlay the map with street names by using the setStreetView() method:

        mapView.setSatellite(true);        mapView.setStreetView(true);

Figure 7 shows the map in satellite view overlaid with street names.


Figure 7. Street Names: Displaying the map in satellite view overlaid with street names.
 
Figure 8. Zooming: Zoom in and out to view the details.

Zooming in and out of the Map
The map would only be useful if you can zoom in and out to view the details. To do so, handle the onKeyDown event so that when the user presses a button, you can zoom in or out of the map. Modify the GoogleMaps.java file as shown in Listing 4.

When the user presses the numeric 3 on the keypad, the map view zooms in (see Figure 8). You achieve this using the zoomIn() method of the MapController class. Likewise, when the user presses the numeric 1, the map view zooms out using the zoomOut() method.

More to Come
In this article, you have seen how to display a Google map in your Android application, but this barely scratches the surface. In a future article, you’ll learn how to combine the use of Google maps with a GPS receiver to display the location of a user real-time.

devxblackblue

About Our Editorial Process

At DevX, we’re dedicated to tech entrepreneurship. Our team closely follows industry shifts, new products, AI breakthroughs, technology trends, and funding announcements. Articles undergo thorough editing to ensure accuracy and clarity, reflecting DevX’s style and supporting entrepreneurs in the tech sphere.

See our full editorial policy.

About Our Journalist