WORKSHOP APLIKASI INTERNET

Tutorial App Inventor Untuk Membuat Aplikasi Identitas Diri

Untuk menggunakan App Inventor ada beberapa hal yang harus di siapkan terlebih dahulu, yaitu : 

> Memiliki Account Gmail terlebih dahulu, dan masuk –Log In  ke http://appinventor.mit.edu/

apabila anda belum memiliki Account Gmail maka terlebih dahulu mendaftar pada http://www.gmail.com

> Setelah masuk anda akan diminta untuk membaca & menyetujui term of servicedari google, klik pada tombol I accept the terms of service.

Memulai Pembuatan Aplikasi

>Klik  Start new project dan Masukan nama Project dengan  “Latihan1”, klik ok

>Maka Tampilan Awal Pembuatan Aplikasi Akan Terlihat

Lingkungan Kerja App Inventor

Sebelum kita melanjutkan untuk memulai developing, kita mengenal terlebih dahulu lingkungan kerja pada App Inventor yang terdiri dari :

Komponen Desainer – Component Designer yang berjalan pada Browser, digunakan untuk memilih komponen dan mengatur property.

Komponen desainer , terdiri dari :

Viewer             : untuk menempatkan komponen dan mengaturnya sesuai tampilan yang diinginkan.

Pallete              : adalah list dari komponen yang bisa dipakai

Component list : merupakan tempat list komponen dari projek yang kita pakai

Media              : mengambil media audio dan gambar untuk projek kita

Properties         : ketika anda klik komponen pada viewer maka propertiesnya akan terlihat pada panel ini

Blok Editor – Blocks Editor berjalan diluar browser, dimana digunakan untuk membuat dan mengatur behaviour dari komponen yang kita pilih pada komponen desainer.

MEMBUAT TAMPILAN APLIKASI

Drag drop 7 label yang  gunakan untuk  meletakkan  Identitas Mahasiswa,yakni berupa Nama,Nim,Alamat,Umur,dan Status. Dan  juga 5 Textbox untuk pengisian identitas tersebut.

Kemudian 1 button untuk Memverifikasi data dan tambahkan 5 label lagi untuk menampilkan data identitas nantinya. Sehingga tampilannya akan menjadi seperti yang di bawah ini :

Edit tampilan Aplikasi Sesuai Selera Anda

Agar aplikasi dapat digunakan sesuai perancangan awal, kita akan memulai untuk menginisialisasi interface interface yang digunakan saat perancangan dengan mengklik tombol blocks yang ada di sudut kanan aplikasi.

 Maka akan muncul tampilan awal block dimana kita dapat melakukan  penginisialisasian.

inisialisasi dilakukan pada kolom data identitas,kemudian dikakukan pada button yang berguna untuk memverifikasi data identitas yang telah diisi pada kolom identitas.

Selanjutnya lakukan inisialisasi pada button yang berguna untuk memverifikasi data identitas yang telah diisi pada kolom identitas.

Setelah selesai melakukan inisialisasi untuk menjalankan aplikasi selanjutnya kita dapat memilih  menu “Build”, lalu klik “App( provide QR code for .apk ) sehinga muncul code seperti gambar dibawah ini

Setelah itu buka app invertor yang ada pada android anda, pastikan koneksi internetnya dalam keadaan baik, atau pilih menggunakan wifi agar aplikasi dapat berjalan sebagaimana mestinya.

Scan barcode link latihan1 agar aplikasi dapat diakses memalui ponsel

Untuk menjalankan Aplikasi, Isilah data sesuai identitas seperti gambar dibwah ini. Kemudian untuk memverifikasi klik button “click here” . Setelah di klik, data yang telah di isi dinyatakan benar dan sesuai dengan identitas yang dimiliki.