Jumat, Februari 24, 2012

PEMBUATAN APLIKASI HELLO WORLD - Part 3

Aplikasi Hello World sudah merupakan standar tutorial dasar untuk proses pembelajaran bahasa pemrograman atau framework baru. Meskipun aplikasi yang akan kita buat ini memang sangat sederhana, tujuan utama dari pembuatan aplikasi Hello World adalah supaya kita mengenal proses dasar pembuatan aplikasi untuk Android serta mengenal pula berbagai fitur di Eclipse IDE dan Android SDK sehingga kita bisa produktif dalam melakukan pengembangan berbagai aplikasi Android yang lebih rumit dan canggih.

PEMBUATAN PROJECT ANDROID :
  1. Di Eclipse menu, pilih File dan kemudian klik pada New, dan kemudian Project.
  2. Lakukan ekspansi pada Android, dan pilih Android Project untuk membuat project Android kita yang pertama. Klik Next.
  3. Pada dialog yang tampil, tentukan Project Name misalnya “HelloAndroid”. Tentukan Application Name misalnya “Hello, Android”. Isi Package Name dengan misalnya “com.inixindo.workshop”.  Pastikan bahwa Create Activity telah tercentang, dan berikan nama “HelloAndroid” untuk activity yang pertama. Berikan pula tanda centang pada platform Android yang ingin digunakan, yaitu Android 2.1-update1 pada Build Target. Terakhir, klik Finish.
  4. Eclipse akan menyiapkan project Android dan bahkan menyiapkan Activity kita yang pertama bernama HelloAndroid.java sesuai dengan nama yang kita berikan pada Create Activity sebelumnya.
  5. Buka Activity yang pertama dengan melakukan ekspansi pada src di Package Explorer yang ada di sebelah kiri, kemudian buka package com.inixindo.workshop, dan klik ganda pada file HelloAndroid.java.
  6. Perhatikan kode yang tercantum. Class HelloAndroid merupakan keturunan dari Activity. Pada method onCreate terdapat kode untuk menampilkan sebuah layar bernama “R.layout.main” melalui method setContentView(). Nama “R.layout.main” merupakan sebuah resource yang berarti bahwa ada tampilan layar bernama main yang jenisnya adalah layout, dan dapat diakses melalui class R.
  7. Class R dapat dibuka melalui Package Explorer pada  gen (berarti Generated Java Files yaitu file yang secara otomatis dibuat), kemudian buka package com.inixindo.workshop, dan klik ganda pada file R.java. Perhatikan bahwa di class R tersebut berisikan daftar resource yang diklasifikasikan dalam berbagai kategori seperti attr, drawable, layout, dan string. Perhatikan bahwa pada kategori layout ada resource bernama main.
  8. Untuk mengedit resource jenis layout bernama main tersebut, lakukan ekspansi pada res di Package Explorer. Buka layout, dan klik ganda pada main.xml. File main.xml inilah yang menentukan komponen View apa saja yang ada pada layar untuk Activity HelloAndroid.
  9. Format file adalah XML, namun untuk mengeditnya di Eclipse telah disediakan Layout view. Klik pada Layout untuk melihat dalam bentuk WYSIWYG. Daftar komponen View bisa dilihat di bagian kanan melalui Outline. Perhatikan bahwa telah tersedia satu View yaitu TextView yang berisikan teks “Hello World, HelloAndroid!”
  10. Pada TextView di Outline, klik kanan dan pilih Properties untuk melihat daftar properties komponen TextView tersebut. Cari property bernama “Text” dan perhatikan bahwa isinya adalah “@string/hello”. In berarti bahwa tulisan yang tampil di TextView tersebut diambil dari resource jenis string yang bernama hello. Jika dilihat kembali pada R.java, maka perhatikan bahwa terdapat resource jenis string dengan nama hello yang sudah terdaftar.
  11. Untuk mengubah tulisan melalui resource jenis string bernama hello tersebut, buka res di Package Explorer, kemudian buka values, dan klik ganda pada file strings.xml. Perhatikan bahwa ada 2 resource jenis string yaitu hello dan app_name. Klik pada hello untuk melihat tulisannya, dan ubahlah menjadi “Halo Dunia, HelloAndroid!” kemudian lakukan Save dengan klik icon disket di toolbar Eclipse.
  12. Kembali ke main.xml dan perhatikan bahwa tulisan di TextView sudah berubah mengikuti perubahan resource string hello tadi. Konsep ini sangat berguna karena memisahkan content dari source code. Content terdefinisi pada resource sehingga bisa diedit secara terpisah dari source code. Dengan pemisahan seperti ini, dimungkinkan bagi aplikasi yang kita kembangkan untuk mengganti tulisan dalam berbagai bahasa secara cepat dan mudah tanpa harus mengubah source codenya, namun cukup mengubah file XMLnya saja.
  13. Untuk menambahkan berbagai View yang lain, tinggal melakukan drag and drop dari daftar Views yang ada di sebelah kiri. Layout yang digunakan untuk layar main adalah LinearLayout secara vertikal, sehingga View akan tersusun dari atas ke bawah. Silakan menambahkan view AnalogClock dan kemudian Button. Perhatikan bahwa Outline menunjukkan tambahan view bernama analogClock1 dan button1.
  14. Di Outline, klik kanan pada button1 dan pilih Properties. Ubah property Text untuk menunjuk pada resource string bernama app_name. Ubah pula property Layout width dari wrap_content ke fill_parent sehingga lebar button memenuhi layar sepenuhnya. Perhatikan perubahan pada Layout view, dan lihat pula hasil XMLnya.
  15. Kita siap untuk menjalankan aplikasi HelloAndroid kita. Di Eclipse, pilih menu Run, kemudian Run As, dan pilih Android Application. Eclipse secara otomatis akan melakukan kompilasi, packaging, dan deploying ke Android Virtual Device (AVD) yang sudah jalan. Jika AVD belum jalan, maka Eclipse juga akan menjalankannya secara otomatis dan menggunakan AVD tersebut untuk menjalankan aplikasi HelloAndroid kita setelah proses boot AVD selesai. Perhatikan bahwa proses boot Android memakan waktu yang cukup lama, jadi kita harus sabar menanti.
  16. Tampilan seharusnya seperti berikut ini :


DEBUGGING PROJECT ANDROID :
1.      Eclipse IDE sudah menyediakan fasilitas debugging yang lengkap dan nyaman untuk digunakan. Dengan fasilitas debugging tersebut, kita dapat menelusuri berbagai kesalahan logika dalam kode kita secara seksama 19dengan memperhatikan berbagai nilai variabel dan object pada saat kode aplikasi kita sedang dieksekusi satu langkap demi satu langkah. Dengan kata lain, kita bisa melakukan code tracing step-by-step untuk mengetahui secara persis dimana letak kesalahan kode yang kita buat.
2.      Sebagai contoh, lakukan modifikasi kode pada activity HelloAndroid.java sehingga menjadi yang seperti di bawah ini : 

package com.inixindo.workshop;
import android.app.Activity;
import android.os.Bundle;
import android.widget.Button;
public class HelloAndroid extends Activity {
     /** Called when the activity is first created. */
     @Override
     public void onCreate(Bundle savedInstanceState) {
         super.onCreate(savedInstanceState);
         String tulisan = "Klik Saya!";
         Button button = (Button)
this.findViewById(R.id.button1);
         button.setText(tulisan);
         setContentView(R.layout.main);
     }
}

3.      Jalankan aplikasi tersebut pada emulator AVD dan perhatikan apa yang terjadi. Seharusnya akan tampil error seperti berikut :

 4.      Sekarang kita ingin mengetahui di mana letak error tersebut untuk bisa diperbaiki. Pertama, kita harus menentukan baris dimana eksekusi dihentikan sehingga bisa melakukan eksekusi kode step-by-step. Kita menentukan baris tempat pemberhentian ini dengan Breakpoint. Untuk menambah breakpoint, kita tinggal klik ganda di sebelah kiri baris yang dimaksud sampai muncul titik berwarna biru. Alternatifnya, kita bisa klik kanan dan pilih Toggle Breakpoint. Berikan breakpoint pada baris String tulisan = “Klik Saya!” sehingga eksekusi kode akan berhenti di baris tersebut.
5.      Jalankan debug dengan klik pada icon gambar serangga di toolbar Eclipse. Alternatifnya bisa dengan memilih menu Run, kemudian klik Debug.
6.      Setelah menjalankan Debug, maka Eclipse akan menanyakan apakah boleh mengganti Perspective ke Debug. Klik pada Yes untuk mengijinkannya. Tampilan layout Eclipse akan berubah untuk mendukung proses debugging.
7.      Perhatikan bahwa baris yang telah diberi breakpoint berwarna hijau untuk menunjukkan bahwa eksekusi berhenti di baris tersebut. Di bagian kanan atas terdapat daftar Variables yang dapat kita amati.
8.      Tekan F5 atau klik pada icon Step Into untuk mengeksekusi satu baris kode. Perhatikan bahwa variable tulisan akan muncul di daftar Variables dan berisikan “Klik Saya!” sesuai kode yang dieksekusi.
9.      Tekan F6 atau klik pada icon Step Over untuk mengeksekusi baris berikut namun tanpa loncat masuk ke dalam kode sumber untuk baris tersebut. Baris ini adalah untuk mendapatkan button dengan nama R.id.button1 yang ada di layout main.xml. Perhatikan bahwa variable button muncul di daftar Variables namun nilainya adalah null.
10.  Tekan F5 untuk Step Into untuk mengeksekusi baris berikut yaitu pemanggilan method setText dari object button. Perhatikan bahwa telah terjadi NullPointerException yang bisa terlihat di Variables dan Outline. NullPointerException inilah yang menyebabkan aplikasi kita crash di Android sehingga tampil pesan error di Android.
11.  Dengan menelusurinya, kita bisa mengetahui sebab dari masalah ini, yaitu bahwa button berupa null yang seharusnya menunjuk pada button1. Ini disebabkan karena kita mencoba mendapatkan button1 padahal layar belum menampilkan layout main, sehingga button1 memang belum ada.
12.  Untuk membetulkan masalah tersebut, kita harus memindahkan kode untuk mengakses button1 di bawah setelah pemanggilan method setContentView(). Hentikan debugging dengan klik tombol Disconnect, dan kemudian kembalikan Perspective ke Java untuk edit source code. Kode yang benar sebagai berikut :

package com.inixindo.workshop;
import android.app.Activity;
import android.os.Bundle;
import android.widget.Button;
public class HaloAndroid extends Activity {
     /** Called when the activity is first created. */
     @Override
     public void onCreate(Bundle savedInstanceState) {
         super.onCreate(savedInstanceState);
         String tulisan = "Klik Saya!";
         setContentView(R.layout.main);
         Button button = (Button)
this.findViewById(R.id.button1);
         button.setText(tulisan);
     }
}

13.  Ulangi proses debugging dan pastikan sekarang bahwa object button memang ada dan tidak null lagi.
14.  Selesailah sudah proses debugging. Jalankan lagi aplikasinya dan pastikan telah jalan di Android dengan baik.

 DEBUGGING DENGAN ANDROID DEVICE :
  1. Selain menggunakan emulator AVD, kita juga bisa melakukan eksekusi dan debugging dengan perangkat Android yang sungguhan. Dalam pengembangan aplikasi Android memang sangat disarankan untuk menjalankan aplikasi yang kita buat di perangkat Android yang sebenarnya, tidak hanya di emulator saja. Ini dikarenakan tidak ada jaminan bahwa emulator AVD memang sama persis seperti perangkat yang sesungguhnya. Debugging dengan perangkat Android yang sesungguhnya juga bisa lebih cepat dan handal ketimbang di emulator AVD.
  2. Untuk melakukan eksekusi atau debugging di perangkat Android yang sesungguhnya, maka perangkat Android tersebut harus terhubung ke PC melalui kabel USB. Driver USB perangkat Android juga sudah harus terinstall di PC. Pastikan semua sudah terhubung dan perangkat Android sudah menyala.
  3. Perangkat Android yang sesungguhnya harus disetting supaya bisa menerima Thurd Party application, dan juga bisa melakukan debugging melalui USB. Pada Android yang sesungguhnya, pilih Menu dan kemudian pilih Settings.
  4. Pada layar Settings, pilih Applications, dan berikan tanda centang pada Unknown sources untuk mengijinkan instalasi aplikasi Android dari pihak ketiga (Third Party apps).
  5. Masih di layar Application settings, pilih Development. Berikan tanda centang pada USB debugging untuk mengijinkan proses debugging pada perangkat Android tersebut.
  6. Di Eclipse, kita juga harus mengijinkan aplikasi kita agar bisa melakukan proses debug. Penambahan ijin ini harus dilakukan di file AndroidManifest.xml. Bukalah file tersebut di Project Explorer di Eclipse IDE.
  7. Di file AndroidManifest.xml, klik pada tab Application, dan cari setting untuk Debuggable dan ubahlah menjadi true. Lakukan save.
  8. Supaya aplikasi kita jalan di perangkat Android sesungguhnya dan bukan di emulator AVD, di Eclipse IDE di bagian Project Explorer, klik kanan pada project kita dan pilih Run As, kemudian Run Configurations.
  9. Pada dialog yang tampil, klik pada tab Target. Pada Deployment Target Selection Mode, pilih Manual. Klik Run.
  10. Setelah klik Run, maka akan muncul dialog untuk memilih perangkat Android yang ingin digunakan. Jika perangkat Android sesungguhnya sudah terhubung ke PC melalui kabel USB dan driver USB sudah terinstall dengan benar, maka perangkat Android tersebut seharusnya tampil pada daftar device. Pilih perangkat Android tersebut, dan klik OK.
  11. Aplikasi kita akan jalan pada perangkat Android yang sesungguhnya secara langsung.
  12. Jika ingin melakukan proses debugging, maka tinggal klik saja icon untuk Debug di Toolbar, kemudian pilih perangkat Android yang sesungguhnya, dan klik OK untuk melakukan debugging seperti biasa.

1 komentar:

  1. kita juga punya nih jurnal mengenai pembuatan aplikasi, silahkan dikunjungi dan dibaca , berikut linknya
    http://www.gunadarma.ac.id/library/articles/graduate/computer-science/2010/Artikel_11105325.pdf
    semoga bermanfaat yaa :)

    Balas

    BalasHapus