A.

Membuat Projek
1.Pertama buka App Inventor http://appinventor.mit.edu/
2.Create Apps pada App Inventor

Gambar 1. Tampilan Web Inventor

3. Untuk melakukan create apps,harus log in menggunakan gmail.

4. Kedua pilih Start My Project ,isilah nama project “Kalkulator”yang akan dibuat. Klik OK.

Gambar 2. Membuat Projek Baru

5. Terlihat Tampilan Awal projek seperti gambar dibawah

 Gambar 3. Tampilan Menu App Inventor

B. Membuat Tampilan Aplikasi

1. Buat judul nama aplikasi terlebih dahulu pada bagian “Screen 1” dengan mengedit tittle
text menjadi “Kalkulator” di menu Properties.

Gambar 4. Tampilan Screen

2. Tambahkan layout “Vertical Scrool Arrangement”,kemudian Buatlah display layer text

angka sebagai input dan output dari suatu angka. Caranya dengan mendrag “Label” di
menu user interface dan hilangkan text “Text for Label 1” pada properties dan lakukan
drag anddrop menuju vertical scroll arrangement. Tampilan seperti gambar dibawah :

Gambar 5. Tampilan Label di Vertical Scroll Arrangement

3. Buatlah layout table arrangement pada layer aplikasi sebagai tempat button angka-
angka dan fungsi formula. Caranya dengan mendrag dan drop button ke layer aplikasi
tersebut. Kemudian editlah sesuai yang diinginkan pada menu properties, sehingga
tampilan button angka dan formula seperti gambar dibawah :

Gambar 6. Tampilan Button Angka dan Formula

4. Jangan lupa untuk membuat tombol button reset (CLC) apabila sudah selesai
melakukan perhitungan,agar tampilan kembali seperti semula. Lakukan editing button
tersebut pada properties.

5. Agar tampilan aplikasi kalkultor menarik jangan lupa melakukan editing pada
properties sehingga tampilan menarik. Berikut hasil tampilan aplikasi kalkulator :
 Gambar 7. Tampilan Aplikasi Kalkulator

C. Membuat Blocks (Program)

Setelah melakukan pembuatan aplikasi,selanjutnya dilakukan pembuatan kode
program. Dengan menggunakan app inventor,bentuk source code berupa susunan
puzzle yang sangat memudahkan kita dalam membuat alur program.

1. Klik menu block pada bagian pojok kanan atas. Untuk Cara membuat program yakni
bisa dipilih pada menu block

Gambar 8. Memulai Program dengan klik Block

 Gambar 9. List blocks untuk Pembuatan Program

2. Dalam aplikasi ini, langkah pertama yang haru dilakukan yakni inisialisasi secara
global yakni berupa current (awal proses),previous (perintah sebelumnya),dan operator
(pemanggil fungsi).

Gambar 10. Inisialisasi Current,Previous,Operator

3. Setiap button pada kalkulator harus dilakukan pemanggilan (call number button).
Dimana dalam hal ini ketika button angka diklik,maka button yang telah ter-klik akan
tampil dalam display. Tampilan kode nya seperti dibawah :
 Gambar 11. Pemanggilan Button Angka

4. Jangan lupa melakukan inisialisasi tombol “CL” atau tombol reset. Karena setelah
selesai dalam melakukan perhitungan,tombol CL akan kembali proses ke awal/reset.

Gambar 12. Pengaktifan tombol Clear

5. Jangan lupa membuat prosedur saat menginput button suatu angka agar button yang
telah diinput tersebut (kondisi aktif),ditampilkan dalam display. Tampilan nya seperti
gambar dibawah :

Gambar 13. Prosedur Angka Button saat Diklik

6. Setelah melakukan inisialisasi nomor angka button,selanjutnya adalah inisialisasi

pada button fungsi matematika dimana dalam hal ini fungsinya berupa : +, -, *, dan /.
Untuk itu dilakukan tombol button tersebut perlu dilakukan perintah “ call operator
button click”. Dimana operator inilah sebagai pemanggil fugsi matematika tersebut.
Tampilan kode button fungsi seperti gambar dibawah :
 Gambar 14. Pemanggilan Fungsi Matematika ( Operator )

7. Khusus untuk tombol “=” diperlukan inisialisasi karena merupakan hasil dari
penjumlahan, pengurangan, perkalian, dan pembagian angka pada kalkulator. Tampilan
untuk inisialisasi button “=” seperti gambar dibawah :

Gambar 15. Inisialisasi button “=”

8. Selanjutnya langkah terakhir yang dilakukan yakni pada button fungsi matematika
terrsebut,juga harus terdapat langkah-langkah proses bagaimana hasil itu sesuai
karena dalam setiap perhitungan dibutuhkan proses-proses agar hasil yang diperoleh
nantinya sesuai yang dinginkan. Sehingga tampilan proses untuk operator fungsi
seperti gambar berikut :

Gambar 16. Procedure Operator Button Click

9. Setelah selesai dalam pemograman. Pilih dan klik menu Build. Lalu pilih pilihan 1
(provide QR code for .apk) untuk penggunaan aplikasi pada android. Dan pilih pilihan 2
jika ingin membuka pada PC.

Gambar 17. Save and Build Aplikasi

10. Setelah ini maka proses compiling akan segera dimulai. Tunggu sampai 100%.

Gambar 18. Compiling Aplikasi

D. Menjalankan Project Aplikasi

Setelah program selesai didownload ,untuk menjalankan program aplikasi bisa
dilakukan menggunakan aplikasi Leaproid Studio.

1. Buka software Leapstudio

2. Drag and drop file yang sudah didownload dicomputer ke Leapdroid.

3. Klik Install untuk menjalankan aplikasi

Gambar 19. Tampilan Install Aplikasi pada Leapdroid

4. Setelah terinstall,pilih open

Gambar 20. Tampilan Aplikasi Sudah Terinstall. Pilih Open untuk Membuka Tampilan
Aplikasi Tersebut.

5. Sesudah dibuka,Aplikasi Kalkulator sudah bisa dijalankan

6. Untuk Menjalankan Aplikasi tersebut, isilah angka dan formula yang ingin
diinput. Kemudian untuk memverifikasi,klik button “=”
Contoh : 10 * 5 = 50,tampilan kalkulator seperti berikut :
 Gambar 21. Input Angka beserta Fungsi Matematika

7. Klik tombol “=”, Data yang telah diisi menyatakan benar dan sesuai jika dibandingkan
dengan perhitungan secara manual.
Hasil :
Gambar 22. Output yang dihasilkan