TUTORIAL APP INVENTOR – BAGIAN 1

VISUAL BLOCK PROGRAMMING - APP INVENTOR

Membuat Aplikasi Android Tanpa Script

App Inventor adalah sebuah perangkat pemrograman untuk membuat aplikasi android, yang
menyenangkan dari tool ini adalah karena berbasis Visual Block Programming. Disebut Visual
Block Programming menggunakan, menyusun dan drag-drops blok, merupakan simbol-simbol
perintah dan fungsi event handler tertentu dalam membuat aplikasi, dan secara sederhana kita
bisa menyebutnya tanpa menuliskan kode program (coding less).

Framework visual programming ini terkait dengan bahasa pemrograman Scratch dari MIT, yang
secara spesifik merupakan implementasi dari Open Block yang didistribusikan oleh
MIT Scheller Teacher Education Program yang diambil dari riset yang dilakukan oleh Ricarose
Roque.

App Inventor menggunakan Kawa Language Framework dan Kawa’s dialect yang di
dikembangkan oleh Per Bothner dan di distribusikan sebagai bagian dari GNU Operating System
oleh Free Software Foundation sebagai Compiler dan menterjemahkan Visual Block
Programming untuk diimplementasikan pada platform Android. Tentu disini anda tinggal
menikmati kemudahan yang ada.
MOTTO APP INVENTOR
SEMUA ORANG BISA MEMBUAT APLIKASI ANDROID

Langkah-Langkah Pemrograman dengan APP Inventor

Proses pemrograman Android menggunakan APP Inventor dapat dilihat pada gambar di
bawah ini.

Blok Diagram Cara Kerja Pemrograman App Inventor

1
TUTORIAL APP INVENTOR – BAGIAN 1

Gambar di atas adalah proses programming aplikasi Android dengan APP Inventor. Berikut ini
adalah langkah-langkah memprogram aplikasi android menggunakan APP Inventor.
1. Daftar akun email di google
2. Instal Java SDK 6 atau 7
3. Instal App Inventor [Link] (digunakan untuk menjalan emulator Android)
4. Buka [Link] maka akan tampil gambar seperti di bawah ini
Catatan : Jika menggunakan versi offline menggunakan App Inventor Offline
5. Software tersebut diatas dapat diunduh di :
[Link]

Tampilan IDE App Inventor

6. Buat isi form (Screen) sesuai dengan aplikasi yang akan dibuat.

Tampilan Screen (Form) IDE App Inventor

2
TUTORIAL APP INVENTOR – BAGIAN 1

7. Klik Open the Block Editor untuk memprogram aplikasi android menggunakan Visual Block
Programming.

Tampilan dan Kode Blok App Inventor

8. Simpan dengan meng-klik tombol SAVE

9. Jika ingin menjalan emulator klik New Emulator, klik Connect To Device, Klik Emulator.
10. Compile aplikasi yang telah dibuat dengan meng-klik Pack for Phone lalu klik Download to
Connected Phone .
11. Instal aplikasi berekstensi apk pada platform Android.
12. Aplikasi siap dijalankan.

3
TUTORIAL APP INVENTOR – BAGIAN 1

Komponen App Inventor

Komponen pada APP Inventor terdiri dari beberapa bagian yakni,
1. Basic Components

Basic Components

2. Media Components

Media Components

4
TUTORIAL APP INVENTOR – BAGIAN 1

3. Animation Components

Animation Components
4. Social Components

Social Components

5. Sensor Components

Sensor Components

5
TUTORIAL APP INVENTOR – BAGIAN 1

6. Screen Arrangement Components

Screen Arrangement Components

7. LEGO® MINDSTORMS® Components

LEGO® MINDSTORMS® Components

8. Other Components

2.13 Other Components

6
TUTORIAL APP INVENTOR – BAGIAN 1

Blocks APP Inventor

Blocks pada APP Inventor merupakan bahasa pemrograman itu sendiri. Bloks APP Inventor
adalah blok-blok puzzle untuk membangun setiap aplikasi yang dibuat. Berikut ini adalah blok-
blok APP Inventor:
1. Definition blocks

Definitions Blocks

2. Text blocks

Text Blocks

7
TUTORIAL APP INVENTOR – BAGIAN 1

3. List blocks

List Blocks
4. Math blocks

8
TUTORIAL APP INVENTOR – BAGIAN 1

Math Blocks

5. Logic blocks

Logic Blocks

6. Control blocks

Control Blocks

7. Color blocks

Color Blocks