Mapping with Google APIs in Android

Mapping functionality has become a must-have feature for new mobile devices. With all the new technology advances, mobile devices, especially cell phones, are more than capable of handling complicated mathematical calculations on their own or keeping up with the high-traffic communication with the servers. GPS devices used to be the dominant player with the mapping capabilities, but more and more mobile devices are offering almost full-featured GPS functionalities. Google's Android provides direct access to its popular mapping tools. You will explore key programming APIs that power its mapping features.

What Google APIs Are Available for Mapping?

Before you start, all the necessary development tools, plug-ins, and sample code you need are from Google's own Android site at http://code.google.com/android/. It also provides simple-to-follow instructions to get you started. I recommend you do that first if you have not done so already.

The majority of the mapping APIs are within the package com.google.android.maps. At a minimum, two of them are required to embed the mapping tools inside your software: MapActivity and MapView. MapActivity manages the activity life cycle and services behind a MapView. MapView is an Android View that displays a map. Other than these APIs, you also have MapController to perform panning and zooming a map. MyLocationOverlay and Overlay are used to draw the user's info or objects on top of the map.

Discussing mapping without mentioning GPS is nearly impossible now because GPS has become one of the indispensable features most people would want from their mobile devices. The package android.location is included for GPS support. LocationManager is the most important API; it provides access to the system location services. The mapping and GPS APIs are the essential elements for building location-based services (LBS). You will pretty much cover all these APIs in a working example later.

Constructing a MapView by a MapActivity

You can construct a MapView only by a MapActivity because it depends on background threads that access the network and filesystem managed by MapActivity. That is to say, you should always start by extending your class from MapActivity as follows:

public class TutorialOnMaps extends MapActivity {
   private static MapView mMapView;

   /** Called when the activity is first created. */
   @Override
   public void onCreate(Bundle icicle) {
      super.onCreate(icicle);

      requestWindowFeature(Window.FEATURE_NO_TITLE);
      setContentView(R.layout.main);

      // Get the map view from resource file
      mMapView = (MapView)findViewById(R.id.mv);
      }
   }

While in the default resource file main.xml, you add in some on-screen buttons with transparent panels. To properly "inflate" the MapView, you use a well-known solution among Android developers to declare a MapView. Figure 1 shows the initial screen on the emulator with your on-screen buttons.

<?xml version="1.0" encoding="utf-8"?>

<FrameLayout xmlns:android=
   "http://schemas.android.com/apk/res/android"
   android:layout_width="fill_parent"
   android:layout_height="fill_parent"
   >

<view id="@+id/mv"
   class="com.google.android.maps.MapView"
   android:layout_width="fill_parent"
   android:layout_height="fill_parent"
   android:layout_weight="1" />

<LinearLayout xmlns:android=
   "http://schemas.android.com/apk/res/android"
   android:orientation="horizontal"
   android:layout_width="fill_parent"
   android:layout_height="wrap_content"
   android:background="#550000ff"
   android:padding="2px"
   >
<Button id="@+id/sat"
   android:layout_width="wrap_content"
   android:layout_height="wrap_content"
   android:layout_marginLeft="40px"
   android:text="Satellite" />
(...snipped)
</LinearLayout>

<LinearLayout xmlns:android=
   "http://schemas.android.com/apk/res/android"
   android:orientation="vertical"
   android:layout_width="wrap_content"
   android:layout_height="fill_parent"
   android:background="#550000ff"
   android:padding="2px"
   >
<Button id="@+id/zin"
   android:layout_width="wrap_content"
   android:layout_height="wrap_content"
   android:layout_marginTop="30px"
   android:text="+" />
(...snipped)
</LinearLayout>

</FrameLayout>