Menampilkan Maps Menggunakan Android Maps

Last Updated on 13 years by Mas Herdi

Tutorial ini menggunakan library Android Maps API v1 yang sudah obsolete/tidak update, untuk mendapatkan tutorial yang update kalian bisa mengunjungi link Tutorial Menampilkan Maps Menggunakan Android Maps API v2 dan MapFragment.

Kali ini saya akan membahas bagaimana cara menampilkan Google Maps pada aplikasi Android buatanmu, sebenarnya ada dua cara, yang pertama memakai AndroidMapsAPI (atau MapView) dan yang kedua memakai WebView.

Yang akan dibahas di post ini adalah cara menampilkan peta menggunakan MapView. Cara yang pertama, memakai MapView lebih disarankan karena kita tidak perlu repot-repot dua kali coding ketika ingin membuatnya, namun kekurangannya MapView bukanlah paket yang otomatis ter-include di dalam Android SDK, sehingga kamu harus mendownload package tambahan bernama GoogleAPIs, seperti yang terlihat pada gambar di bawah ini :

Jadi, langkah pertama kamu harus mempunyai GoogleAPIs SDK terlebih dahulu! Setelah itu, untuk bisa menampilkan maps memakai MapView kamu harus mempunyai MapsAPIKey yang bisa didownload di site Android Maps API.

Langkah-langkah Mendapatkan Maps API Key (Environment Windows, yang lain bisa menyesuaikan ^^)

  1. Pertama-tama, kamu harus mendapatkan Android certificate MD5 fingerprint dari debug keystore yang biasanya terdapat di “C:\Users<your name>.androiddebug.keystore”
  2. Buka command prompt
  3. Ketikkan
    keytool -list -keystore "C:\Users<your name>.androiddebug.keystore".
    Ketika diminta untuk memasukkan password, kamu bisa mengosongkan saja atau tuliskan “android” sebagai password.
    Note: Apabila kamu menggunakan JDK 1.7, command yang harus diketik adalah
    keytool -v -list -keystore "C:\Users<your name>.androiddebug.keystore".
    Kemudian pilih yang MD5 Hash certificate, karena jika tidak, maka certificate fingerprint yang dicetak akan berformat SHA1, sedangkan yang dibutuhkan adalah MD5.
  4. Copy paste MD5 fingerprint yang telah di-generate
  5. Kemudian Sign-up untuk MapsAPIKey, dan pastekan fingerprint tersebut di sini.
  6. Dan, kamu pun memperoleh MapsAPIKey !

Next Step

Setelah memperoleh Maps API Key, sekarang kita akan membuat aplikasi contoh. Buka Eclipse dan buat Android Virtual Device baru yang mempunyai fitur Google APIs. Setelah itu create new Android Application, dan pastikan memakai AVD yang mempunyai fitur Google APIs.
Kemudian pada kelas main activity (misal TestMapActivity.java), pastekan kode berikut ini:

import android.app.Activity;
import android.graphics.Point;
import android.os.Bundle;

import com.google.android.maps.GeoPoint;
import com.google.android.maps.MapActivity;
import com.google.android.maps.MapController;
import com.google.android.maps.MapView;
import com.google.android.maps.MyLocationOverlay;

@SuppressWarnings("unused")
public class TestMapActivity extends MapActivity {
    /** Called when the activity is first created. */
	private MapView map;
	private MapController controller;
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);
        initMapView();
        initMyLocation();
    }

	@Override
	protected boolean isRouteDisplayed() {
		// TODO Auto-generated method stub
		return false;
	}

	private void initMapView()
	{
		map = (MapView)findViewById(R.id.map );
		controller = map.getController();
		map.setSatellite(true);
		map.setBuiltInZoomControls(true);
	}

	private void initMyLocation()
	{
		final GeoPoint point = new GeoPoint(6,-108);
		final MyLocationOverlay overlay = new MyLocationOverlay(this, map);
		overlay.enableMyLocation();

		overlay.runOnFirstFix(new Runnable()
		{
			public void run()
			{
				controller.setZoom(8);
				controller.animateTo(point);
				controller.setCenter(point);
			}
		}
		);
		map.getOverlays().add(overlay);
	}

Pada kode di atas, ada beberapa hal yang perlu diperhatikan :

  • Pada saat activity pertama kali dibuat atau onCreate(), akan memanggil method initMapView() dan initMyLocation()
  • Method initMapView() berfungsi untuk inisialisasi peta, berisi :
    map = (MapView)findViewById(R.id.map );
    //untuk mengambil MapView dan menampilkan
    map.setSatellite(true);
    //untuk mengeset default view ke satellite mode
    map.setBuiltInZoomControls(true);
    //secara default menampilkan Zoom Controls</pre>
    
  • Kemudian method initMyLocation() berfungsi untuk inisialisasi lokasi peta saat pertama kali dibuka, berisi
final GeoPoint point = new GeoPoint(6,-108);
//berfungsi untuk mengeset koordinat awal pada titik 6,-108 (latitude, logitude)
controller.setZoom(8);
//berfungsi untuk mengeset zoom level maps ke level 8
controller.animateTo(point);
//untuk memindahkan lokasi awal peta ke koordinat "point"
controller.setCenter(point);
//untuk mengeset "point" sebagai koordinat awal peta

Layout

Pada Android main.xml isikan kode berikut, berfungsi sebagai layout yang akan menampilkan MapView:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/frame"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >

	<com.google.android.maps.MapView
	    android:id="@+id/map"
	    android:apiKey="YourMapsAPIKey"
	    android:layout_width="fill_parent"
	    android:layout_height="fill_parent"
	    android:clickable="true"/>

</LinearLayout>

Pada bagian

android:apiKey="YourMapsAPIKey"

, gantilah YourMapsAPIKey dengan Maps API KEY yang telah kamu peroleh tadi!

The Permission

MapView tentu saja membutuhkan koneksi internet untuk bisa mengakses peta dari Google Maps dan juga aplikasi akan membutuhkan akses untuk COARSE_LOCATION (deteksi lokasi berdasarkan GSM provider) atau FINE_LOCATION (deteksi lokasi berdasarkan GPS satelit), karena itu tambahkan permission berikut pada Android Manifest. Buka AndroidManifest.xml dan isikan kode berikut di baris sebelum
 <application> tag:

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

Sekarang, cobalah jalankan aplikasimu !

PS: MapView hanya bisa terhubung ke jaringan yang sama sekali tidak diproteksi apapun, apabila koneksi internetmu menggunakan proxy, maka MapView tidak akan bisa menampilkan peta, dan akan ada error “Couldn’t get connection factory client” Kekurangan ini dilaporkan sebagai bug.

UPDATE : Maaf karena ada yang kurang dari tutorial ini, jangan lupa untuk menambahkan kode

<uses-library android:name="com.google.android.maps" />

pada AndroidManifest.xml di dalam Activity tag. Good luck!





Download aplikasi kami di Google Play Store


Tutorial Menarik Lainnya :

20 Comments
  1. Kanya June 15, 2012
    • Herdi Naufal June 15, 2012
  2. ichsan June 17, 2012
    • Herdi Naufal June 18, 2012
  3. Arif October 21, 2012
    • Herdi Naufal October 21, 2012
  4. WMW.Jaya October 26, 2012
    • Levi November 5, 2012
      • twoh December 14, 2012
    • twoh December 14, 2012
  5. seza January 29, 2013
    • Herdi Naufal January 29, 2013
  6. RF February 14, 2013
  7. viktor August 2, 2013
  8. ayik March 5, 2014
  9. Yefta Andrea March 16, 2014
  10. nanda May 2, 2014
  11. hendi May 25, 2014
  12. Roymond June 13, 2014

Leave a Reply

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

TWOH&Co.