Penggunaan Fungsi Label, TextBox, dan Button pada MIT App Inventor

Tujuan :

1.  Mengetahui fungsi dari Label, TextBox, dan Button pada MIT App Inventor
2.  Mengetahui cara membuat data diri sederhana berbasis android agar dapat disimpan dan di hapus

Berikut adalah contohnya :

Perintah yang akan dilakukan adalah jika NAMA, NIM, dan PRODI diisi kemudian ditekan tombol SIMPAN maka akan muncul data yang diisi tadi, tetapi jika ditekan HAPUS maka data akan terhapus.

Alat-alat yang dibutuhkan: PC, Internet, dan smartphone Android yang telah terinstall MIT AI2 Companion

Langkah-langkah:
1. Buka website MIT App Inventor pada PC anda

2. Klik Create Apps!

3. Klik Start New Project

4. Drag and drop 3 buah Label, 3 buah TextBox, dan 2 buah Button ke Screen 1.

5. Kemudian beri nama pada Label, TextBox, dan Button tadi dengan cara mengubah Text pada kolom Properties

6. Kemudian, agar masing-masing label NAMA, NIM, dan PRODI memiliki TextBox, maka pilih Layout pada Pallete kemudian pilih HorizontalArrangement lalu drag and drop ke Screen 1 sebanyak 3 kali.

7. Kemudian akan tampil seperti gambar dibawah ini

Agar terlihat rapi, maka setiap Label dan Button diberikan Width bagian Fill Parent. Untuk TextBox, widthnya diatur menjadi 70 percent untuk masing-masing TextBox seperti gambar berikut.

8. Kemudian, tambahkan 3 buah Label lagi sebagai hasil dari Button SIMPAN nantinya

Kemudian 3 Label tadi yang awalnya terdapat centang pada Visible diubah menjadi tidak ada centang. (Visible dapat ditemukan dalam Properties)

9. Selanjutnya agar tidak bingung dalam menyusun blocksnya nanti, maka dianjurkan untuk me-RENAME masing-masing komponen

10. Kemudian buka Blocks dan susun bloknya seperti gambar dibawah ini

Setelah selesai menyusun blok seperti gambar diatas, maka klik connect dan pilih AI Companion, kemudian masuk ke aplikasi android MIT AI2 Companion dan scan barcode, maka akan muncul secara otomatis tampilan seperti berikut 

(Pastikan anda memakai jaringan internet yang sama antara PC dan Android)

11. Isilah garis yang kosong tersebut seperti gambar dibawah ini

Ketika menekan Button SIMPAN maka data akan muncul seperti gambar dibawah ini

jika menekan Button HAPUS  maka data akan hilang

Thank you for reading my blog 😃