BAB 7: MEMBUAT MENU LIST Sering sekali aplikasi yang dikembangkan memiliki kompleksitas yang cukup besar, dan terdiri dari beberapa form. Biasanya disediakan menu yang fungsinya sebagai navigasi bagi pengguna agar dapat masuk ke layanan tertentu dengan mudah. Salah satu cara yang dapat dilakukan adalah dengan memanfaatkan library ListView, sehingga pada halaman utama dapat disediakan sejumlah menu yang akan menuntun pengguna untuk menggunakan aplikasi.
MINI CASE 1. MenuList Step 1 a. Buatlah sebuah proyek baru bernama MenuList b. Buanglah class MenuList.java sebab kita menggunakan kelas tersebut.
tidak
akan
Step 2 Buatlah sebuah kelas baru ketikkan program berikut:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16
yaitu:
FormRegistrasi.java
lalu
package www.aplysit.com; import import import import import import
android.app.ListActivity; android.content.Intent; android.os.Bundle; android.view.View; android.widget.ArrayAdapter; android.widget.ListView;
public class Menu extends ListActivity{ /** Called when the activity is first created. */ @Override public void onCreate(Bundle icicle) { super.onCreate(icicle); // Menyusun menu
1
Copyright oleh www.aplysit.com | 02261530230 | 0618215413 FB: Aplysit Bandung | FB: Aplysit Medan YM: aplysit | email:
[email protected]
17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72
String[] menu = new String[]{"Menu Registrasi","Kompresi","Dekompresi","Perihal","Exit"}; // Menampilkan menu di LisstMenu this.setListAdapter(new ArrayAdapter<String>(this, android.R.layout.simple_list_item_1, menu)); } @Override /* method ini akan mengoveride method onListItemClick yang ada pada class List Activity method ini akan dipanggil apabilai ada salah satu item dari list menu yang dipilih */ protected void onListItemClick(ListView l, View v, int position, long id) { super.onListItemClick(l, v, position, id); // Menangkap nilai text yang dklik Object o = this.getListAdapter().getItem(position); String pilihan = o.toString(); tampilkanPilihan(pilihan); } /** * Tampilkan Activity sesuai dengan menu yang dipilih * */ protected void tampilkanPilihan(String pilihan) { try { //Intent digunakan sebagai pengenal activity Intent i = null; if (pilihan.equals("Menu Registrasi")) { i = new Intent(this, FormRegistrasi.class); } else if (pilihan.equals("Kompresi")) { //to be defined } else if (pilihan.equals("Dekompresi")) { //to be defined } else if (pilihan.equals("Perihal")) { //to be defined } else if (pilihan.equals("Exit")) { finish(); } startActivity(i); } catch (Exception e) { e.printStackTrace(); }
2
Copyright oleh www.aplysit.com | 02261530230 | 0618215413 FB: Aplysit Bandung | FB: Aplysit Medan YM: aplysit | email:
[email protected]
73 74 75 76
} }
Step 3 Buatlah sebuah kelas baru yaitu: Menu.java lalu ketikkan program berikut:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38
package www.aplysit.com; import import import import import import
java.io.IOException; java.io.InputStream; java.io.InputStreamReader; java.net.HttpURLConnection; java.net.URL; java.net.URLConnection;
import import import import import import import
android.app.Activity; android.os.Bundle; android.view.View; android.view.View.OnClickListener; android.widget.Button; android.widget.EditText; android.widget.Toast;
public class FormRegistrasi extends Activity{ public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); //memanggil layout formregistrasi.xml setContentView(R.layout.formregistrasi); // Button untuk menambah data Button tambah = (Button)findViewById(R.id.widget50); tambah.setOnClickListener(new OnClickListener() { @Override public void onClick(View v) { // TODO Auto-generated method stub tambah(); } }); Button ulang = (Button)findViewById(R.id.widget63); ulang.setOnClickListener(new OnClickListener() {
3
Copyright oleh www.aplysit.com | 02261530230 | 0618215413 FB: Aplysit Bandung | FB: Aplysit Medan YM: aplysit | email:
[email protected]
39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94
@Override public void onClick(View v) { // TODO Auto-generated method stub ulang(); } }); Button batal = (Button)findViewById(R.id.widget64); batal.setOnClickListener(new OnClickListener() { @Override public void onClick(View v) { // TODO Auto-generated method stub finish(); } }); } public void tambah(){ String url = ""; String nama = ((EditText)findViewById(R.id.widget33)).getText(). toString(); String nim = ((EditText)findViewById(R.id.widget34)).getText(). toString(); String kelas = ((EditText)findViewById(R.id.widget35)).getText(). toString();
try { //bagian ini bila Anda menggunakan server localhost //url = "http://114.57.112.50/menulist/registrasi.php?&cat=INSERT&nama="+nama+"&nim="+nim+"&kelas="+
//bagian ini bila Anda menggunakan server AplysIT url = "http://www.aplysit.com/android/registrasi.php?cat=INSERT&nama="+nama+"&nim="+nim+"&kelas="+ String response = call(url); Toast.makeText(getBaseContext(),response,Toast.LENGTH_SHORT).show(); } catch (Exception er) { Toast.makeText(getBaseContext(),er.toString(),Toast.LENGTH_SHORT).show(); } } private String call(String url) { // TODO Auto-generated method stub int BUFFER_SIZE = 2000; InputStream in = null; try { in = OpenHttpConnection(url); } catch (IOException e) { // TODO: handle exception
4
Copyright oleh www.aplysit.com | 02261530230 | 0618215413 FB: Aplysit Bandung | FB: Aplysit Medan YM: aplysit | email:
[email protected]
95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138 139 140 141 142 143 144 145 146 147 148 149 150
e.printStackTrace(); return ""; }
InputStreamReader isr = new InputStreamReader(in); int charRead; String str=""; char[] inputBuffer = new char[BUFFER_SIZE]; try { while((charRead = isr.read(inputBuffer))>0){ String readString = String.copyValueOf(inputBuffer,0,charRead) str += readString; inputBuffer = new char[BUFFER_SIZE]; } in.close(); } catch (IOException e) { // TODO: handle exception e.printStackTrace(); return ""; } return str; } private InputStream OpenHttpConnection(String urlString) throws IOException { // TODO Auto-generated method stub InputStream in =null; int response = -1; URL url = new URL(urlString); URLConnection conn = url.openConnection(); if (!(conn instanceof HttpURLConnection)) throw new IOException("Not An HTTP connection"); try { HttpURLConnection httpconn = (HttpURLConnection) conn; httpconn.setAllowUserInteraction(false); httpconn.setInstanceFollowRedirects(true); httpconn.setRequestMethod("GET"); httpconn.connect(); response = httpconn.getResponseCode(); if (response == HttpURLConnection.HTTP_OK){ in = httpconn.getInputStream(); } } catch (Exception e) { // TODO: handle exception throw new IOException("Error connecting"); }
return in; } public void ulang(){
5
Copyright oleh www.aplysit.com | 02261530230 | 0618215413 FB: Aplysit Bandung | FB: Aplysit Medan YM: aplysit | email:
[email protected]
151 152 153 154 155 156 157 158 159 160 161 162
EditText nama = (EditText)findViewById(R.id.widget33); EditText nim = (EditText)findViewById(R.id.widget34); EditText kelas = (EditText)findViewById(R.id.widget35); nama.setText(""); nim.setText(""); kelas.setText(""); nama.requestFocus(); } }
Baris 73-76 adalah alamat server AplysIT, sehingga Anda tidak perlu repot mempersiapkan server sendiri. Jika Anda tidak menggunakan server AplysIT, maka Anda harus menyiapkan server sendiri pada localhost, dan menggunakan baris 69-71 yang merupakan alamat server yang dituju, yaitu url+ =http://10.40.201.249/ Untuk penggunakan server local, Anda perlu mengganti alamat IP tersebut dengan IP komputer Anda karena kita Anda akan mencoba di localhost. Caranya sangat mudah, pada start menu, piih Run > ketik cmd > Enter lalu akan muncul jendela console berwaran hitam. Ketik ipconfig [enter] dan akan ditampilkan konfigurasi IP computer Anda, seperti gambar berikut:
Step 4
6
Copyright oleh www.aplysit.com | 02261530230 | 0618215413 FB: Aplysit Bandung | FB: Aplysit Medan YM: aplysit | email:
[email protected]
Ubah kode program main.xml sehingga menjadi seperti berikut ini.
1 2 3 4 5 6 7 8 9 10
Step 5 Buat sebuah file layout baru dengan nama formregistrasi.xml caranya klik kanan pada nama proyek > New > Android XML File seperti gambar berikut:
Lalu ketikkan kode program berikut:
1 2 3 4 5 6 7 8 9
7
Copyright oleh www.aplysit.com | 02261530230 | 0618215413 FB: Aplysit Bandung | FB: Aplysit Medan YM: aplysit | email: [email protected]
10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65
android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="NAMA" android:layout_x="26px" android:layout_y="94px" > <EditText android:id="@+id/widget33" android:layout_width="179px" android:layout_height="wrap_content" android:textSize="18sp" android:layout_x="97px" android:layout_y="85px" > <EditText android:id="@+id/widget34" android:layout_width="179px" android:layout_height="wrap_content" android:textSize="18sp" android:layout_x="97px" android:layout_y="140px" > <EditText android:id="@+id/widget35" android:layout_width="177px" android:layout_height="wrap_content" android:textSize="18sp" android:layout_x="97px" android:layout_y="194px" > <Button android:id="@+id/widget50" android:layout_width="83px" android:layout_height="wrap_content"
8
Copyright oleh www.aplysit.com | 02261530230 | 0618215413 FB: Aplysit Bandung | FB: Aplysit Medan YM: aplysit | email: [email protected]
66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104
android:text="TAMBAH" android:layout_x="26px" android:layout_y="259px" > <Button android:id="@+id/widget63" android:layout_width="92px" android:layout_height="wrap_content" android:text="ULANG" android:layout_x="110px" android:layout_y="258px" > <Button android:id="@+id/widget64" android:layout_width="92px" android:layout_height="wrap_content" android:text="BATAL" android:layout_x="201px" android:layout_y="258px" >
Pada tab Layout, maka hasilnya adalah seperti gambar berikut:
9
Copyright oleh www.aplysit.com | 02261530230 | 0618215413 FB: Aplysit Bandung | FB: Aplysit Medan YM: aplysit | email:
[email protected]
Step 6 Buka file AndroidManifest.xml lalu modifikasi hingga menjadi seperti gambar berikut:
1 2 3 4 5 6 7 8 9 10 11 12 13 14
<manifest xmlns:android="http://schemas.android.com/apk/res/android" package="www.dct.com" android:versionCode="1" android:versionName="1.0"> <uses-permission android:name="android.permission.INTERNET"><uses-sdk android:minSdkVersion="8" />
10
Copyright oleh www.aplysit.com | 02261530230 | 0618215413 FB: Aplysit Bandung | FB: Aplysit Medan YM: aplysit | email: [email protected]
15 16 17 18 19 20 21 22 23 24 25 26 27
>
Pengaturan pada AndroidManifest.xml tersebut adalah untuk mengkonfigurasikan persmission agar perangkat dapat mengakses internet. Atau dengan cara lain dapat dilakukan lewat Tab Permission, klik tombol Add, lalu pilih Uses Permission, lalu isi name dengan android.permission.Internet Sebagai tambahakn, perhatikan bahwa pada baris 12 ada tulisan android:name=".Menu" adalah untuk mengaktifasi class yang akan dibuka di list menu. Catatan: Untuk langkah 7-8 Anda tidak perlu mencobanya, sebab sudah tersedia alamat pada server Aplysit.
Step 7 Buat database di PostgresSQL dengan nama registrasi, lalu buat table tbl_registrasi dengan isi field sebagai berikut :
1 2 3 4
11
|Nama filed |tipe data | -------------------------------------------------|id_registrasi |serial | |nama |character varying | |nim |character varying | |kelas |character varying | --------------------------------------------------
Copyright oleh www.aplysit.com | 02261530230 | 0618215413 FB: Aplysit Bandung | FB: Aplysit Medan YM: aplysit | email:
[email protected]
Step 8 Buat file file di WAMP Registrasi, lalu buat file dengan nama registrasi.php dengan isi dari kode sumber berikut: Kode berikut jika Anda menggunakan PostgreSQL:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41
= = = =
"localhost"; "registrasi"; "postgres"; "postgres";
extract($_REQUEST, EXTR_OVERWRITE); $conn = pg_connect("host=" .$db_host. " dbname=" .$db_name. " user=" .$db_user. " password=" . $db_pass) or die ("fail to connect"); if ($cat == "TAMPIL") { $sql = "SELECT * FROM tbl_registrasi"; $response = pg_query($conn,$sql); while ($hasil = pg_fetch_assoc($response)) { echo ($hasil["id"]."|".$hasil["nama"]."|".$hasil["nim"]."|".$hasil["k elas"]."#"); } } else if ($cat == "INSERT") { $response = pg_query($conn,"INSERT INTO tbl_registrasi(nama,nim,kelas) VALUES($nama,$nim,$kelas)"); $response = pg_query($conn,$sql); echo "Data berhasil ditambah bernilai \n nama: " .$nama. " nim: " .$nim. " kelas: " . $kelas; } pg_close($conn); ?>
12
Copyright oleh www.aplysit.com | 02261530230 | 0618215413 FB: Aplysit Bandung | FB: Aplysit Medan YM: aplysit | email:
[email protected]
Kode berikut jika Anda menggunakan MySQL:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44
= = = =
"localhost"; "registrasi"; "mysql"; "root";
//step 3: activate global variable extract($_REQUEST, EXTR_OVERWRITE); mysql_connect($db_host, $db_user, koneksi"); mysql_select_db($db_name);
$db_pass)
or
die
("gagal
if ($cat == "TAMPIL") { $sql = "SELECT * FROM tbl_registrasi"; $response = mysql_query($sql); while ($hasil = mysql_fetch_array($response)) { $id_registrasi = stripslashes($hasil[id_registrasi]); $nama = stripslashes($hasil[nama]); $nim = stripslashes($hasil[nim]); $kelas = stripslashes($hasil[kelas]); echo ($id_registras. "|" .$nama. "|" .$nim. "|" .$kelas. "#"); } } else if ($cat == "INSERT") { $sql = "INSERT INTO tbl_registrasi(nama,nim,kelas) VALUES('$nama','$nim','$kelas')"; $response = mysql_query($sql); echo "Data berhasil ditambah bernilai \n nama: " .$nama. " nim: " .$nim. " kelas: " . $kelas; } ?>
13
Copyright oleh www.aplysit.com | 02261530230 | 0618215413 FB: Aplysit Bandung | FB: Aplysit Medan YM: aplysit | email:
[email protected]
Step 9 Jalankan proyek, klik kanan pada proyek > Run As > Android Application.
(a)
(b)
Gambar (a): klik menu Registrasi. Gambar (b): isikan data seperti gambar lalu tekan tombol TAMBAH. Jika Anda ingin melihat hasilnya, maka silahkan ketikkan alamat berikut pada browser Anda: http://www.aplysit.com/android/registrasi.php?cat=TAMPIL
14
Copyright oleh www.aplysit.com | 02261530230 | 0618215413 FB: Aplysit Bandung | FB: Aplysit Medan YM: aplysit | email:
[email protected]