Implementasi Check-In pada Location Based Service di Android (END)

Last Updated on 12 years by Mas 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 😉