PEMROGRAMAN MOBILE “TUTORIAL MEMBUAT APLIKASI ANDROID”
Disusun oleh :
CYNTHIA STEFFI CLIFF 12.12.0037 SI 12 A http://cliffnewbie.wordpress.com/
SEKOLAH TINGGI MANAJEMEN INFORMATIKA DAN KOMPUTER AMIKOM PURWOKERTO Jl. Let. Jend. Pol. Sumarto, Purwokerto Utara Tahun Akademik 2012
TUTORIAL MEMBUAT APLIKASI ANDROID ECLIPSE
A. Landasan Teori 1. Pengertian Eclipse Eclipse adalah sebuah IDE (Integrated Development Environment) untuk mengembangkan perangkat lunak dan dapat dijalankan di semua platform
(platform-independent).
Sifat-sifat
dari
eclipse
dapat
diketahui sebagai berikut : a. Multi-platform: Target sistem operasi Eclipse adalah Microsoft Windows, Linux, Solaris, AIX, HP-UX dan Mac OS X. b. Mulit-language:
Eclipse
dikembangkan
dengan
bahasa
pemrograman Java, akan tetapi Eclipse mendukung pengembangan aplikasi berbasis bahasa pemrograman lainnya, seperti C/C++, Cobol, Python, Perl, dan PHP c. Multi-role: Selain sebagai IDE untuk pengembangan aplikasi, Eclipse pun bisa digunakan untuk aktivitas dalam siklus pengembangan
perangkat
lunak,
seperti
dokumentasi,
test
perangkat lunak, dan pengembangan web.
2. Pengertian SDK Android SDK (Software Development Kit). SDK adalah suatu tools dan API yang diperlukan untuk mengembangkan aplikasi pada platform atau
linkungan
Android.
Pengembangan
aplikasi
Android
menggunakan bahasa pemrograman Java. Seperti kita ketahui, SDK
ini dikembangkan oleh OHA (Open Handsate Alliance).
Organisasi OHA ini terdiri atas Googl, Intel, Motorola, Qualcomm, TMobile, dan NVIDIA.
3. Resources Dalam project Android, kita juga akan menjumpai direktori res/ yang memuat “sumber-sumber” (file tetap seperti gambar yang
dikemas bersama dengan aplikasi). Beberapa sub direktori yang akan dijumpai atau dibuat di bawah direktori res/ terdiri dari: a. res/drawable/ untuk gambar (PNG, JPEG, etc) b. res/layout/ untuk spesifikasi UI layout yang dibuat dengan XML c. res/raw/ for general-purpose files (misalnya CSV File of Account Information) d. res/values/ untuk menyimpan nilai strings, dimensions dan sejenisnya e. res/xml/ for other general purpose XML Files you wish to ship
B. Tutorial Membuat Aplikasi Sederhana 1. Tutorial Membuat Project Android Sederhana Sebelum melakukan proses pembuatan project android sederhana, istall terlebih dahulu “jdk” pada laptop apabila sudah diinstall langsung saja klik “sdk manager” kemudian setelah ini baru klik aplikasi “eclipse”. a. Jalankan program eclipse. Setelah itu, klik File > New > Android Application Project
gambar a
b. Isikan nama aplikasi yang diinginkan dan nama project dari aplikasi tersebut. Untuk package nama secara otomatis telah terisi.
gambar b
c. Setelah di next maka akan dilanjutkan ke tahap berikutnya, yakni tempat dimana project tersebut akakn disimpan.
gambar c
d. Di tahap selajutnya, pilih bentuk icon/ gambar/ ext sesuai dengan keinginan.
gambar d
e. Kemudian dalam tahap selajutnya terdapat tiga pilihan, yakni blank activity, fullscreen activity dan master/ detail flow. Pilihlah yang blank activity.
gambar e
f. Di tahap selajutnya pada blank activity, berilah nama activity sesuai keinginan dan untuk layout name akan secara otomatis mengikuti pada nama activity tersebut.
gambar f
g. Setelah tahap sebelumnya sudah selesai, maka akan dilanjutkan dengan mengkonfirmasi android virtual device manager. Buatlah sebuah device dan beri nama device tersebut yang mana sebelumnya di klik pada icon yang bergambar icon android di handphone. Hal tersebut dapat kita lakukan dengan mengklik pada toolbar pada eclipse. Buatlah nama avd dengan new > create virtual device android. Berilah name, device, dan target sesuai keinginan.
gambar g
h. Setelah membuat avd pada android sudah dibuat maka akan muncul kotak dialog seperti pada gambar berikut. Klik launch maka proses akan dilakukan yakni membuka emulator android.
i. Berikut ini merupakan saat dimana emulator android mengerjakan pertama kali.
j. Lalu tunggu tampilan emulator android, sedikit membutuhkan waktu karena dalam membuka emulator tersebut juga membutuhkan beberapa RAM pada perangat keras hal itu menyebabkan system bekerja lambat. Setelah tampilan emulator home muncul, buka kunci tersebut dan cari project android yang sebelumnya sudah dibuat seperti pada gambar berikut.
k. Kemudian buatlah sebuah program dimana apliksi android tersebut dapat memunculkan “Hello world! (nama pengguna). Dapatdilakukan dengan cara berbagai macam, misal ambil salah satu contoh dengan menambahakan program pada “xml” cara ganti background dan memunculkan text “Hello world!
. Berikut merupakan kode xml pada activity_cliff.
l. Tambahkan kode juga pada color.xml seperti berikut.
m. Tambahkan kode pada string.xml untuk menambahkan tulisan “hello world! . Setelah itu di save all dan jalankan aplikasi tersebut atau bias juga di run.
n. Hasil yang diperoleh seperti berikut. Lihat perubahan warna background dan textnya.
2. Penjelasan Aplikasi Android Sederhana
Untuk memberikan dan menambahkan sebuah kalimat yang tertera seperti hasil gambar yang muncul itu merupakan tambahan dari
kalimat string yang mana sebelumnya sudah muncul dengan kalimat “Hello World!. Kita bisa menambahkannya di kode string.xml seperti yang sebelumnya sudah dijelaskan pada tutorial.
Untuk mengganti background juga sama seperti halnya dengan mengganti pada program java. Buka folder dengan nama res > values > color.xml > tambahkan kode warna. Dapat diambil sebagai contoh seperti berikut.
Tambahkan juga kode pada di xml pada activity_cliff yang mana letak pada folder layout, seperti berikut.
TUTORIAL KALKULATOR ANDROID
A. Landasan Teori 1. Pengertian Aplikasi Mobile Menurut Wikipedia, pengertian aplikasi adalah program yang digunakan orang untuk melakukan sesuatu pada sistem komputer. Mobile dapat diartikan sebagai perpindahan yang mudah dari satu tempat ke tempat yang lain, misalnya telepon mobile berarti bahwa terminal telepon yang dapat berpindah dengan mudah dari satu tempat ke tempat lain tanpa terjadi pemutusan atau terputusnya komunikasi
2. Pengertian Android Menurut Andy Rubin android adalah sistem operasi berbasis Linux yang dipergunakan sebagai pengelola sumber daya perangkat keras, baik untuk ponsel, smartphone dan juga PC tablet. Secara umum Android adalah platform yang terbuka (Open Source)
bagi para
pengembang untuk menciptakan aplikasi mereka sendiri untuk digunakan oleh berbagai piranti bergerak.
3. Resources Dalam project Android, kita juga akan menjumpai direktori res/ yang memuat “sumber-sumber” (file tetap seperti gambar yang dikemas bersama dengan aplikasi). Beberapa sub direktori yang akan dijumpai atau dibuat di bawah direktori res/ terdiri dari: a. res/drawable/ untuk gambar (PNG, JPEG, etc) b. res/layout/ untuk spesifikasi UI layout yang dibuat dengan XML c. res/raw/ for general-purpose files (misalnya CSV File of Account Information) d. res/values/ untuk menyimpan nilai strings, dimensions dan sejenisnya
B. Tutorial Membuat Kalkulator Sederhana Sebelum melakukan proses pembuatan aplikasi kalkulator sederhana, buka program eclipse kemudia pilih letak penyimpanan yang sesuai kita inginkan. a. Buat sebuah nama program apa yang akan kita buat, dalam praktikum ini kita akan membuat program aplikasi kalkulator android. Kemudian klik next.
b. Setelah itu pilih logo untuk aplikasi kalkulator sesuai yang diinginkan.
c. Pilih layar dengan nama “blank activity”. Kemudian beri nama pada activity nama lalu klik next hingga muncul dekstop xml pada eclipse.
d. Pada grapichal layout, ubah background dengan warna sesuai yang diinginkan. Untuk mengubah warnanya bisa digunakan dengan cara ubah pada properties dengan memasukan kode warna lalu enter. Setelah itu buat text kalkulator dengan drag drop pada bagian form widget pilih “large” di drag drop.
e. Setelah itu buat sebuah kotak dengan memilih text field lalu pilih number di drag drop. Klik kanan kotak number (aktifkan) lalu pilih edit id dan beri nama dengan “bil1” dan beri nama dengan klik kanan edit text.
f. Setelah membuat 2 buah text field dengan memilih number dan drag drop yang mana sudah diberi nama dan id dilanjutkan dengan membuat 4 buah button yang mana masing-masing dari button tersebut diberi nama text id sudah kita beri misal, beri nama button1: tambah (+), button2: kurang (-), button3: kali(*), dan button4: bagi(/). Buat juga kode sting dengan cara klik kanan pada button lalu edit id dan new string isilah nama string yang baru sesuai masing-masing nama button.
g. Tambahkan juga pada graphical layout dengan menambahkan number text field yang di drag drop. Beri nama juga dengan klik kanan lalu edit text dan edit id dengan nama ”jumlah”.
h. Buatlah sebuah device android manager untuk aplikasi kalkulator sederhana seperti yang sebelumnya pada praktikum sudah sempat dijelaskan gahap pembuatan device android manager.
i. Buatlah koding pada java dengan klik nama folder kalkulator double klik pada Kalku.java. buatlah koding seperti pada gambar berikut ini. Untuk koding yang paling bawah, lihat pada koding yang diblok itu menandakan bahwa koding tersebut akan lebih baik dihapus karna koding tersebut tidak diperlukan lagi. Berikut ini merupakan koding pada aplikasi android sederhana. Apabila menemukan beberapa error maka klik tanda silang pada baris sebelah kiri dekstop danpilih methodnya maka tidak akan error lagi.
Berikut ini adalah tampilan sebuah aplikasi kalkulator sederhana android.
TUTORIAL MEMBUAT BUTTON
A. Landasan Teori 1. Radio Button Pada Eclipse Radio button dapat digunakan untuk membuat suatu pilihan. Praktikum sekarang akan mempergunakan user interface berupa radio button.
2. Komponen User Interface
Arsitektur UI meliputi Activity dan user interface yang terdiri dari komponen.
Berada di res/layout/filename.xml coding java untuk memanggilnya = R.java
ViewGroup Kumpulan view untuk menentukan tata letak komponen view secara berbeda, c/o: Linear Layout, Relative Layout, Frame Layout & Tabulasi. Atribut View Group: Android :id berisi variabel unik dari element tersebut Android : layout_height Android : Layout_width
View : dikenal sebagai individual UI component
3. Komponen Android Manifest.xml
: atribut package & paket activity
: user permission
: batasan permission
: komponen instrument untuk menguji fungsionalitas package
: element root ->deklarasi aplikasi android
: deklarasi intent yang dibutuhkan oleh aplikasi
: action type yang didukung komponen
: deklarasi kategori
: deklarasi tipe MIME, authority
: meta data yang dibutuhkan sebagai tambahan data
: aplikasi diberikan info sesuatu perubahan, c/o: sms
B. Tutorial Membuat Radio Button Sederhana Sebelum melakukan proses pembuatan radio button sederhana, buka program eclipse kemudia pilih letak penyimpanan yang sesuai kita inginkan. a. Buat sebuah project dengan nama linear. Pilih lambing project tersebut apabila anda menginkannya.
b. Desain sebuah project tersebut ke tab ke grapichal layout. Atur layout pada desain tersebut dengan cara klik kanan pilih change layout pilih linear layout (vertical). Dapat dilihat seperti gambar berikut.
c. Kemudian desainlah sebuah tampilan antar muka pengguna/ user interface. Ketikan kode berikut pada bagian layout activity_main.xml
d. Setelah itu, laukan pada folder src mainactivity.java. Buatlah beberapa kode pada src java tersebut seperti berikut.
e. Kemudian apabila inginmenghilangkan anda merah atau biasa sebut dengan error dapat kita tangani dengan cara klik kalimat yang error lalu pilih letMainActivity implements seperti berikut.
4. Setelah sudah ditangani sintak error maka dilanjutkan dengan menambahkan kode lagi. Berikut merupakan lanjutan kode untuk kode yang sebelumnya sudah diketik.
e. Ini merupakan kode lanjutan setelah mengetik kode yang sebelumnya sudah diketikan.
f. Setelah semua kode sudah diketik dengan benar, save all kode tersebut. Jangan lupa, sebelum menjalankan program tersebut buatlah sebuah device android yang sebelumnya sudah pernah kita pelajari pada praktikum 1. Buatlah device tersebut dengan nama dan ukurannya sesuai yang anda inginkan. Lalu start lunch tunggu emulator menampakan pada dekstp. Apabila sudah, run as application1 program akan muncul pada emulator seperti pada gambar berikut.
TUTORIAL MEMBUAT CHECKBOX & LISTVIEW
A. Landasan Teori 1. Checkbox Pada Eclipse Check Box digunakan untuk pilihan yang isinya berisi yes/no, true/false.
2. User Interface Merupakan segala sesuatu yang dapat dilihat oleh user dan dapat digunkaan oleh user untuk berinteraksi dengan aplikasi tersebut.
3. List View Komponen ListView digunakan untuk menampilkan daftar opsi atau piliahan pada android. list yang ditampilkan dapat di-scroll.
Pada
ListView dapat ditambahkan action, jika kita mengklik atau memilih salah
satu
item
dari
ListView
dapat
menggunakan
setOnItemClickListener
4. Array Adapter Para ArrayAdapter terbatas karena hanya mendukung pemetaan toString() untuk satu tampilan dalam tata letak baris. Untuk mengontrol tugas data dan untuk mendukung beberapa pandangan, Anda harus membuat implementasi adaptor pelanggan Anda. Untuk ini, Anda akan memperpanjang implementasi adaptor ada atau subclass BaseAdapter kelas langsung. ListView menyebut getView() metode pada adaptor untuk setiap elemen data. Dalam metode ini adaptor menciptakan tata letak baris dan memetakan data untuk pandangan dalam tata letak. Ini akar tata letak biasanya ViewGroup dan berisi beberapa lainnya Views , misalnya sebuah ImageView dan TextView . Grafik berikut menunjukkan daftar dengan layout yang berbeda untuk baris ganjil dan genap.
A. Tutorial Membuat CheckBox Sederhana Sebelum melakukan proses pembuatan checkbox sederhana, buka program eclipse kemudian pilih letak penyimpanan yang sesuai kita inginkan. Dalam praktikum ini akan membuat sebuah aplikasi sederhana dengan membuat daftar menu pesanan makanan dan list view tentag list view nama hari. a. Buat project baru dengan file new project android application. Beri nama projek dengan nama CheckBoxSI12A kemudian “next” pilih symbol pada aplikasi yang akan kita buat.
b. Setting pada layout android untuk menambahkan “textlarge” dan “checkbox” dengan cara drag drop. Pilih menu form widget dimana terdapa tbeberapa pilihan seperti text large, checkbox dan listview. Pilih juga “large” untuk memberikan nama misal kita akan membuat nama “Pilihan Menu” lalu atur beri string tersebut dengan cara klik kanan pilih edit text new string beri nama.
c. Setelah itu, beri juga checkbox pada layout dengan cara mendrag drop checkbox sebanyak 3 kali karena di sini kita akan membuat 3 checkbox dengan ketentuan sebagai berikut : checkbox1; nasi goreng (new string; cbnasigoreng), checkbox2; pizza (new string; cbpizza) dan checkbox3; jus alpukat (new string; cbjus).
Berikut ini merupakan salah satu contoh pemberian nama dan string pada Checkbox :
Catatan : Jangan lupa untuk mengatur ID pada setiap “large” dan “checkbox” di sini dalam “large” kita beri ID : txtmenu, lalu checkbox1: cbnasgor, checkbox2: cbpizza dan checkbox3: cbminuman. Kita dapat mengaturnya dengan cara klik kanan pada setiap “large” dan “checkbox” pilih edit ID. Jangan lupa untuk di save all. d. Setelah layout sudah diatur, lalu buka folder “src” kemudian double klik menu MainActivity.java. Buat beberapa koding seperti pada gambar berikut ini.
e. Apabila terdapat error pada “setOnClickListener” sorotkan kalimat tersebut lalu akan muncul beberap pilihan menu dan pilihlah “Let Activity ……….” Di double klik maka aerror akan tertangani. Berikut ini merupakan contoh void di dalam di void. Di situ terdapat (new View.OnClickListener) merupakan isi dari komponen void yang di dalam void, pada kotakan yang berwaran ungu iyu merupakan isi dari (new View.OnClickListener).
f. Lanjutkan membuat program dengan menambahkan if else untuk membuat notifikasi pada daftar menu tersebut. Berikut contoh programnya.
g. Buat device baru dengan cara klik icon gambar hp yang ada androidnya. Pilih ukuran device lalu lunch.
h. Ini merupakan hasil dari run pada emulator android, aplikasi daftar menu paling sederhana. Perhatikan notifikasi saaat kita akan memilih menu pilihan dan tidak memilihnya. Ketika tidak dilipih/ centang.
B. Tutorial Membuat ListView Android Berikut merupakan tahapan dari pembuatan listview sederhana dengan projek nama hari secara sederhana. a. Buatlah projek seperti biasa dengan file new android application project. Beri nama projek seperti berikut.
b. Lalu next hingga muncul perintah memberikan symbol pada projek tersebut. Pilih symbol sesuai apa yang diinginkan seperti berikut.
c. Setelah itu beri nama .xml sesuai keinginan. Apabila tidak diinginkan di next saja.
d. Kemudian buka folder layout dan double klik .xml tersebut. Setelah itu pilih tab pada Graphical Layot. Pilih composite pilih listview drag & drop pada layout atur listview.
e. Setelah itu tambahkan koding pada .java seperti berikut. Tambhakna juga import untuk membuat method baru.
f. Tambahkan juga koding berikut dari lanjutan koding di atas. Di sini menggunakan array karena bentuk dari perulangan.
g. Jangan lupa setelah membuat koding pada .java untuk save all agar tidak terjadi error. Kemudian buatlah device android baru seperti berikut.
h. Berikut ini merupakan hasil project ListViewCliff setelah di run.
TUTORIAL LAYOUT MANAGER
A. Landasan Teori 1. Layout Manager Untuk meletakan komponen (view) pada layar, android menggunakan layout manager. Jenis layout manager: 1. Absolute Layout, 2. Relative Layout, 3. Linear Layout, 4. Table Layout, 5. Frame Layout.
Tiap jenis layout tersebut akan dijelaskan menggunakan contoh program android. Berikut ini penjelasan masing-masing layout tersebut: a) Absolute Layout Absolute
layout
didasarkan
pada
menempatkan masing-masing kontrol
ide
sederhana
pada
posisi
dengan absolut.
Penentuan koordinat x dan y pada layar untuk setiap kontrol.
b) Relative Layout RelativeLayout
mengatur
posisi
secara
relatif
berdasarkan
posisi widget yang lain atau parentnya. Hal ini bisa dibilang tata letak yang rumit , dan kita perlu beberapa properti untuk benarbenar mendapatkan tata letak yang kita inginkan.
c) Linear Layout Tata letak linear mengatur elemen sepanjang garis tunggal. Menentukan apakah garis yang menggunakan android: orientasi.
vertikal
atau
horizontal
d) Table Layout TableLayout meletakan komponen dalam bentuk tabel (baris dan kolom), mirip seperti Table yang digunakan di HTML untuk mengatur layout. Pengguna mendefinisikan baris dengan tag dan secara otomatis sistem mendefinisikan kolomnya. Penentuan bahwa elemen harus menempati lebih dari satu
kolom menggunakan android: layout_span. Hal ini dapat
meningkatkan jumlah total kolom juga, jadi jika kita memiliki baris dengan dua elemen dan setiap elemen memiliki android: layout_span = "3" maka akan memiliki setidaknya enam kolom dalam tabel. Kolom dimulai dari nol.
e) Frame Layout Framelayout digunakan untuk menampilkan satu komponen. Jika ada lebih dari satu widget, bertumpuk. di
dalam
maka
akan
ditampilkan
secara
Kita bisa menambahkan layout lain sebagai child frame
menampilkan
dua
layout.
Contoh
ImageView
untuk
(pastikan
deklarasi file
image
disimpan di direktori : project]/res/drawable-xxhdpi,
berikut telah
B. Tutorial Membuat Layout Manager Sederhana Dapat kita ketahui mengenai layout manager, untuk itu dala penjelasan praktikum mengenai cara membuat layout sebagai berikut. 1. Buka eclipse buat project baru file new application beri nama project next hingga finish.
2. Buat sebuah class java baru pada folder src package di klik kanan class beri nama class tersebut sesuai keinginan dan yang pasti nama jangan terlalu susah karena untuk nama juga pada kode .xml yang akan dibuat juga. Buat class java dengan nama ViewDaftar dan ViewGambar.
3. Setelah itu, ke tab Grapichal Layout untuk mengatur tampilan yang diperlukan. Dengan menambahkan large, button, dan gambar. Atur bagian-bagiantersebut seperti biasa dengan mengatur nama string dan id tersebut. Berikut merupakan contoh dari aturan dari large untuk mengatur nama stringnya.
4. Ini merupakan untuk mengatur id nama pada text atau button yang ingin diberi id dengan cara klik kanan apa yang ingin diberi id.
5. Buatlah kelas .xml baru pada folder layout klik kanan pilih xml
6. Setelah membuat android xml file dengan nama viewdaftar dan viewgambar dilanjutkan dengan mengatur tampilan untuk view daftar. Double klik pada viewdaftar pada viewdaftar.xml untuk mengatur tampilan. Tambahkan beberapa text dan button pada graphical layout dan atur masin-masing tiap text ataupun button.
7. Setelah semua sudah diatur dalam viewdaftar.xml dilanjutkan double klik pada viewgambar.xml. Beri sebuah gambar dengan cara klik drag drop menu pallete pilih media dan drag drop image button. Pilih gambar sesuai keinginan.
8. Lelu kembali ke projek pada java. Double klik main activity.java. Buatlah program di dalam class tersebut seperti berikut.
Gambar program bagian satu
Gambar program bagian dua (lanjutan dari program satu dia atas)
9. Klik file ViewDaftar.java dan tambahkan program seperti berikut.
10. Tambahkan juga program pada ViewGambar.java seperti berikut.
11. Klik android manifest pada folder res. Edit program tersebut seperti berikut agar dapat memanggil class lain.
12. Catatan : jangan lupa setelah membuat program disetiap class ataupun menambahkan widget di save all. Jalankan program tersebut setelah memilih device emulatornya. Berikut hasil dari praktikum memanggil layout.
Ini merupakan tampilan Daftar setelah tombol daftar di klik.
Dan ini merupakan tampilan ketika tombol lihat gambar.
C. Tutorial Membuat Layout Manager Pada Button Dalam praktikum 5 kali ini dapat kita ketahui bahwa adanya tugasdalam pembuatan layout manager pada button. Berikut tutorialnya. 1. Buka eclipse file new project android beri nama project seperti biasanya.
2. Kemudian “next” pada tombol hingga nanti kita akan memilih symbol pada aplikasi yang akan kita buat. Berikut contohnya.
3. Buatlah kode program pada folder layout activity_main.xml masukan kode program untuk mengatur pada ukuran tombol. Bias juga kita gunakan dengan pada tab graphical layout dengan drag drop button secara cepat, namun di sini kita beri kode saja pada activity_main.xml saja agar tidak membingunkan. Berikut merupakan kodenya.
activity_main.xml
Lanjutan dari kode program activity_main.xml
Lanjutan dari kode program activity_main.xml 4. Buatlah juga device pada emulator yang akan kita gunakan. Pilih ukuran layar pada emulator kemudian pilih start lunch tunggu emulator bekerja dan perlu kesabaran karena cukup lama.
5. Apabila sudah muncul menu emulator android maka akan muncul symbol seperti berikut.
6. Berikut hasil praktikum 5 tentang layout manager.
