Membuat Menu Dengan ListView di Android

By Fajar Muhammad Sukmawijaya | 1:05 AM No comments

membuat menu dengan listview di

android untuk membuka activity. Selain dengan menggunakan Button, beberapa aplikasi
android juga menggunakan ListView sebagai tampilan antarmuka menu ataupun pada Sub Menu
tertentu. Selain mudah digunakan, tampilan menu dengan listview juga tidak memerlukan desain
yang rumit, karena hanya teks-teks menunya saja yang ditampilkan.

Untuk tutorial kali ini, ieuwelah.com akan coba membahas mengenai pembuatan menu dengan
menggunakan ListView. Nantinya akan ada beberapa menu pilihan pada listview yang kemudian
dapat di klik OnItemClick dan menampilkan Activity lain sesuai menu yang dipilih. Mari kita
coba, berikut cara membuat menu dengan listview di android :

Gambar 1. Membuat Menu ListView Android

Langkah 1
Buat Project Android baru.
 Gambar 2. Membuat Project Android Baru
Pada tutorial kali ini kita membutuhkan 5 layout, dan 4 class.

Gambar 3. Susunan File Java

Gambar 4. Susunan Layout

Langkah 2
Membuat tampilan Listview. Pada activiy_main.xml tulis kode berikut ini :

<?xml version="1.0" encoding="utf-8"?>

<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" >

<!-- List View -->

<ListView
android:id="@+id/list_view"
android:layout_width="fill_parent"
android:layout_height="wrap_content" />

</RelativeLayout>

Kemudian untuk list_menu.xml tulis kode berikut ini :

<?xml version="1.0" encoding="utf-8"?>

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">
 <!-- Single ListItem -->
<TextView
android:id="@+id/nama_menu"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:textColor="#000000"
android:textStyle="bold"/>

</LinearLayout>

Langkah 3
Tampilan Menu 1, Menu 2, dan Menu 3. Untuk activity_menu_1, 2, dan 3. Tulis kode berikut ini,
hanya saja ubah Text menjadi nama menu yang diinginakan (lihat tanda merah).

<?xml version="1.0" encoding="utf-8"?>

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Menu 1"/>

</LinearLayout>

Langkah 4
Buka MainActivity.java lalu tulis kode berikut ini :

package ieuwelah.com.menulistview;

import java.util.ArrayList;
import java.util.HashMap;

import android.app.Activity;
import android.content.Intent;
import android.os.Bundle;
import android.widget.AdapterView.OnItemClickListener;
import android.view.View;
import android.widget.AdapterView;
import android.widget.ArrayAdapter;
import android.widget.ListView;

public class MainActivity extends Activity implements OnItemClickListener{

 private ListView lv;
ArrayAdapter<String> adapter;
ArrayList<HashMap<String, String>> menu;

@Override
protected void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);

String[] menu = new String[] {

"Menu 1",
"Menu 2",
"Menu 3",
"Keluar"
};

lv = (ListView)findViewById(R.id.list_view);
lv.setOnItemClickListener(new AdapterView.OnItemClickListener() {
public void onItemClick(AdapterView<?> parent, View view, int position,
long id) {
// TODO Auto-generated method stub
String pilihan = (lv.getItemAtPosition(position).toString());
tampilkanMenu(pilihan);
}

private void tampilkanMenu(String pilihan) {

// TODO Auto-generated method stub
Intent i = null;
if (pilihan.equals("Menu 1")) {
i = new Intent(MainActivity.this, Menu1_Activity.class);
}
else if (pilihan.equals("Menu 2")) {
i = new Intent(MainActivity.this, Menu2_Activity.class);
}
else if (pilihan.equals("Menu 3")) {
i = new Intent(MainActivity.this, Menu3_Activity.class);
}
startActivity(i);
}
});

adapter = new ArrayAdapter<String>(this, R.layout.list_menu, R.id.nama_menu, menu);

lv.setAdapter(adapter);
}

@Override
 public void onItemClick(AdapterView<?> parent, View view, int position,
long id) {
// TODO Auto-generated method stub

}
}

Langkah 5
Pada Menu1_Activity, Menu2_Activity, dan Menu3_Activiy tulis kode berikut ini, bedakan
masing-masing nama class dan nama layout yang digunakan (lihat tanda merah).

package ieuwelah.com.menulistview;

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

public class Menu1_Activity extends Activity {

protected void onCreate(Bundle SavedInstanceState) {
super.onCreate(SavedInstanceState);
setContentView(R.layout.activity_menu_1);
}
}

Langkah 6
Karena disini kita membuat 3 Activity baru, maka kita harus mendaftarkannya terlebih dahulu di
Android Manifest. Caranya klik file AndroidManifest.xml lalu tambahkan baris kode berikut
sebelum tag penutup </application> (tulis kode yang bukan warna biru).

</activity>
<activity android:name=".Menu1_Activity"></activity>
<activity android:name=".Menu2_Activity"></activity>
<activity android:name=".Menu3_Activity"></activity>
</application>

Langkah 7
Pastikan tidak ada error yang dalam penulisan kode program. Run Program untuk melihat
hasilnya, pada tutorial ini ieuwelah menggunakan emulator android dari genymotion [lihat : cara
install genymotion untuk emulator android eclipse].

Menu dengan menggunakan listview bisa menjadi alternatif dalam pembuatan aplikasi Anda.
Sekian untuk tutorial kali ini, terimakasih semoga bermanfaat :)