MEMBUAT APLIKASI ANDROID

Disusun oleh : Andry <andrymail@gmail.com>

Membuat Aplikasi Android – Andry<andrymail@gmail.com>

1. INSTALASI TOOLS PENGEMBANGAN APLIKASI ANDROID
Sebelum memulai membuat aplikasi Android, pertama-tama kita harus melakukan instalasi tools yang diperlukan. Langkah-langkah instalasi tools untuk pengembangan aplikasi Android adalah sebagai berikut : 1. Siapkan komputer yang akan digunakan untuk mengembangkan aplikasi Android. Tools untuk pengembangan Android dapat berjalan di platform Windows, Linux, dan MacOS X. Adapun kebutuhan sistem untuk menjalankan tools ini adalah : a. Sistem operasi :  Windows XP (32-bit), Vista (32- or 64-bit), or Windows 7 (32- or 64-bit)  Mac OS X 10.5.8 atau yang lebih baru (Hanya di platform x86, dan bukan di PowerPC)  Linux yang mendukung aplikasi 32 bit (sudah dicoba di Linux Ubuntu Hardy Heron) b. Software :  JDK 5 atau JDK 6 (bukan hanya JRE)  Eclipse 3.4 (Ganymede) atau yang lebih baru, paket yang disarankan adalah :  Eclipse IDE for Java EE Developers  Eclipse IDE for Java Developers  Eclipse for RCP/Plug-in Developers  Eclipse Classic (versions 3.5.1 atau yang lebih baru)  Eclipse JDT (http://www.eclipse.org/jdt) plugin (umumnya sudah ada di paket-paket Eclipse IDE) Minimal tersedia 500 MB free space storage

c. 2.

Install SDK Starter Package (android-sdk_r10-windows.zip atau installer_r10-windows.exe). Untuk yang versi .zip caranya dengan meng-extract file tersebut ke salah satu folder di komputer, misal kita extract ke folder C:\Program Files\. Sedangkan yang versi .exe proses instalasi cukup dengan menjalankan file tersebut. Untuk mendapatkan versi terbaru dari Starter Package ini, bisa diunduh di http://developer.android.com/intl/fr/sdk/index.html . Install ADT plugin for Eclipse Untuk melakukan instalasi plugin ini secara online lakukan langkah-langkah berikut :  Jalankan Eclipse 3.5/3.6 kemudian pilih menu Help > Install New Software… (untuk Eclipse 3.4 gunakan menu Help > Software Updates…)  Pada bagian Available Software pilih tombol Add… (atau Add Site… untuk Eclipse 3.4)  Pilih tombol Archive dan browse file ADT-10.0.0.zip  Kembali ke jendela Available Software akan terlihat item Developer Tools. Centang checkbox yang ada di bagian tersebut kemudian pilih Next (atau Install untuk Eclipse 3.4)  Lanjutkan dengan mengklik tombol Next pada jendela-jendela yang ada berikutnya dan diakhiri dengan tombol Finish  Restart Eclipse  Pilih menu Window > Preferences pada Eclipse, kemudian pilih Android pada tree di panel sebelah kiri  Isikan SDK Location dengan menekan tombol Browse… kemudian pilih direktori tempat kita mengextract SDK Starter Package pada langkah 2 di atas Tambahkan platform Android dan komponen SDK lainnya

3.

4.

Membuat Aplikasi Android – Andry<andrymail@gmail.com>

Gunakan aplikasi Android SDK and AVD Manager yang disertakan dalam SDK Starter Package untuk menambahkan satu atau lebih platform Android (contohnya Android 1.6 atau Android 2.3) serta komponenkomponen lain ke dalam SDK. Untuk menjalankan Android SDK and AVD Manager di Windows, jalankan SDK Setup.exe yang ada di root direktori SDK Starter Package. Aplikasi ini juga bisa dijalankan dari Eclipse dengan menekan tombol yang ada di bawah baris menu atau melalui menu Window > Android SDK and AVD Manager. Kemudian check item yang ingin diinstall dan tekan tombol Install Selected. Dari situ akan muncul jendela untuk memulai instalasi, silakan pilih radio button Accept All yang ada di bagian kanan bawah lalu tekan tombol Install. Untuk mengawalinya kita harus menginstall Android SDK Platform-tools dan salah satu SDK Platform Android, silakan pilih versi platform Android yang dibutuhkan untuk pengembangan. Sedangkan untuk package yang lain silakan dipilih sesuai dengan kebutuhan pengembangan aplikasi, seperti USB Driver Package, Google APIs by Google Inc, dan Documentation for Android SDK.

5. Membuat Android Virtual Device (AVD) Untuk dapat menjalankan emulator dari platform yang sudah kita install, kita harus membuat sebuah AVD terlebih dahulu. AVD berisi image sistem operasi dan setting device yang akan digunakan oleh emulator. Cara membuat AVD adalah sebagai berikut :  Jalankan Android SDK and AVD Manager seperti yang ada di langkah nomor 4  Pilih Virtual Devices yang ada di panel sebelah kiri, lalu tekan tombol New…  Isikan Name sesuai pilihan (tidak boleh menggunakan spasi, huruf yang diperbolehkan hanya a-zA-Z.-_ ), kemudian pilih drop down Target untuk memilih versi sistem operasi platform yang diinginkan

Membuat Aplikasi Android – Andry<andrymail@gmail.com>

com> . Coba jalankan emulator yang baru dibuat dengan menekan tombol Start… Membuat Aplikasi Android – Andry<andrymail@gmail. Bagian SDCard bisa dikosongkan bisa juga diisi nilai tertentu sehingga pada emulator yang akan tersedia storage external  Bagian Skin kita bisa menentukan resolusi layar dari emulator  Setelah selesai tekan tombol Create AVD 6.

Versi Platform Android 3. Selesai mengisikan data yang diperlukan.  Min SDK Version. Jika field ini diisi.1 Android 2. Seperti kebiasaan belajar suatu bahasa pemrograman pada umumnya. adalah level API (platform Android) yang diperlukan oleh aplikasi agar dapat dijalankan. Secara sederhana. Kelas ini akan merupakan subclass dari kelas Activity dari Android.3 Android 2. Contohnya : com. sekarang kita bisa memulai membuat aplikasi Android. 2.com> . Contoh hasil pengisian data tersebut bisa dilihat pada gambar di bawah ini. tekan tombol Finish.3 Android 2. HELLO WORLD Setelah selesai melakukan instalasi tools yang diperlukan untuk mengembangkan aplikasi Android. Nama package ini harus dibuat unik untuk semua package yang terinstall dalam sistem Android.example. Nilai field ini juga akan menentukan library Android mana yang akan dipakai untuk kompilasi Pada bagian Properties isikan nilai berikut :  Application name.3. Isian ini nilainya adalah sebuah angka dengan aturan berikut. tidak boleh ada dua aplikasi berbeda yang menggunakan package yang sama karena akan menyebabkan satu aplikasi menimpa aplikasi yang lain.0 Level API 11 10 9 8 7 6 5 4 3 2 1 4. nama package seperti pada pemrograman menggunakan bahasa Java yang lainnya. 3. sebuah Activity adalah kelas yang bisa menampilkan User Interface dari aplikasi. Dari Eclipse pilih menu File > New > Android Project yang akan memunculkan jendela dialog New Android Project Isikan Project name dengan HelloAndroid Pilih salah satu platform di Build Target sesuai yang telah diinstall dan target versi sistem operasi Android di mana aplikasi akan dijalankan.0 Android 1.6 Android 1. Semua pengerjaan pembuatan aplikasi ini akan kita lakukan dengan menggunakan Eclipse.5 Android 1.1 Android 2.0 Android 2. kita mulai dengan membuat aplikasi Hello World.2.2 Android 2.hello  Create activity.android. Membuat Aplikasi Android – Andry<andrymail@gmail.1 Android 1.0. Disarankan untuk menggunakan standard domain-style package untuk aplikasi yang kita buat. maka kelas tersebut akan menjadi kelas yang pertama kali dipanggil saat aplikasi dijalankan. adalah nama aplikasi yang terlihat oleh pengguna dan akan muncul di daftar aplikasi  Package name. Berikut langkah-langkah pembuatannya : 1. adalah nama kelas yang akan dibuat oleh plugin.

app. Selanjutnya kita lakukan modifikasi pada kode di atas menjadi seperti di bawah ini.java yang isinya seperti berikut : package com.android. } } 6.layout. public class HelloActivity extends Activity { /** Called when the activity is first created. Perhatikan bagian yang dicetak tebal adalah perubahan yang dilakukan. Membuat Aplikasi Android – Andry<andrymail@gmail. */ @Override public void onCreate(Bundle savedInstanceState) { super.os.5.main). setContentView(R. Jika kita lihat dalam tree project HelloAndroid akan ada sejumlah file dan direktori. import android. Lihat ke dalam folder src akan terdapat file HelloActivity.tester.Activity. import android.onCreate(savedInstanceState).com> .Bundle.

import android. public class HelloActivity extends Activity { /** Called when the activity is first created.main). Membuat Aplikasi Android – Andry<andrymail@gmail. buka key lock dan akan terlihat tampilan seperti gambar di bawah ini. } } 7.app. import android. Coba jalankan aplikasi yang baru dibuat dengan klik kanan nama project HelloWorld yang ada di panel Package Explorer di panel sebelah kiri.os. TextView tv = new TextView(this). setContentView(tv).com> .onCreate(savedInstanceState).package com.Bundle.layout.android.tester. kemudian pilih menu Run As > Android Application.setText("Hello World").widget. Tunggu sampai proses start up emulator selesai.TextView. import android. jika sudah muncul tampilan Android Lock Screen. */ @Override public void onCreate(Bundle savedInstanceState) { super. 8. // setContentView(R.Activity. tv.

android. maka Android menyediakan cara lain yaitu dengan menggunakan file layout XML.app.0" encoding="utf-8"?> <TextView xmlns:android="http://schemas. Sekarang buka dan ganti isi kelas HelloAndroid di folder src\ agar menggunakan file XML Layout menjadi seperti berikut package com. 1. lihat isi folder res\layout\ dan buka file main.main). Ganti isi file tersebut menjadi seperti berikut <?xml version="1. Untuk menghindarkan masalah tersebut.xml di bagian bawah jendela kode untuk melihat isi kode XML).example. import android. Ganti isinya dengan XML berikut ini lalu simpan. Coba jalankan kembali hasil kode di atas agar muncul di emulator Membuat Aplikasi Android – Andry<andrymail@gmail. setContentView(R. maka kode juga akan semakin rumit karena bagian tampilan dan pemrosesnya menjadi satu.xml (begitu terbuka coba klik tab main. Berikut ini akan dijelaskan langkah-langkah untuk mengubah kode Hello World di atas sehingga menggunakan model XML Layout. Contoh file layout tersebut untuk membuat Hello World adalah seperti berikut. } } 4. import android.Pada contoh Hello World di atas kita menggunakan kode untuk menaruh teks pada layar.com/apk/res/android" android:id="@id+/textview" android:layout_width="fill_parent" android:layout_height="fill_parent" android:text="@string/hello"/> File tersebut ditaruh di folder res\layout\ dalam project Android. <?xml version="1.xml.0" encoding="utf-8"?> <TextView xmlns:android="http://schemas.helloandroid.os. Dalam folder res\values buka file strings.Bundle. Pada Eclipse Package Explorer.android. Masalah lain yang dapat timbul adalah apabila ada perubahan pada tampilan. yang berdasarkan pada pengalaman apabila aplikasi bertambah kompleks.0" encoding="utf-8"?> <resources> <string name="hello">Hello Android</string> <string name="app_name">Hello Android</string> </resources> 3.onCreate(savedInstanceState).com/apk/res/android" android:id="@id+/textview" android:layout_width="fill_parent" android:layout_height="fill_parent" android:text="@string/hello"/> 2. <?xml version="1.layout.com> .Activity. */ @Override public void onCreate(Bundle savedInstanceState) { super. public class HelloAndroid extends Activity { /** Called when the activity is first created.

5. kemudian pilih Android Tools > Export Signed Application Package… Selanjutnya akan muncul jendela Export Android Application. Pilih radio button Create new keystore lalu tekan tombol Browse… Browse ke direktori workspace dari Eclipse lalu masuk ke folder project yang akan di Build. kemudian isikan File name dengan keystore. BUILD APLIKASI ANDROID Setelah aplikasi kita menyelesaikan pembuatan kode untuk aplikasi yang kita buat.key lalu akhiri dengan menekan tombol Save Kembali ke jendela Export Android Application isikan Password dan Confirm dengan password pilihan kita. 4. isi keduanya harus sama. langkah selanjutnya yang diperlukan agar installer aplikasi tersebut bisa didownload dan diinstall di perangkat Android adalah melakukan proses Build. Klik-kanan nama project yang akan di Build. Pastikan isian field Project adalah nama project yang akan di Build kemudian tekan tombol Next 3. Adapun cara melakukan Build adalah sebagai berikut : 1. 2. selesai tekan tombol Next Membuat Aplikasi Android – Andry<andrymail@gmail.3.com> . misalkan HelloWorld yang ada di panel Package Explorer di sebelah kiri.

Nilainya sesuai data diri pembuat aplikasi. Isikan Alias. dan Confirm dengan nilai yang kita inginkan. 9.6. Password. untuk Validity isikan angka minimal 30 Selanjutnya untuk isian lainnya yang ada di bawahnya diperlukan ada salah satu field yang terisi.com> . Selesai. Terakhir akan muncul jendela Destination and key/certificate checks. Kembali ke jendela sebelumnya kita tekan Finish untuk memulai pembuatan file APK dari project kita. Tekan Browse dan pilih direktori yang diinginkan dan diakhiri dengan menekan tombol Save. Selesai tekan tombol Next 8. 7. 10. Di sini kita akan menentukan di mana file APK hasil Build project kita akan ditaruh. Selanjutnya akan muncul jendela Key Creation. kita bisa mencoba menginstall APK hasil build tadi ke perangkat Android yang kita miliki atau untuk di-upload ke Android Market Membuat Aplikasi Android – Andry<andrymail@gmail.

STRUKTUR PROJECT APLIKASI ANDROID Gambar di atas menunjukkan contoh sebuah struktur project aplikasi Android. yang berisi ID untuk mengakses resources aplikasi yang ada di folder res. layout tampilan. Sebaiknya isi folder ini tidak diubah secara manual. Untuk mengakses file yang disimpan di sini digunakan kelas AssetManager dan diacu menggunakan nama filenya. : Kita dapat menaruh file apapun di sini.  res  AndroidManifest.com> . Berbeda dengan isi folder res. File resource yang ditaruh di sini akan dikompilasi oleh ADT kemudian dibuatkan sebuah ID yang unik untuk mengaksesnya. : Isi folder ini otomatis di-generate oleh ADT. isinya antara lain  Nama package Java dari aplikasi tersebut  Daftar komponen dari aplikasi  Permission yang diperlukan oleh aplikasi untuk mengakses protected API dan berkomunikasi dengan aplikasi lain  Permission untuk aplikasi lain yang diperlukan untuk berinteraksi dengan aplikasi ini  Minimum level Android API yang diperlukan aplikasi  Daftar libraries yang diperlukan 5.xml : Berisi informasi mengenai aplikasi. Pada struktur tersebut kita temui ada folder-folder dan file berikut :  src  gen  assets : Folder yang berisi source code aplikasi Android. RESOURCE APLIKASI Objek konstanta string dan gambar yang digunakan oleh aplikasi sebaiknya dipisahkan dengan bagian source code. string. Kita akan bahas lebih lanjut mengenai resource aplikasi pada bagian selanjutnya. file yang ada di folder assets tidak akan dibuatkan ID untuk mengaksesnya dan akan dimasukkan dalam file APK hasil build tanpa dimodifikasi/dikompilasi.4. dan sebagainya. Tujuannya adalah untuk memudahkan pengelolaan dan apabila diperlukan perubahan isinya cukup mengganti di satu bagian saja. Selain itu menggunakan resource. aplikasi bisa secara otomatis memilih resource mana yang harus digunakan berdasarkan konfigurasi perangkat saat aplikasi dijalankan. Untuk resource yang sifatnya bukan Membuat Aplikasi Android – Andry<andrymail@gmail. : Di folder ini kita menaruh resource aplikasi yang berupa gambar.

Di dalam folder res. kita gunakan nama-nama berikut :  arrays. misalnya : R. integer. dll) Berisi file XML untuk resource warna File bitmap (PNG. translate. dan sebagainya) Membuat Aplikasi Android – Andry<andrymail@gmail.xml untuk string values  styles.xml untuk color values  dimens.xml untuk dimension values  strings. file resource dipisahkan berdasarkan jenisnya.<resource_type>. JPG.xml untuk resource arrays  colors.xml untuk styles File xml lain. seperti file konfigurasi XML layout/ menu/ raw/ values/ xml/ Untuk mengakses resource di folder res. rotate.<resource_name>  <package_name> merupakan nama package tempat resource berada (elemen ini tidak diperlukan apabila kita mengakses resource di package yang sama dengan package aplikasimu). dan warna.string. Untuk membaca isi file ini digunakan InputStream. warna.app_name string adalah jenis resourcenya. kita menggunakan kelas R yang dibuat secara otomatis oleh Android Asset Packaging Tool (aapt) dari ADT Android setiap kali kita mengubah isi folder res. dan app_name adalah nama resource yang diacu Struktur sintaks untuk mengakses resource dari kode adalah sebagai berikut : [<package_name>.  <resource_type> merupakan sub class R untuk resource type.]R.com> . Context Menu atau Sub Menu) File tipe lain yang disimpan secara mentah.  <resource_name> bisa merupakan nama file resource tanpa ekstensi file atau nilai atribut android:name di elemen XML-mu (untuk string. Ada sebuah konvensi penamaan file di direktori values berdasarkan tipenya. GIF) atau file XML yang dikompilasi menjadi subtipe resource drawable berikut :  File bitmap  Nine-Patches (resizable bitmap)  State lists  Shapes  Animation drawables. kita taruh file tersebut di folder assets/ Berisi file XML untuk nilai string.file biner. biasa resource disimpan dalam struktur file XML. Ada dua cara untuk mengakses sebuah resource :  Dari kode : menggunakan bilangan integer static dari sub-class kelas R. etc Berisi file XML yang mendefinisikan UI layout Berisi file XML yang mendefinisikan item menu aplikasi (Options Menu. Jika kita membutuhkan salah satu dari kedua hal tersebut. Kita menaruh file di sini apabila kita tidak memerlukan nama file asli dan struktur direktorinya. Adapun struktur direktori di dalam folder res adalah sebagai berikut : Nama Direktori anim/ color/ drawable/ Jenis Resource Berisi file XML untuk animasi (alpha.

fr. misalkan drawable-port-hdpi/. es. bahasa dan regional (en. orientasi layar (port dan land). database SQLite. Service Service adalah komponen aplikasi yang berjalan background untuk menjalankan proses yang memakan waktu cukup lama. antara lain kepadatan resolusi layar (ldip. Ada banyak config_qualifier untuk konfigurasi yang bisa digunakan dalam Android. ukuran layar (small. Keempat tipe komponen aplikasi tersebut adalah : 1. Content Provider Content Provider mengelola sekumpulan data yang sifatnya shared. terdapat folder drawable-hdpi. maka resource drawable di folder drawable-hdpi yang akan digunakan oleh aplikasi. Datanya sendiri dapat disimpan di file system. KOMPONEN APLIKASI Ada 4 macam komponen aplikasi yang merupakan titik masuk di mana aplikasi Android bisa berjalan. dan seterusnya untuk resolusi Low DPI dan Medium DPI. dan sebagainya. mdpi. normal. id. di penyimpanan online atau lokasi penyimpanan persisten lainnya. in). large. dan app_name adalah nama resource yang diacu Struktur sintaks untuk mengakses resource dari XML adalah sebagai berikut : @[<package_name>:]<resource_type>/<resource_name>  <package_name> merupakan nama package tempat resource berada (elemen ini tidak diperlukan apabila kita mengakses resource di package yang sama dengan package aplikasimu). drawable-ldpi. Jadi apabila aplikasi Android digunakan di perangkat yang resolusinya adalah High DPI. Hal tersebut gunanya adalah untuk mendukung berbagai macam konfigurasi perangkat yang berbeda. Keempat komponen tersebut memiliki fungsi dan daur hidup yang berbeda yang menentukan bagaimana masing-masing komponen dibuat dan dihancurkan. hdpi). Sistem Operasi Android akan secara otomatis memilih resource yang tepat untuk menjalankan aplikasi tanpa perlu kita atur secara manual dari dalam aplikasi. 3. dan sebagainya) Jika kita perhatikan pada gambar struktur project aplikasi Android di atas. Adapun format nama direktori untuk resource alternatif ini adalah sebagai berikut : <resources_name>-<config_qualifier>. kita lihat bahwa folder resource drawable. Service tidak memiliki tampilan. 2. 6. Dalam satu folder. dan <config_qualifier> adalah nama yang menspesifikasikan konfigurasi yang akan menggunakan resource di dalamnya. Dengan Membuat Aplikasi Android – Andry<andrymail@gmail. dan drawable-mdpi.com> . di mana <resources_name> nama default folder resource seperti yang sudah dijelaskan sebelumnya. Dari XML : menggunakan sintaks XML khusus misalkan : @string/app_name string adalah jenis resourcenya.  <resource_type> merupakan sub class R untuk resource type. Activity Activity adalah komponen aplikasi yang menyediakan layar/jendela di mana pengguna bisa berinteraksi untuk menjalankan fungsi tertentu. warna. xlarge).  <resource_name> bisa merupakan nama file resource tanpa ekstensi file atau nilai atribut android:name di elemen XML-mu (untuk string. kita bisa menspesifikasikan lebih dari satu config_qualifier dalam satu folder resource untuk konfigurasi perangkat yang lebih spesifik.

data kontak. ada SMS atau telepon masuk. adanya Content Provider ini.com> . SMS. aplikasi lain dapat mengakses data yang diperlukan tanpa perlu mengetahui bagaimana data tersebut disimpan. Kita akan bahas lebih lanjut mengenai Activity karena ini merupakan komponen aplikasi yang paling umum dan yang memiliki tampilan di mana pengguna bisa berinteraksi dengan aplikasi kita. misalkan content provider log panggilan telepon.4. dan sebagainya. Broadcast Receiver Broadcast Receiver adalah komponen aplikasi yang menanggapi system-wide broadcast announcements. Contoh broadcast yang dikirimkan oleh sistem operasi Android misalkan notifikasi ada aplikasi baru terinstall/terupdate. booting sistem operasi selesai. tapi dia dapat menjalankan suatu Activity atau menampilkan notifikasi di Notification Bar. dan sebagainya. Sistem operasi Android sendiri secara default menyediakan sejumlah content provider yang datanya dapat diakses oleh aplikasi lain. Membuat Aplikasi Android – Andry<andrymail@gmail. layar mati. Broadcast Receiver juga tidak memiliki tampilan. Untuk mengakses suatu content provider digunakan string URI sesuai dengan yang dispesifikasikan oleh Content Provider penyedia data.

// The activity is about to be destroyed. } } Membuat Aplikasi Android – Andry<andrymail@gmail. // Another activity is taking focus (this activity is about to be "paused"). Activity yang di-pause ini tidak langsung di-destroy. public class ExampleActivity extends Activity { @Override public void onCreate(Bundle savedInstanceState) { super. Selanjutnya ada satu method lain yang cukup penting untuk diimplementasikan. // The activity is about to become visible. yaitu onPause. maka kode yang berada di dalam method onCreate akan dieksekusi. } @Override protected void onStart() { super.onStart(). misalkan untuk aplikasi email kita perlu menyimpan data email yang sedang diketikkan sebagai Draft email. // The activity is no longer visible (it is now "stopped") } @Override protected void onDestroy() { super. Di sini kita harus menyimpan data-data persistent yang mungkin diperlukan saat Activity tersebut dijalankan lagi.onDestroy().Gambar di atas merupakan skema lifecycle dari sebuah Activity. // The activity is being created. } @Override protected void onStop() { super. // The activity has become visible (it is now "resumed"). } @Override protected void onPause() { super.onResume().onPause().onCreate(savedInstanceState). yang akan dipanggil apabila ada Activity lain yang dijalankan menggantikan Activity tersebut. } @Override protected void onResume() { super. karena ada kemungkinan pengguna akan kembali lagi ke Activity ini misalkan dengan menekan tombol BACK dari Activity yang baru dijalankan atau karena event lain. kita perlu menyimpan data-data yang diperlukan saat method onPause ini dipanggil. Secara lengkap apabila kita akan mengimplementasikan kode untuk setiap perubahan state Activity maka struktur kerangka kode untuk Activity tersebut adalah seperti di bawah ini. Apabila sebuah Activity dipanggil.onStop(). Di sini biasa kita menaruh kode untuk menginisialisasi tampilan dan variabel lain yang diperlukan oleh activity tersebut. Namun jika pengguna tidak pernah kembali lagi ke Activity tersebut.com> . Karena itulah. sistem operasi Android bisa sewaktu-waktu men-destroy Activity tersebut misal apabila ada aplikasi lain yang membutuhkan memori tambahan atau membutuhkan resource lain untuk digunakan.

silakan pilih versi Build Target sesuai dengan platform Android yang tersedia di komputer Anda. serta kita memisahkan antara bagian tampilan dengan bagian pemrosesan dari aplikasi. Sangat disarankan untuk menggunakan metode file XML layout agar kode Java kita lebih bersih dan rapi. K OM P ON EN T AMP IL AN D AN L AYOUT Kita akan mempelajari penggunaan berbagai macam komponen tampilan dan layout dengan membuat sebuah project aplikasi Android. Gambar di bawah ini adalah tampilan Visual Layout Editor di Eclipse yang akan muncul saat kita membuka file XML layout. lalu klik Finish. Untuk membuat tampilan kita bisa membuatnya dengan menggunakan kode di file Java yang kita buat. atau menggunakan file XML layout. File XML layout ini disimpan di folder res/layout/ pada project Android kita. Membuat Aplikasi Android – Andry<andrymail@gmail. pada ADT terdapat tool bernama Visual Layout Editor yang memudahkan kita melihat dan membuat tampilan secara WYSIWYG (What You See Is What You Get) tanpa secara manual mengetikkan dokumen XML. Untuk membuat dan memodifikasi resource XML layout. A. MEMBUAT KOMPONEN TAMPILAN APLIKASI ANDROID Sekarang kita akan mempelajari bagaimana membuat tampilan untuk aplikasi Android kita. Buat sebuah project Android di Eclipse bernama Training. Isikan form New Android Project seperti gambar di bawah ini.7. Dengan menggunakan tools ini kita bisa menggunakan mekanisme Drag-and-Drop untuk menambahkan komponen tampilan yang kita butuhkan.com> . Langkah-langkahnya adalah sebagai berikut : 1.

xml kemudian tambahkan nilai string berikut <?xml version="1. Buka file res/values/strings.0" encoding="utf-8"?> <resources> <string name="hello">Hello World. HelloAndroid!</string> <string name="app_name">Training</string> <string name="submit_label">Submit</string> <string name="exit_label">Exit</string> <string name="edit_text_hint">Input your name here</string> <string name="agree_label">I Agree the Terms and Conditions</string> <string name="male_label">Male</string> <string name="female_label">Female</string> <string name="sex_title">Pick Your Sex</string> <string name="education_label">Last education</string> </resources> Membuat Aplikasi Android – Andry<andrymail@gmail.2.com> .

baru kita isikan nama resource dan nilainya seperti pada gambar di bawah ini. atau pada mode tab Resource di bawah jendela editor Eclipse kita tekan tombol Add kemudian kita pilih String dari jendela daftar tipe resource yang muncul. Buat file colors. 5.com> .xml kemudian tambahkan satu value bertipe Color seperti cara menambahkan string resource di atas.xml yang ada di bawah jendela editor Eclipse. dan values-nya adalah #0000FF Buat file res/values/arrays.xml di dalam folder res/values. 3. Bachelor. High School.xml seperti pembuatan file colors.xml di atas. beri nama itemnya blue. Tambahkan beberapa Item Elementary School. Membuat Aplikasi Android – Andry<andrymail@gmail. kemudian tekan lagi tombol Add saat item education_options tersorot.Cara menambahkannya Anda dapat mengetikkannya secara manual dengan mengaktifkan tab strings. Buka file res/values/colors. caranya klik kanan item folder tersebut kemudian pilih menu New>Android XML File dan isikan nama file seperti gambar di bawah ini 4. kemudian tambahkan item bertipe String Array bernama education_options.

Buka file res/layout/main. Apabila kita lihat tab arrays. Adapun hasil akhir dari tampilan aplikasi yang akan kita buat adalah seperti gambar berikut.xml. Membuat Aplikasi Android – Andry<andrymail@gmail. Sekarang kita akan membuat tampilan aplikasi kita.0" encoding="utf-8"?> <resources> <string-array name="education_options"> <item>Elementary School</item> <item>High School</item> <item>Bachelor</item> <item>Master</item> <item>Doctoral</item> </string-array> </resources> 6. maka isi file tersebut adalah sebagai berikut. <?xml version="1.xml yang dibuat oleh Eclipse dari proses pembuatan project aplikasi Android. dan Doctor sebagai sub-item dari education_options sehingga tampilan editor seperti gambar di bawah ini.Master.com> .

Untuk membuat tampilan tersebut akan digunakan komponen TextView. Spinner. CheckBox.android. <?xml version="1. EditText. Di situ juga akan ditunjukkan penggunaan LinearLayout dan FrameLayout untuk mengatur posisi komponen.com/apk/res/android" android:orientation="vertical" android:layout_width="fill_parent" android:layout_height="fill_parent"> <TextView android:layout_width="fill_parent" android:layout_height="wrap_content" android:text="@string/hello" android:textStyle="bold" android:textSize="18dp" android:textColor="@android:color/white" android:background="@color/blue"/> Membuat Aplikasi Android – Andry<andrymail@gmail.xml adalah sebagai berikut. RadioButton. RadioGroup. Adapun isi file main. dan ImageView.com> .0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.

<EditText android:id="@+id/editName" android:layout_height="wrap_content" android:layout_width="match_parent" android:hint="@string/edit_text_hint"></EditText> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:text="@string/sex_title" android:textSize="17dp"></TextView> <RadioGroup android:layout_width="wrap_content" android:layout_height="wrap_content" android:id="@+id/radioGroupSex"> <RadioButton android:layout_width="wrap_content" android:layout_height="wrap_content" android:checked="true" android:id="@+id/radioMale" android:text="@string/male_label"></RadioButton> <RadioButton android:layout_width="wrap_content" android:layout_height="wrap_content" android:id="@+id/radioFemale" android:text="@string/female_label"></RadioButton> </RadioGroup> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:textSize="17dp" android:text="@string/education_label"></TextView> <Spinner android:layout_height="wrap_content" android:layout_width="match_parent" android:id="@+id/spinnerEducation" android:entries="@array/education_options"></Spinner> <CheckBox android:layout_height="wrap_content" android:layout_width="wrap_content" android:id="@+id/checkBoxAgree" android:text="@string/agree_label"></CheckBox> <LinearLayout android:layout_height="wrap_content" android:layout_width="fill_parent" android:orientation="horizontal" android:gravity="center_horizontal"> <Button android:layout_height="wrap_content" android:text="@string/submit_label" Membuat Aplikasi Android – Andry<andrymail@gmail.com> .

com> .android:layout_width="100dp" android:id="@+id/buttonSubmit"></Button> <Button android:layout_height="wrap_content" android:text="@string/exit_label" android:layout_width="100dp" android:id="@+id/buttonExit"></Button> </LinearLayout> <FrameLayout android:layout_width="match_parent" android:id="@+id/frameLayout1" android:layout_height="fill_parent"> <ImageView android:layout_height="wrap_content" android:layout_width="wrap_content" android:id="@+id/imageView1" android:src="@drawable/icon"></ImageView> <ImageView android:layout_height="wrap_content" android:layout_width="wrap_content" android:id="@+id/imageView2" android:src="@drawable/icon" android:layout_gravity="center"></ImageView> <ImageView android:layout_height="wrap_content" android:layout_width="wrap_content" android:id="@+id/imageView3" android:src="@drawable/icon" android:layout_gravity="bottom|right"></ImageView> </FrameLayout> </LinearLayout> Atau jika kita lihat di jendela Outline di sebelah kanan jendela Visual Layout Editor kita akan melihat struktur tree seperti gambar di bawah ini Membuat Aplikasi Android – Andry<andrymail@gmail.

Untuk data pilihan yang bisa dipilih oleh pengguna. dan kita gunakan atribut Hint untuk memberikan penjelasan kepada pengguna mengenai apa yang harus dimasukkan untuk isian ini. Kita supply ID array tersebut pada nilai atribut Entries dari elemen ini. dan latar belakang TextView tersebut diberi warna biru dengan mengakses nilai resource color bernama blue  Elemen selanjutnya adalah sebuah EditText yang kita beri nama editName.  Selanjutnya ada elemen RadioGroup dan RadioButton.  Elemen Spinner biasa juga dikenal sebagai komponen Combo Box pada platform lain. Hint ini akan tampil apabila isian EditText ini masih kosong. Membuat Aplikasi Android – Andry<andrymail@gmail. Di sini ditunjukkan pula alternatif nilai Layout width selain wrap_content. fill_parent. atau match_parent yaitu menggunakan nilai ukuran yang fix. artinya elemen anak ke-n+1 akan berada di bawah elemen ke-n  Elemen anak pertama dari LinearLayout itu adalah sebuah TextView.Adapun penjelasan dari masing-masing komponen di atas adalah sebagai berikut :  Pada elemen paling atas terdapat sebuah LinearLayout yang kita set orientasinya adalah vertical. dengan label kita mengacu resource string bernama hello. kita gunakan resource array bernama education_options yang sudah kita buat pada langkah ke-5 di atas. Apabila kita ingin memberikan nilai awal untuk isian EditText.  Sebagai anak dari LinearLayout dengan orientasi horizontal di atas kita tambahkan dua buah Button. kedua elemen ini saling berkaitan di mana sebuah RadioGroup itu akan memiliki satu atau lebih RadioButton yang hanya ada satu elemen RadioButton tersebut yang nilai Checked nya adalah true dalam suatu waktu. Agar posisi elemen anaknya terletak di tengah kita set atribut Gravity bernilai center_horizontal dan Layout width bernilai fill_parent atau match_parent. ada dua atribut yang perlu diketahui. dengan ukuran font 18dp (density-independent pixel). Untuk mengatur label dari Button ini kita set nilai atribut Text. maka kita isikan nilai teks awal tersebut di atribut Text dari EditText. yaitu Text untuk mengatur teks di sebelah tanda centang dan Checked untuk mengatur nilai checkbox apakah tercentang atau tidak  LinearLayout dengan orientasi horizontal. Untuk styling teksnya. yang artinya elemen anak ke-n+1 akan berada di kanan elemen ke-n.  Elemen CheckBox.com> . digunakan style bold.

yang kita set nilai Layout gravity nya bernilai left.View. Hasilnya akan seperti gambar di bawah ini. pengaturan posisi komponennya dikendalikan oleh masing-masing komponen anaknya. package com.app.  Layout terakhir yang digunakan adalah FrameLayout. import android.Activity. B.os.EditText. Di situ kita bisa lihat ada tiga komponen yang menjadi anak dari FrameLayout yang berupa komponen ImageView. import android.view. import android. import android.widget.training.widget.7. Untuk itu kita pergunakan method findViewById() yang ada dimiliki oleh kelas Activity atau kelas View. yaitu dengan mengatur nilai atribut Layout gravity. Untuk FrameLayout.view. dan bottom|right. M E N GAKSES K OM P ON EN T AM P ILAN D ARI K ODE Untuk dapat memproses ataupun memodifikasi isi tampilan saat runtime. Silakan coba jalankan aplikasi yang kita buat di atas di emulator.Button. import android. Membuat Aplikasi Android – Andry<andrymail@gmail.widget. import android.java di folder src dan ubah isinya seperti kode di bawah ini. import android.Bundle.android.CheckBox.com> .View.OnClickListener. maka kita perlu cara untuk mengakses komponen tersebut dari kode Java di aplikasi kita. center. Buka file HelloAndroid.

= (CheckBox) findViewById(R.main).id.id. btnExit = (Button) findViewById(R. btnExit.id.id. btnSubmit.widget.layout. public class HelloAndroid extends Activity implements OnClickListener { /** Called when the activity is first created. = (RadioGroup) findViewById(R. = (Button) findViewById(R.buttonExit). @Override public void onCreate(Bundle savedInstanceState) { super.widget.com> .Spinner. private Button private Button btnSubmit.buttonExit) { } } } Pada kode di atas juga ditunjukkan cara untuk menangani event penekanan tombol. editName radioSexSelector spinnerEducation checkAgree btnSubmit = (EditText) findViewById(R.checkBoxAgree).buttonSubmit) { } else if (viewId == R.id. Membuat Aplikasi Android – Andry<andrymail@gmail. if (viewId == R. spinnerEducation.getId().radioGroupSex).RadioGroup. */ private EditText private RadioGroup private Spinner editName. = (Spinner) findViewById(R. private CheckBox checkAgree.id.spinnerEducation).editName). setContentView(R.id. import android. btnSubmit. radioSexSelector.setOnClickListener(this).buttonSubmit). } public void onClick(View v) { int viewId = v.setOnClickListener(this).id.onCreate(savedInstanceState).import android.

public void onClick(View v) { int viewId = v.id. } else if (viewId == R. } Tambahkan pula baris di bawah ini di bagian import lalu coba jalankan lagi kode kita di emulator dan tekan tombol Submit atau Exit untuk melihat hasil Toast yang dibuat.makeText(this. Toast.getId().LENGTH_LONG).show().buttonExit) { t = Toast.id. Toast. T OAST Untuk menampilkan pesan informasi singkat kepada pengguna di Android dapat digunakan Toast. } if (t != null) t. yang bentuknya menyerupai sebuah baloon text seperti gambar berikut.makeText(this.Toast.buttonSubmit) { t = Toast. "This is Toast :\nButton Submit Pressed". "This is Toast :\nButton Exit Pressed".java pada bagian method onClick sehingga isinya menjadi seperti di bawah ini. Toast t = null.com> .LENGTH_LONG).C. Cara membuat Toast bisa dilihat pada kode di bawah. import android.widget. if (viewId == R. Kita akan ubah isi file HelloAndroid. Membuat Aplikasi Android – Andry<andrymail@gmail.

Contohnya. import android.content.AlertDialog. Kita kembali akan memodifikasi method onClick sehingga menjadi seperti kode di bawah ini.OnClickListener() { public void onClick(DialogInterface dialog. public void onClick(View v) { int viewId = v. t.setNegativeButton("No". import android.makeText(this. maka akan muncul Dialog konfirmasi seperti gambar di bawah ini. builder. if (viewId == R. Selanjutkan jalankan lagi aplikasi kita. null). builder. import android. AlertDialog dialog = builder.app.buttonSubmit) { Toast t = Toast.app. "This is Toast :\nButton Submit Pressed". builder.setPositiveButton("Yes".setMessage("Exit from application?"). } } Tambahkan pula import kelas-kelas berikut di bagian import kelas HelloActivity. Silakan coba memilih menekan tombol Yes atau No dari jendela dialog tersebut.id.show().buttonExit) { Builder builder = new Builder(this). di Android kita juga bisa menampilkan jendela Dialog terutama apabila untuk keperluan konfirmasi aksi yang akan dilakukan atau menampilkan pesan kesalahan yang sifatnya fatal.LENGTH_LONG).D. Toast.id.getId().com> . new DialogInterface. destroy this activity now finish(). int which) { // User give exit confirmation. Membuat Aplikasi Android – Andry<andrymail@gmail. dan coba tekan tombol Exit.DialogInterface. } else if (viewId == R. dialog.Builder.create().AlertDialog. D IAL OG Selain Toast. kita akan membuat dialog konfirmasi keluar dari aplikasi saat pengguna menekan tombol Exit.show(). } }).

radioFemale) { sex = "Female".E. pada aplikasi yang menerima masukan dari pengguna tentu kita perlu untuk membaca data hasil masukan tersebut. M E MB A CA N ILAI M ASUK AN D ARI P EN GGUN A Kita telah membuat sebuah form yang menerima masukan dari pengguna. // CheckBox checked value Membuat Aplikasi Android – Andry<andrymail@gmail.id.toString(). Kembali kita modifikasi method onClick sehingga isinya menjadi seperti berikut. String sex = "Unknown". public void onClick(View v) { int viewId = v.getId(). Berikut akan ditunjukkan bagaimana hal tersebut dapat dilakukan. } // Selected Spinner value String lastEducation = spinnerEducation.getText(). if (selectedSexRadioButtonId == R.getSelectedItem(). if (viewId == R. // Selected RadioButton value int selectedSexRadioButtonId = radioSexSelector.buttonSubmit) { // EditText Name value String name = editName.com> . Kita akan membaca data masukan saat pengguna menekan tombol Submit kemudian kita akan tampilkan hasil bacaan tersebut dalam Toast. } else if (selectedSexRadioButtonId == R.radioMale) { sex = "Male".getCheckedRadioButtonId().id.id.toString().

destroy this activity now finish().setNegativeButton("No". dialog. } }). F. builder.buttonExit) { Builder builder = new Builder(this). } else if (viewId == R. toastMessage. null).boolean isAgreeChecked = checkAgree.isChecked(). M E MAN GGIL A CTIVITY L AIN DAN P ASSING V ARIAB LE A N T AR A C TIVITY Membuat Aplikasi Android – Andry<andrymail@gmail.setPositiveButton("Yes".show().show(). builder. int which) { // User give exit confirmation. builder. } } Contoh hasil pengisian data dan hasilnya saat kita menekan tombol Submit adalah seperti gambar berikut.LENGTH_LONG). new DialogInterface.com> .OnClickListener() { public void onClick(DialogInterface dialog.id.setMessage("Exit from application?"). // Show input data using Toast String toastMessage = "Input values :\n" + "Name = " + name + "\n" + "Sex = " + sex+ "\n" + "Last education = " + lastEducation + "\n" + "Is Agree = " + isAgreeChecked. t. AlertDialog dialog = builder.create(). Toast.makeText(this. Toast t = Toast.

2. = "agree".Sebuah aplikasi Android biasa terdiri dari beberapa Activity yang dipanggil berdasarkan aksi yang akan dilakukan pengguna. public void onClick(View v) { Membuat Aplikasi Android – Andry<andrymail@gmail. Langkah-langkahnya adalah sebagai berikut : 1. Pada jendela New Java Class isikan data seperti pada gambar di bawah ini dan setelah selesai tekan tombol Finish. Kembali kita modifikasi isi method onClick dari kelas HelloAndroid pada bagian penanganan tombol Submit sehingga menjadi seperti berikut. . Di folder src kita buat sebuah kelas Activity baru yang kita namakan ResultActivity.training. Caranya adalah dari nama package com. = "education". 3.android kita klik kanan kemudian pilih New>Class. maka kita akan mengirimkan data hasil bacaan masukan pengguna untuk ditampilkan nilainya pada Activity kedua.. Kita kembali lagi ke kelas HelloAndroid kemudian tambahkan konstanta berikut di bawah baris deklarasi nama kelas HelloAndroid public class HelloAndroid extends Activity implements OnClickListener { public static final String NAME_INPUT_KEY public static final String SEX_INPUT_KEY public static final String EDUCATION_INPUT_KEY public static final String AGREE_INPUT_KEY = "name". Untuk menjalankan suatu Activity digunakan method startActivity dari kelas Context.com> . Untuk menunjukkan proses ini.. = "sex".

builder.com> .create().buttonSubmit) { // EditText Name value String name = editName. if (selectedSexRadioButtonId == R. i.id. // Selected RadioButton value int selectedSexRadioButtonId = radioSexSelector. i.getCheckedRadioButtonId(). isAgreeChecked). } // Selected Spinner value String lastEducation = spinnerEducation.putExtra(NAME_INPUT_KEY. new DialogInterface.putExtra(SEX_INPUT_KEY.putExtra(EDUCATION_INPUT_KEY. int which) { // User give exit confirmation. // CheckBox checked value boolean isAgreeChecked = checkAgree.setMessage("Exit from application?").putExtra(AGREE_INPUT_KEY. String sex = "Unknown".setPositiveButton("Yes".toString().getId().id.show(). } else if (selectedSexRadioButtonId == R.buttonExit) { Builder builder = new Builder(this). null).id. startActivity(i).isChecked(). builder. AlertDialog dialog = builder.getSelectedItem(). ResultActivity.int viewId = v. i.OnClickListener() { public void onClick(DialogInterface dialog.toString(). name). kemudian diganti dengan membentuk objek Intent.radioFemale) { sex = "Female". // Start new activity to display input data Intent i = new Intent(this. lastEducation). builder.id. if (viewId == R. menaruh variabel yang akan Membuat Aplikasi Android – Andry<andrymail@gmail. i.class). } else if (viewId == R. } }). dialog. sex). destroy this activity now finish(). } } Bagian yang berubah adalah kita menghapus bagian yang menginisialisasi String toastMessage dan membuat Toast.getText().setNegativeButton("No".radioMale) { sex = "Male".

Pada bagian import juga perlu kita tambahkan baris berikut.dikirimkan dan memanggil method startActivity. Coba jalankan lagi aplikasi tersebut di emulator.TextView.app.os. package com.SEX_INPUT_KEY). isikan field-field masukan dan tekan tombol Submit Membuat Aplikasi Android – Andry<andrymail@gmail. String name = extras.EDUCATION_INPUT_KEY).setText(textviewLabel).getExtras(). import android. import android.getString(HelloAndroid. TextView tv = new TextView(this). Bundle extras = getIntent().com> . } } 5.AlertDialog.AGREE_INPUT_KEY).Bundle.training. public class ResultActivity extends Activity { @Override protected void onCreate(Bundle savedInstanceState) { super. String textviewLabel = "Input values :\n" + "Name = " + name + "\n" + "Sex = " + sex+ "\n" + "Last education = " + education + "\n" + "Is Agree = " + isAgree.widget.getString(HelloAndroid. 4.app. boolean isAgree = extras. Kita buka kelas ResultActivity yang tadi sudah kita persiapkan. setContentView(tv).Activity. import android.NAME_INPUT_KEY).getString(HelloAndroid. import android. String sex = extras.android.getBoolean(HelloAndroid. tv. kemudian tambahkan method onCreate beserta isinya seperti kode di bawah ini.onCreate(savedInstanceState). String education = extras.

Penyebab error tersebut adalah karena kelas ResultActivity belum didaftarkan di file AndroidManifest. Untuk memperbaiki kesalahan ini kita buka file AndroidManifest. Membuat Aplikasi Android – Andry<andrymail@gmail. sehingga aplikasi tidak mengenali pemanggilan Activity tersebut. 8. kemudian pada tab Application kita lihat bagian Application Nodes di bawah.xml.com> .6.xml. Hasilnya akan aplikasi kita akan langsung keluar dan menampilkan pesan Force Close seperti gambar berikut 7.

dan akan tampil halaman seperti gambar berikut. Kita bisa mengetikkan manual nama kelas activity kita pada EditText yang tersedia atau dengan menekan tombol Browse di sebelah kanan EditText Name lalu mengetikkan beberapa huruf awal dari nama activity yang akan kita tambahkan lalu kita pilih dari hasil filtering yang muncul. Kali ini aplikasi kita tidak mengalami Force Close.xml. Tekan tombol Add. kemudian pilih Activity. Akan muncul field-field baru di bagian kanan bawah seperti gambar berikut. Membuat Aplikasi Android – Andry<andrymail@gmail.com> . 10. Selesai ketikkan Ctrl+S untuk menyimpan perubahan pada file AndroidManifest. kemudian ulangi pengisian nilai field-field yang ada dan diakhiri dengan menekan tombol Submit. Kemudian kita isikan field Name dengan nama activity kedua kita.9. Coba jalankan lagi aplikasi ini di emulator. yaitu ResultActivity.

untuk belajar lebih lanjut dapat digunakan file dokumentasi yang bisa diunduh dari http://developer.Demikianlah dasar pembuatan aplikasi Android. Membuat Aplikasi Android – Andry<andrymail@gmail.android.com> . Semoga dengan training singkat ini semakin banyak karya-karya dari developer di Indonesia yang meramaikan Android Market. serta dokumentasi API library Android. tips dan trik pembuatan aplikasi. Di situ terdapat lebih banyak resource pembelajaran mengenai macam-macam komponen tampilan.com.