Last Updated on 11 years by Hafizh Herdi
Pada bagian terakhir tentang implementasi check-in pada Location Based Service ini, kita akan belajar tentang bagaimana mengambil semua koordinat latitude dan longitude dari database SQLite dan menampilkan semuanya di Android Maps.
Oke, akhirnya kita sampai pada postingan terakhir soal implementasi Check-In pada aplikasi Location Based Services di Android. Kita sudah belajar tentang bagaimana caranya memasukkan data koordinat lokasi ke database SQLite dan menampilkan individual koordinat yang diambil dari database pada peta.
Pada tutorial yang terakhir ini kita akan belajar bagaimana caranya untuk menampilkan semua lokasi yang sudah kita masukkan ke dalam database pada peta. Yep, semua lokasi.
Pre Requisites
Seperti biasa, saya menyarankan kalian untuk membaca dan mempraktekkan semua tutorial tentang Android Maps yang ada di link ini. 😀
Warming Up
Database kita sekarang sudah penuh dengan data koordinat lokasi. Kita ingin memetakan semua lokasi tersebut pada peta. Bagaimana cara memunculkan semua lokasi itu? Bagaimana supaya setiap kali kita klik pada marker tersebut akan muncul dialog yang berbeda-beda?
Touch-down Code
Baiklah. Kalau kalian memperhatikan file layout yang ada di file CheckIn.java kalian akan mendapati tombol lihat semua lokasi yang memang sudah ada di sana, namun belum berfungsi. Kita akan mengintegrasikan tombol tersebut dengan suatu method. Dan seperti biasa kita akan menambahkan method OnClick pada kelas CheckIn dengan beberapa baris kode :
public void onClick(View v) { @SuppressWarnings("unchecked") ArrayAdapter<DBLokasi> adapter = (ArrayAdapter<DBLokasi>) getListAdapter(); DBLokasi lokasi = null; switch (v.getId()) { case R.id.checkinbt: lokasi = datasource.createLokasi(lat,lng); if(lokasi !=null&&adapter!=null) { adapter.add(lokasi); }else { Toast.makeText(this, "NULL", Toast.LENGTH_LONG).show(); } break; case R.id.showallinmap: ArrayList<DBLokasi> lokasi2 = datasource.getAllLokasi(); Bundle b = new Bundle(); Intent i = new Intent(this,TWMaps.class); b.putParcelableArrayList("daftar", lokasi2); i.putExtras(b); startActivity(i); } adapter.notifyDataSetChanged(); }
Yup, kode di atas berfungsi untuk mengambil semua data pada database menggunakan method getAllLokasi() pada kelas DataSource. Kemudian data itu akan dimasukkan ke dalam custom ArrayList<T. Dan nantinya ArrayList tersebut yang akan dilewatkan ke aktivitas TWMaps lewat Intent.
Di sinilah muncul sedikit tantangan bagi orang-orang yang berpikir 😀 Kita tidak semudah itu mem-passing objek ArrayList ke aktivitas lain melalui Intent. Kita harus terlebih dulu membuat sebuah Parcelable Object. Yang nantinya akan dimasukkan ke dalam Parcelable ArrayList. Hal tersebut dibahas lebih lanjut pada postingan saya tentang Parcelable Object.
Dan inilah kode lengkap file Checkin.java :
package id.attwhx.twmaps; import java.util.ArrayList; import java.util.List; import android.app.ListActivity; import android.content.Intent; import android.os.Bundle; import android.util.Log; import android.view.View; import android.view.View.OnClickListener; import android.widget.ArrayAdapter; import android.widget.Button; import android.widget.ListView; import android.widget.TextView; import android.widget.Toast; import com.google.android.maps.MapActivity; @SuppressWarnings("unused") public class Checkin extends ListActivity implements OnClickListener{ private TextView textView; private DBDataSource datasource; private View checkinbut; private Double lat,lng; private Button bt; ArrayList<DBLokasi> values; @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.checkin); checkinbut = findViewById(R.id.checkinbt); checkinbut.setOnClickListener(this); textView = (TextView) findViewById(R.id.textcheckin); Bundle b = this.getIntent().getExtras(); lat = b.getDouble("latitude"); lng = b.getDouble("longitude"); textView.setText("Ingin check-in di koordinat berikut ? "+lat+","+lng); // Instanstiasi kelas DataSource yang berfungsi sebagai controller atau DAO datasource = new DBDataSource(this); datasource.open(); // Ambil semua lokasi values = datasource.getAllLokasi(); // Tampilkan pada ListView ArrayAdapter<DBLokasi> adapter = new ArrayAdapter<DBLokasi>(this, android.R.layout.simple_list_item_1, values); setListAdapter(adapter); bt = (Button) findViewById(R.id.showallinmap); bt.setOnClickListener(this); } @Override protected void onListItemClick(ListView l, View v, int position, long id) { super.onListItemClick(l, v, position, id); String text = " Pindah ke lokasi " + values.get(position).getId(); DBLokasi lokasi = datasource.getLokasi(position+1); Toast.makeText(this, text, Toast.LENGTH_LONG).show(); Intent i = new Intent(this, TWMaps.class); Bundle b = new Bundle(); b.putDouble("longitude", Double.valueOf(lokasi.getLng())); b.putDouble("latitude", Double.valueOf(lokasi.getLat())); i.putExtras(b); startActivity(i); } // Masukkan lokasi baru ketika tombol check in di-klik public void onClick(View v) { @SuppressWarnings("unchecked") ArrayAdapter<DBLokasi> adapter = (ArrayAdapter<DBLokasi>) getListAdapter(); DBLokasi lokasi = null; switch (v.getId()) { case R.id.checkinbt: lokasi = datasource.createLokasi(lat,lng); if(lokasi !=null&&adapter!=null) { adapter.add(lokasi); }else { Toast.makeText(this, "NULL", Toast.LENGTH_LONG).show(); } break; case R.id.showallinmap: ArrayList<DBLokasi> lokasi2 = datasource.getAllLokasi(); Bundle b = new Bundle(); Intent i = new Intent(this,TWMaps.class); b.putParcelableArrayList("daftar", lokasi2); i.putExtras(b); startActivity(i); } adapter.notifyDataSetChanged(); } @Override protected void onResume() { datasource.open(); super.onResume(); } @Override protected void onPause() { datasource.close(); super.onPause(); } }
Show in Maps
Okay, kita sudah berhasil mempassingkan semua data lokasi ke aktivitas TWMaps, sekarang saatnya memunculkan semua lokasi itu pada peta. Kita akan tambahkan kode berikut ke kelas TWMaps.java :
List<Overlay> mapOverlays = map.getOverlays(); Drawable marker = this.getResources().getDrawable(R.drawable.marker); MapOverlay itemizedOverlay = new MapOverlay(marker, this); // mengambil ArrayList yang berisi data lokasi ArrayList<DBLokasi> daftarLokasi = b.getParcelableArrayList("daftar"); //iterasi untuk mengambil data lokasi individual dari ArrayList for(int i=0;i<daftarLokasi.size();i++) { Log.v("infoMAPS", "Marker ke "+i); DBLokasi a = daftarLokasi.get(i); lat = (int)(Double.valueOf(a.getLat())*1E6); lng = (int)(Double.valueOf(a.getLng())*1E6); GeoPoint point = new GeoPoint(lat,lng); OverlayItem overlayitem = new OverlayItem(point, "Info Lokasi", "Koordinat ke "+i+" ("+a.getLat()+","+a.getLng()+")"); itemizedOverlay.addOverlay(overlayitem); controller.setZoom(16); controller.animateTo(point); mapOverlays.add(itemizedOverlay); }
Pada kode di atas, kita pertama akan mengambil data ArrayList dari Bundle. Setelah itu ArrayList tersebut akan dirombak pada perulangan for(), untuk mendapatkan data lokasi secara individual. Dan data individual itulah yang nantinya akan ditampilkan pada peta.
Ini hasil akhir kelas TWMaps.java :
package id.attwhx.twmaps; import java.util.ArrayList; import java.util.List; import android.graphics.drawable.Drawable; import android.os.Bundle; import android.util.Log; 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.Overlay; import com.google.android.maps.OverlayItem; public class TWMaps extends MapActivity { private MapView map; private MapController controller; @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.mapdisplay); initMapView(); initMyLocation(); } /** Find and initialize the map view. */ private void initMapView() { map = (MapView) findViewById(R.id.map); controller = map.getController(); map.setSatellite(true); map.setBuiltInZoomControls(true); } /** Start tracking the position on the map. */ private void initMyLocation() { int lat, lng; Bundle b = this.getIntent().getExtras(); if(b.containsKey("longitude")) { lat = (int)(b.getDouble("latitude")*1E6); lng = (int)(b.getDouble("longitude")*1E6); Log.v("info", "The lat "+lat); Log.v("infoMAPS", "MASUK KE SATU"); Log.v("info", "The lng "+lng); GeoPoint point = new GeoPoint(lat,lng); List<Overlay> mapOverlays = map.getOverlays(); Drawable marker = this.getResources().getDrawable(R.drawable.marker); MapOverlay itemizedOverlay = new MapOverlay(marker, this); OverlayItem overlayitem = new OverlayItem(point, "Info Lokasi", "Koordinat ("+b.getDouble("latitude")+","+b.getDouble("longitude")+")"); itemizedOverlay.addOverlay(overlayitem); controller.setZoom(16); controller.animateTo(point); mapOverlays.add(itemizedOverlay); }else { Log.v("infoMAPS", "MASUK KE DUA"); List<Overlay> mapOverlays = map.getOverlays(); Drawable marker = this.getResources().getDrawable(R.drawable.marker); MapOverlay itemizedOverlay = new MapOverlay(marker, this); ArrayList<DBLokasi> daftarLokasi = b.getParcelableArrayList("daftar"); for(int i=0;i<daftarLokasi.size();i++) { Log.v("infoMAPS", "Marker ke "+i); DBLokasi a = daftarLokasi.get(i); lat = (int)(Double.valueOf(a.getLat())*1E6); lng = (int)(Double.valueOf(a.getLng())*1E6); GeoPoint point = new GeoPoint(lat,lng); OverlayItem overlayitem = new OverlayItem(point, "Info Lokasi", "Koordinat ke "+i+" ("+a.getLat()+","+a.getLng()+")"); itemizedOverlay.addOverlay(overlayitem); controller.setZoom(16); controller.animateTo(point); mapOverlays.add(itemizedOverlay); } } } @Override protected boolean isRouteDisplayed() { // Required by MapActivity return false; } }
Pretty much, itulah hal – hal yang harus kalian lakukan untuk bisa menampilkan semua lokasi. Nanti, hasilnya akan seperti ini, ketika kalian memilih opsi lihat semua lokasi :

View All Location TWMaps
Dan ketika kita mengklik salah satu marker, inilah yang muncul 🙂

Dialog yang muncul ketika marker di klik
Enjoy that !
Kalian bisa mendownload source code lengkapnya di GitHub saya. 🙂
Don’t forget to leave comment 😉
Dear Mas Herdi, saya sudah mencoba aplikasi yang dibuat tetapi untuk dalam tombol check-in. Saya sudah menitikkan 2 lokasi mas, tetapi kok yang tampil tidak 2 ya mas malah 1 lokasi
Biasanya memang gitu, kalau lokasinya berdekatan… Coba pindah ke lokasi yang minimal 50m dari lokasi awal, trus check-in 🙂
Dear mas Herdi, gmn klo mappingnya bisa diklik kayak http://www.projectnoah.org/map ketika masuk map.. Bisa minta emailnya kak herdi apa gak?? mau tanya banyak kak,.
Belum bisa sy lihat web-nya, kayaknya koneksi lagi lambat. Emang di klik kayak gimana?
Email bisa dikirim di
http://twoh.web.id/2012/10/kirim-surat/
🙂
Selamat siang kak herdi, jika ingin yang disimpan selain nilai longitude dan latitude tetapi yang disimpan yaitu lokasi,namajalan,propinsi atau kota, latitude, dan longitude. itu bagaimana cara mengambilnya dari googlemapnya kak,.
mohon pencerahannya kak.
Kalau mengambil alamat, bisa pakai GeoCoder, atau pakai cara di bawah ini :
Petunjuk lengkapnya bisa dibaca di situs
Developer Android
Salam 🙂
kak herdi kasih tutorial mengenai geocode untuk mendapatkan nilai lot,lang,addres,prov,kota,.
mohon pencerahannya
mas herdi mau tanya kl pas mau klik check in kita langsung masuk ke form baru yg berisi field long.lat,dan nama tempatnya ato yang bakal kta simpen di databsenya long,lat,dan nama tempatnya tapi itu harus diisi melalui field form yang udh disediaain gimana cara panggil long,dan lat ke field form yang sudah disedian..tks
Bisa dipassing pakai Bundle yang diikutsertakan sebagai extras di Intent
mas, kalo nampilin jarak my location ke daerah tujuan gimana? ada gak cara untuk menentukan rute terpendek?.. 🙂
Ini saya baru saja buat 🙂 http://www.twoh.web.id/2013/09/menampilkan-rute-tercepat-driving-direction-di-antara-dua-koordinat-pada-android-maps-v2/
Terima Kasih Banyak. artikelnya sangat membantu saya untuk proses pembuatan aplikasi pariwisata sistem informasi Geografis berbasis Android.
Sedikit saya bertanya Mas. kalau misalnya aplikasi ini dihubungkan dengan web service yang terkoneksi dengan MySQL, apakah bisa Mas. Mohon bantuannya. Terima Kasih.
Sama-sama 🙂
Bisa saja mas, nanti perlu pakai JSon dan belajar http request POST dan Get 🙂
Mas nanya kalau latitude dan longitude yang di simpan dalam di database SQLite itu satu wilayah/kabupaten bisa nggak di buat nentuin lokasi pengguna? apa harus tiap daerah latitude dan longitude nya juga di simpan ke database gitu,
Mungkin bukan tiap daerah, lebih ke tempat2 yang sering dikunjungi. Soalnya LBS biasanya untuk tempat2 tertentu kayak Pom Bensin, rumah sakit, puskesmas dan sebagainya.
Terus kalau untuk menentukan lokasi caranya gimana mas? berarti yang di simpan di dtatabase cuma tempat2 yang di tuju aja ya?
Menentukan lokasi gimana gan? Kalo menentukan lokasi kita bisa pakai GPS di Android
Iya menentukan lokasi pengguna mas? tapi kalau latitude dan longitude yang di simpan di dalam database SQLite hanya tempat yang sering di kunjungi, bisa gak untuk menentukan lokasi pengguna sebelum menuju ke tampat tujuan?? ini saya buat hanya satu kota…
Maksudmu gini bukan, pertama-tama nentuin lokasi pengguna, kemudian nentuin lokasi tempat yang dituju? Bisa kalo itu. Nentuin lokasi pengguna-nya pake GPS yang ada di Android.
Mas Herdi ini kalau dibuat offline caranya gimana mas? mohon pencerahanya.
Silahkan 🙂
http://www.twoh.web.id/2012/10/menampilkan-peta-di-android-tanpa-menggunakan-google-maps/
Iya mas? ada tutornya gak?
Lha, ini kan tutorial buat itu 😀
http://www.twoh.web.id/2012/09/implementasi-check-in-pada-android-location-based-service-i/
Oiya mas kalau dengan cara yang mas herdi contohkan diatas bisa gak di buat offline. maaf mas banyak tanya…
Ndak bisa bro, harus online 🙂
Mas herdi saya menyambung pertanyaan dari mas randi. Kalau yang di buat offline itu petanya, bisa gak.
🙂
http://www.twoh.web.id/2012/10/menampilkan-peta-di-android-tanpa-menggunakan-google-maps/
mas herdi mau tanya, bisa ga kita buat suatu form isinya ada image view, lat dan long
kondisi:kita memfoto trus foto tampil di from kemudian secara otomatis lat dan long terisi sendiri trus penyimpananya di mysql,bisa ga ya mas?
mohon bantuanya
Bisa saja, kalo tidak salah saya pernah baca tentang cara mengekstrak lat/long dari sebuah foto/gambar 🙂
gimana caranya mas ada ga tutorial androidnya
soalnya aku lg buat project kaya gitu ga nemu nemu tutornya
kalo mas berkenan bisa hubungi G talk saya
alamat : azaranggan@gmail.com
trimakasih sebelumunya mas 🙂
mas kalau simpen 1 koordinat gps terus ambil lagi koordinat gps untuk cari koordinat gps yang udah disimpen tadi & hitung jarak dari posisi kedua ke posisi pertama,itu gmn caranya?mohon bantuannya
Ini untuk menampilkan rute antara dua koordinat 🙂
http://www.twoh.web.id/2013/09/menampilkan-rute-tercepat-driving-direction-di-antara-dua-koordinat-pada-android-maps-v2/
mas kalo mau menampilkan lokasi yang terdekat dengan user bgai mana ya ?
terima kasih
Ada dua cara, bisa menggunakan radius atau mapbounds
mas ada tutorial menggunakan radius dan markernya mengambil koordinat dari mysql gak?