Belajar Android Action Bar Studi Kasus Aplikasi Jadwal Pelajaran

Android Action Bar adalah Salah satu navigasi andalan yang dipakai oleh para developer adalah pemanfaatan action bar. Sebetulnya apa sih action bar itu kalau dari kata-katanya sih aratinya bar yang digunakan untuk mentrigger suatu aksi. Nah barnya ini bisa seperti menu bar, tool bar, sliding bar (navigation drawer), tab bar,  apa lagi yah, coba cari di devleoper.android.com dan androidhive.info

Untuk lebih jelasnya ini ada gambar bisa dilihat di http://androidhive.info

Pada kesempatan kali ini kita akan coba gunakan action bar sebagai action buttons dan overflow menu untuk membuat aplikasi jadwal pelajaran
Bagusnya sih kalau buat aplikasi kita buat dulu design user interfacenya. Kalau untu kebutuhan ini berarti di action barnya ada menu untuk menampilkan jadwal (Senin, Selasa, Rabu, Kamis, Jumat, Semua).

Setelah klik Next samapi Finish maka project baru akan tergenerate.

2. Sekarang kita siapkan menu untuk aplikasi ini, masuk directory res/menu lalu edit main.xml

<menu xmlns:android="http://schemas.android.com/apk/res/android" >

    <item
        android:id="@+id/action_senin"
        android:orderInCategory="100"
        android:showAsAction="never"
        android:title="Senin"/>
    <item
        android:id="@+id/action_selasa"
        android:orderInCategory="100"
        android:showAsAction="never"
        android:title="Selasa"/>
    <item
        android:id="@+id/action_rabu"
        android:orderInCategory="100"
        android:showAsAction="never"
        android:title="Rabu"/>
    <item
        android:id="@+id/action_kamis"
        android:orderInCategory="100"
        android:showAsAction="never"
        android:title="Kamis"/>
    <item
        android:id="@+id/action_jumat"
        android:orderInCategory="100"
        android:showAsAction="never"
        android:title="Jumat"/>

</menu>

3. Sekarang kita urus layout user interfacenya, edit file res/layout activity_main.xml

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:paddingBottom="@dimen/activity_vertical_margin"
    android:paddingLeft="@dimen/activity_horizontal_margin"
    android:paddingRight="@dimen/activity_horizontal_margin"
    android:paddingTop="@dimen/activity_vertical_margin"
    tools:context=".MainActivity" >

    <TextView
        android:id="@+id/textViewHari"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_alignParentTop="true"
        android:text=""
        android:textAppearance="?android:attr/textAppearanceMedium" />

    <ListView
        android:id="@+id/listViewJadwal"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignLeft="@+id/textViewHari"
        android:layout_below="@+id/textViewHari" >
    </ListView>

</RelativeLayout>

4. Untuk layout baris pada list view pada directory res/layout buat file layout baru dengan nama row_jadwal.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

    <TextView
        android:id="@+id/textViewRowJam"
        android:layout_width="75dp"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_alignParentTop="true"
        android:text="TextView" />

    <TextView
        android:id="@+id/textViewRowPelajaran"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:paddingLeft="10dp"
        android:layout_toRightOf="@+id/textViewRowJam"
        android:text="TextView" />

</RelativeLayout>

3. Buat class baru dengan nama Jadwal.java lalu ketikkan kode berkut

package com.agusharyanto.jadwalpelajaran;

public class Jadwal {
	public String hari="";
	public String jam="";
	public String pelajaran="";

	public Jadwal (String pday, String ptime, String plesson){
		this.hari = pday;
		this.jam = ptime;
		this.pelajaran = plesson;
	}

}

4. Buat Class baru dengan nama AdapterJadwal.java lalu ketikan kode berikut

package com.agusharyanto.jadwalpelajaran;

import java.util.ArrayList;

import android.app.Activity;
import android.content.Context;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.ArrayAdapter;
import android.widget.TextView;

public class AdapterJadwal extends ArrayAdapter<Jadwal> {
    private Activity activity;
    private ArrayList<Jadwal> lJadwal;
    private static LayoutInflater inflater = null;

    public AdapterJadwal (Activity activity, int textViewResourceId,ArrayList<Jadwal> al_Jadwal) {
        super(activity, textViewResourceId, al_Jadwal);
        try {
            this.activity = activity;
            this.lJadwal = al_Jadwal;

            inflater = (LayoutInflater) activity.getSystemService(Context.LAYOUT_INFLATER_SERVICE);

        } catch (Exception e) {

        }
    }

    public int getCount() {
        return lJadwal.size();
    }

    public long getItemId(int position) {
        return position;
    }

    public static class ViewHolder {
        public TextView jam;
        public TextView pelajaran;

    }

    public View getView(int position, View convertView, ViewGroup parent) {
        View vi = convertView;
        final ViewHolder holder;
        try {
            if (convertView == null) {
                vi = inflater.inflate(R.layout.row_jadwal, null);
                holder = new ViewHolder();

                holder.jam = (TextView) vi.findViewById(R.id.textViewRowJam);
                holder.pelajaran = (TextView) vi.findViewById(R.id.textViewRowPelajaran);

                vi.setTag(holder);
            } else {
                holder = (ViewHolder) vi.getTag();
            }

            holder.jam.setText(lJadwal.get(position).jam);
            holder.pelajaran.setText(lJadwal.get(position).pelajaran);

        } catch (Exception e) {

        }
        return vi;
    }
}

4. Edit MainActivity.java lalu ketikkan kode berikut

package com.agusharyanto.jadwalpelajaran;

import java.util.ArrayList;

import android.app.Activity;
import android.os.Bundle;
import android.view.Menu;
import android.view.MenuItem;
import android.widget.ListView;
import android.widget.TextView;

public class MainActivity extends Activity {
	ArrayList <Jadwal> list_jadwal = new ArrayList<Jadwal>();
	TextView tvhari;
	ListView listviewjadwal ;
	@Override
	protected void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_main);
		tvhari = (TextView) findViewById(R.id.textViewHari);
		listviewjadwal = (ListView) findViewById(R.id.listViewJadwal);
		initData();
	}

	public void initData() {
		list_jadwal.add(new Jadwal("Senin","08:00-10:00","Matematika"));
		list_jadwal.add(new Jadwal("Senin","10:00-12:00","Agama Islam"));
		list_jadwal.add(new Jadwal("Senin","12:00-13:00","Istirahat"));
		list_jadwal.add(new Jadwal("Senin","13:00-15:00","Fisika"));
		list_jadwal.add(new Jadwal("Selasa","08:00-10:00","Bahaa Indonesia"));
		list_jadwal.add(new Jadwal("Selasa","10:00-12:00","Kimia"));
		list_jadwal.add(new Jadwal("Selasa","12:00-13:00","Istirahat"));
		list_jadwal.add(new Jadwal("Selasa","13:00-15:00","Biologi"));
		list_jadwal.add(new Jadwal("Rabu","08:00-10:00","Matematika"));
		list_jadwal.add(new Jadwal("Rabu","10:00-12:00","Seni Rupa"));
		list_jadwal.add(new Jadwal("Rabu","12:00-13:00","Istirahat"));
		list_jadwal.add(new Jadwal("Rabu","13:00-15:00","Bahasa Inggris"));
		list_jadwal.add(new Jadwal("Kamis","08:00-10:00","Fisika"));
		list_jadwal.add(new Jadwal("Kamis","10:00-12:00","Penjaskes"));
		list_jadwal.add(new Jadwal("Kamis","12:00-13:00","Istirahat"));
		list_jadwal.add(new Jadwal("Kamis","13:00-15:00","Geografi"));
		list_jadwal.add(new Jadwal("Jumat","08:00-10:00","Pemrograman Java"));
		list_jadwal.add(new Jadwal("Jumat","10:00-12:00","Pemrograman Android"));
		list_jadwal.add(new Jadwal("Jumat","12:00-13:00","Istirahat"));
		list_jadwal.add(new Jadwal("Jumat","13:00-15:00","Logika Algoritma"));
	}

	@Override
	public boolean onCreateOptionsMenu(Menu menu) {
		// Inflate the menu; this adds items to the action bar if it is present.
		getMenuInflater().inflate(R.menu.main, menu);
	    return super.onCreateOptionsMenu(menu);
	}

	 /**
     * On selecting action bar
     * */
    @Override
    public boolean onOptionsItemSelected(MenuItem item) {
        // Take appropriate action for each action item click
        switch (item.getItemId()) {
        case R.id.action_senin:
            showJadwal("Senin");
            return true;
        case R.id.action_selasa:
            // location found
        	showJadwal("Selasa");
            return true;
        case R.id.action_rabu:
        	showJadwal("Rabu");
            return true;
        case R.id.action_kamis:
        	showJadwal("Kamis");
            return true;
        case R.id.action_jumat:
        	showJadwal("Jumat");
            return true;
        default:
            return super.onOptionsItemSelected(item);
        }
    }

	public void showJadwal(String hari) {

		tvhari.setText("Hari " + hari);
		ArrayList<Jadwal> jadwal_terpilih = new ArrayList<Jadwal>();
			for (int i = 0; i < list_jadwal.size(); i++) {
				Jadwal jadwal = list_jadwal.get(i);
				if (jadwal.hari.equals(hari)) {
					jadwal_terpilih.add(jadwal);
				}
			}

		AdapterJadwal adapterjadwal = new AdapterJadwal(MainActivity.this, 0,
				jadwal_terpilih);
		listviewjadwal.setAdapter(adapterjadwal);

	}

}

5. Saatnya Run Projectnya, klik pojok kanan untuk memunculkan menu

Pilih Senin

Untuk saat ini pada saat aplikasi dijalankan tampilannya kosong. harusnya kita bisa langsung menampilkan jadwal hari ini. Nah silahkan mencoba menyelesiakannya

Semoga Bermanfaat

Salam Hangat

Agus Haryanto