Rabu, 05 Oktober 2016

Tutorial Pembuatan Aplikasi Kalkulator Menggunakan App Inventor

    Pada artikel sebelumnya telah dibahas tentang bagaimana Tutorial Pembuatan Aplikasi Data Diri Menggunakan App Inventor. Kali ini saya akan menjelaskan Tutorial Pembuatan Aplikasi Kalkulator Menggunakan App Inventor, dan masih menggunakan website yang sama, yaitu http://appinventor.mit.edu/
    Di artikel sebelumnya juga telah dibahas tentang Android, App Inventor dan juga MEmu App Player yang diperlukan dalam pembuatan aplikasi android ini. Maka dari itu, langsung saja saya menjelaskan proses pembuatan aplikasi kalkulator ini.
  1. Buat projek baru (penjelasan untuk membua projek baru dapat dilihat di artikel sebelumnya Tutorial Pembuatan Aplikasi Data Diri Menggunakan App Inventor )

  2. Buat nama projek. Kali ini nama projeknya adalah Prak2MyCalculator. Seperti biasa, yang pertama saya akan membahas tentang bagaimana cara mendesign aplikasi android ini.

  3. Masukkan sebuah label, dan beri nama DisplayLBL. Atur propertisnya seperti pengaturan dibawah ini:
    • Background Color Black
    • Font Bold checked
    • Font Size 48
    • Text (empty)
    • Text Alignment right
    • Text Color Cyan
  4. Untuk numeric keypadnya dipilih seperti keypad cell phone. Kemudian dibawahnya diberikan VerticalArrangement dan di set menjadi Fill Parent di width dan height nya.

  5. Di dalamnya kemudian di berikan empat buah Horizontal Arrangement dan juga diatur width dan height nya menjadi Fill Parent.

  6. Di dalam Horizontal Arrangement tadi letakkan masing-masing empat buah tombol. Setiap tombolnya diatur text tombolnya menjadi :
  7. 1,2,3,+
    4,5,6,-
    7,8,9,x
    C,0,=,/

  8. Setelah dibuat teks tombolnya, rename nama tombolnya sehingga memudahkan dalam membuat blocks seperti berikut

  9. SatuBTN,DuaBTN,TigaBTN,TambahBTN
    EmpatBTN,LimaBTN,EnamBTN,KurangBTN
    TujuhBTN,DelapanBTN,SembilanBTN,KaliBTN
    HapusBTN,NolBTN,HasilBTN,BagiBTN

  10. Kemudian atur setiap Height dan Width nya menjadi Fill Parent.

  11. Untuk bagian designer telah selesai. Selanjutnya adalah desaign block nya. Hasil akhir designernya adalah sebagai berikut.

  12. Klik pada bagian block

  13. Yang perlu diperhatikan pertama kali adalah menginisialisasi atau membuat variabel awal agar bisa dimasukkan dalam proses selanjutnya.

  14. Setelah itu dibuat prosedur SetOperator dan AddDigit.

  15. Setelah dilakukan hal tersebut, kita dapat langsung membuat program dengan block seperti gambar dibawah.

  16. Setelah selesai, program dapat di build dengan Klik Build>App(Save .apk to my computer)

  17. Tampilannya di dalam Memu adalah seperti berikut.

Tidak ada komentar:

Posting Komentar

Mohon jika ada masukan atau saran
[Gunakan Nama]