Membuat Aplikasi Android Dengan App Inventor 2

app-inventor

Halo Sahabat Codenesia, Hari ini saya ingin berbagi mengenai tutorial bagaimana membuat aplikasi android tanpa coding. Nah untuk bisa membuat aplikasi android tanpa coding, kita akan menggunakan aplikasi App Inventor 2. Aplikasi ini berupa web based, jadi kalian harus mempunyai koneksi internet. Kalian bisa mengakses App Inventor lewat link berikut: http://ai2.appinventor.mit.edu/

Disini saya akan mencoba membuat aplikasi Quiz yang dimana pada aplikasi ini saya akan menampilkan 5 pertanyaan saja. Dan nanti pengguna bisa menjawab pertanyaan tersebut dan akan mendapatkan skor. Untuk membuat aplikasi quiz, berikut ini langkah-langkahnya:

1. Login ke aplikasi App Inventor http://ai2.appinventor.mit.edu/

2. Buat project baru dengan cara mengklik start new project, kemudian ketikkan nama projectnya. Terus klik OK

appinventor1

 

3. Langkah berikutnya adalah membuat layout aplikasi yang akan kita buat. Kita akan membuat background gambar. Langkahnya yaitu klik tombol upload file pada sisi sebelah kanan bawah. Kemudian pilih gambarnya

appinventor2

4. Kemudian klik component screen pada sisi sebelah kanan layar. Kemudian ubahlah BackgroundImage dan pilihlah gambar yang baru saja anda upload

5. Lalu kita akan membuat layout seperti gambar dibawah ini. Layoutnya terdiri dari 3 Text Label dan 4 Button. Kalian tinggal drag and drop saja ya

appinventor5

5. Kemudian kalian harus mengubah layout tersebut sesuai keinginan anda. Sesuaikan layout anda seperti gambar dibawah ini

appinventor6

6. Selanjutnya kita akan membuat layout kedua yang nantinya akan digunakan untuk menampilkan skor kuisnya. Untuk membuat layout atau screen baru caranya yaitu klik tombol add screen lalu klik ok seperti pada gambar dibawah ini

appinventor7

7. Kemudian ubahlah dan sesuaikan layout “Screen2” Seperti gambar dibawah ini. Sesuaikan dengan kreasi kalian

appinventor8

 

8. Setelah semua layout selesai dibuat. Kita akan masuk ke menu block disamping kanan. Kita akan membuat sebuah blocks sehingga aplikasi yang kita buat berjalan sesuai dengan yang kita inginkan.

9. Kita akan mendeklarasikan variabel di “Screen1”. Kita pilih Screen1. Selanjutnya kita klik “Blocks”. Pertama-tama kita akan mendeklarasikan sebuah variabel pertanyaan. Caranya cukup mudah yaitu klik “variables” yang berada disamping kiri, kemudian drag and drop “initialize global” ke area sebelah kanan

appinventor9

appinventor10

10. Kemudian lakukan hal yang sama dan silahkan di eksplor sehingga membentuk “blocks”seperti pada gambar dibawah ini

appinventor11

11. Pada gambar diatas variabel “pertanyaan” memiliki sebuah list, tetapi listnya hanya berisi dua text, padahal kita akan membuat quiz dengan 5 pertanyaan, Berarti kita perlu menambah listnya lagi dong. Caranya cukup mudah, klik icon gerigi yang ada di blok “make a list”. Kemudian tinggal drag and drop ke samping kanan. Silahkan lihat gambar dibawah ini

appinventor12

appinventor13

Screenshot (70)

12. Kemudian buatlah variabel pilihan_A, pilihan_B, pilihan_C, pilihan_D, jawaban. Sehingga akan jadi seperti gambar di bawah ini

Screenshot (71)

Screenshot (72)

13. Selanjutnya kita akan membuat 2 variabel yaitu variabel skor dan variabel index. Kemudian kita akan membuat sebuah prosedure yang kita namanakan “soal”. Procedure “soal” ini berfungsi untuk menampilkan sebuah soal.

appinventor15

14. Kemudian kita akan membuat OnClick Handler. Yaitu kita akan membuat tugas yang akan dilakukan oleh aplikasi jika pengguna memencet tombol pilihan Jawaban. Silahkan lihat gambar di bawah ini

appinventor16

15. Selanjut kita tinggal men-copy paste blocks kode “when Button1.Click”. Dan lalu diedit sehingga jadi seperti gambar di bawah ini

appinventor161

appinventor162

16. Lalu kita pindah ke Screen 2. kita akan mengubah Blocks pada Screen 2. Ubahlah seperti gambar di bawah ini

appinventor17

 


Silahkan dukung developer indonesia dengan mendownload aplikasi buatan anak bangsa. Silahkan klik https://play.google.com/store/apps/details?id=com.codenesia.mathgames

Aplikasi codenesia

8 thoughts on “Membuat Aplikasi Android Dengan App Inventor 2

    1. Sebenarnya hanya butuh trik dan logika sedikit gan. Misal soalnya berjumlah 10 soal, maka nanti pertama-tama lakukan random angka 1-10 yang kemudian disimpan dalam list. Tapi untuk implementasinya di app inventor, saya belum pernah nyoba mas. Soalnya saya biasanya membuat aplikasi android pake Android Studio. Untuk app inventor memang cukup familiar bagi orang yg awam tentang pemrograman, tapi ya menurut saya fitur di app inventor lebih sedikit dibandingkan dengan android studio. Jadi untuk pertanyaan agan, mohon maaf saya belum bisa jawab

  1. Minta tutorialnya dong, cara uploadnya (ofline maupun online), cara penyesuaian bit 32 or 64 ? Trims, atau boleh kirim pdf di email saya, trims ya

Leave a Reply

Your email address will not be published. Required fields are marked *