Android MapView and MapActivity

12,719 views
12,603 views

Published on

Published in: Education, Technology
1 Comment
3 Likes
Statistics
Notes
No Downloads
Views
Total views
12,719
On SlideShare
0
From Embeds
0
Number of Embeds
3
Actions
Shares
0
Downloads
320
Comments
1
Likes
3
Embeds 0
No embeds

No notes for slide

Android MapView and MapActivity

  1. 1. Android Application Development<br />Google Map View<br />Ahsanul Karim<br />ahsanul.karim@sentinelbd.com<br />Sentinel Solutions Ltd.<br />http://www.sentinelbd.com<br />
  2. 2. Google Map View<br />Using the Google Maps library, we can create our own map-viewing Activity<br />Our simple map application will have 2 parts:<br />We show a map where user can move and zoom<br />We’ll add overlay items to show points of interest<br />Prerequisites:<br />External Google Maps library installed in your SDK environment. <br />The Maps library is included with the Google APIs add-on, <br />which you can install using the Android SDK and AVD Manager.<br />Map API KEY<br />Set up a new AVD that uses the same Google APIs deployment <br />target<br />
  3. 3. Google Map View<br />Advantages of using MapView and MapActivity<br />Integrate Google maps in application easily<br />It provides built-in map downloading, rendering, and caching of Maps tiles<br />Provides variety of display options and controls<br />provides a wrapper around the Google Maps API that lets your application request and manipulate Google Maps data through class methods, and it lets you work with Maps data as you would other types of Views.<br />
  4. 4. Google Map View<br />Part 1: Creating a Map Activity<br />Create a project HelloGoogleMaps<br />Using Google APIs<br />Using Google APIs the default.propertiesfile:<br />
  5. 5. Google Map View<br />Part 1: Creating a Map Activity (Contd.)<br />2. Because the Maps library is not a part of the standard Android library, we must declare it in the Android Manifest. Open the AndroidManifest.xml file and add the following<br /> as a child of the <application> element<br />3. Add INTERNET permission too<br />
  6. 6. Google Map View<br />Part 1: Creating a Map Activity (Contd.)<br />4. Open the res/layout/main.xml file and add a single com.google.android.maps.MapView as the root node:<br />Now we’ll have to obtain the Maps API key<br />5. Now open the HelloGoogleMaps.java file. For this Activity, extend MapActivity <br />(instead of Activity)<br />6. Inside every MapActivity, the isRouteDisplayed() method is required, so we override <br />This method<br />So HelloGoogleMaps.java looks like:<br />
  7. 7. Google Map View<br />Part 1: Creating a Map Activity (Contd.)<br />HelloGoogleMaps.java<br />isRouteDisplayed() is required for some accounting from the Maps service to see if we are <br />currently displaying any route information. In this case, we are not, so return false.<br />
  8. 8. Google Map View<br />Part 1: Creating a Map Activity (Contd.)<br />6. This loads the layout file created above. We add built in zoom option with <br />setBuiltInZoomControls(boolean). Do this at the end of the onCreate() method:<br />
  9. 9. Google Map View<br />Part 1: Creating a Map Activity (Contd.)<br />7. Now we create AVD using Google APIs and run<br />The Map won’t display without the proper MAP API KEY<br />
  10. 10. Google Map View<br />Obtaining a Maps API Key<br />MapView gives access to Google Maps data, so need to register with the Google Maps service <br />and agree to the applicable Terms of Service before your MapView will be able to obtain data <br />from Google Maps. This will apply whether you are developing your application on the <br />emulator or preparing your application for deployment to mobile devices.<br />Registering for a Maps API Key is simple, free, and has two parts:<br />Registering the MD5 fingerprint of the certificate that you will use to sign your application. <br />The Maps registration service then provides you a Maps API Key that is associated with <br />your application's signer certificate.<br />Adding a reference to the Maps API Key in each MapView, whether declared in XML or <br />instantiated directly from code. You can use the same Maps API Key for any MapView in <br />any Android application, provided that the application is signed with the certificate <br />whose fingerprint you registered with the service.<br />We’ll use debug certificate here<br />
  11. 11. Google Map View<br />Obtaining a Maps API Key (Contd.)<br />1. MD5 fingerprint of the debug certificate<br />By default, build tools create the debug keystore in the active AVD directory.<br />The location of the AVD directories varies by platform:<br />Windows Vista: C:Users<user>.androiddebug.keystore<br />Windows XP: C:Documents and Settings<user>.androiddebug.keystore<br /> We can Windows > Prefs > Android > Build to check the full path, which you can then paste <br /> into a file explorer to locate the directory containing the keystore.<br />
  12. 12. Google Map View<br />Obtaining a Maps API Key (Contd.)<br />1. MD5 fingerprint of the debug certificate (Contd.)<br />3. Once you have located the keystore, use this Keytool command to get the MD5 fingerprint <br />of the debug certificate:<br />Open command prompt and go to JAVA_Path/bin/ folder. This folder contains keytools<br />We write the command:<br />keytool -list -alias androiddebugkey -keystore<path_to_debug_keystore>.keystore<br />-storepass android -keypass android<br />
  13. 13. Google Map View<br />Obtaining a Maps API Key (Contd.)<br />1. MD5 fingerprint of the debug certificate (Contd.)<br />keytool -list -alias androiddebugkey -keystore<path_to_debug_keystore>.keystore<br />-storepass android -keypass android<br />Using the command we get MD5 finger print<br />MD5 fingerprint: 5D:4E:16:49:FD:8C:D3:BD:F4:31:BA:A7:B5:5C:2C:DC<br />
  14. 14. Google Map View<br />Obtaining a Maps API Key (Contd.)<br />1. Registering the Certificate Fingerprint with the Google Maps Service<br />For a Maps API Key, load this page in a browser:<br />http://code.google. com/android/maps-api-signup.html<br />We get the screen:<br />
  15. 15. Google Map View<br />Obtaining a Maps API Key (Contd.)<br />1. Registering the Certificate Fingerprint with the Google Maps Service<br />Now we get<br />Now, we place the api key in main.xml and run the app again<br />
  16. 16. Google Map View<br />Part 1: Creating a Map Activity (Contd.)<br />
  17. 17. Google Map View<br />Part 2: Adding Overlay Items<br />Now we’ll position overlay items and markers<br />Create a new Java class named HelloItemizedOverlay that implements ItemizedOverlay.<br />When using Eclipse, right-click the package name in the Eclipse Package Explorer, and select <br />New > Class. Fill-in the Name field as HelloItemizedOverlay.<br />2. First, you need an OverlayItem ArrayList, in which you'll put each of the OverlayItem <br />objects you want on the map. Add this at the top of the HelloItemizedOverlay class<br />3. Now define the HelloItemizedOverlay constructors. The constructor must define the <br />default marker for each of the OverlayItems. In order for the Drawable to actually get drawn, <br />it must have its bounds defined. Most commonly, you want the center-point at the bottom <br />of the image to be the point at which it's attached to the map coordinates. <br />This is handled for you with the boundCenterBottom() method. Wrap this around our <br />defaultMarker<br />
  18. 18. Google Map View<br />Part 2: Adding Overlay Items<br />
  19. 19. Google Map View<br />Part 2: Adding Overlay Items<br />Now we’ll position overlay items and markers<br />4. In order to add new OverlayItems to the ArrayList, you need a new method:<br />Each time you add a new OverlayItem to the ArrayList, you must call populate() for the <br />ItemizedOverlay, which will read each of the OverlayItems and prepare them to be drawn.<br />When the populate() method executes, it will call createItem(int) in the ItemizedOverlay <br />to retrieve each OverlayItem.<br />5. Then override the onTap(int) callback method, which will handle the event when an item <br />is tapped by the user:<br />
  20. 20. Google Map View<br />Part 2: Adding Overlay Items<br />Now we use HelloItemizedOverlay<br />1. At the end of your existing onCreate() method, instantiate :<br />All overlay elements on a map are held by the MapView, so when you want to add some, <br />have to get a list from the getOverlays() method. Then instantiate the Drawable used for the <br />map marker, which was saved in the res/drawable/ directory. <br />2. Now create a GeoPoint that defines the map coordinates for the first overlay item, <br />and pass it to a new OverlayItem:<br />GeoPoint coordinates are specified in microdegrees (degrees * 1e6). <br />The OverlayItem constructor accepts the GeoPoint location, a string for the item's title, and <br />a string for the item's snippet text,<br />3. All that's left is to add this OverlayItem to your collection in the HelloItemizedOverlay <br />instance, then add the HelloItemizedOverlay to the MapView<br />
  21. 21. Google Map View<br />Part 2: Adding Overlay Items<br />We can add more geopoints here<br />We can take these points from location listeners<br />
  22. 22. Google Map View<br />

×