Tutorial App Inventor 2 Bahasa Indonesia Pdf

MODUL PELATIHAN Pembuatan Aplikasi

Menggunakan

Disusun Oleh: Riza Arifudin Ardhi Prabowo

MEMULAI APP INVENTOR OFFLINE (APP INVENTOR PERSONAL SERVER) App Inventor pada awalnya muncul merupakan versi online, kemudian sekarang sudah ada versi yang Offline. Perbedaan dari keduanya secara singkat padat dan jelas adalah kerjakan yang varian online apabila ingin mengcompile atau mempaket permintaan maka taat harus terkoneksi internet. Padahal dengan menggunakan App inventor offline sonder terkoneksi ke internetpun kita bisa menciptakan menjadikan aplikasi android secara mandiri serampak bisa mempaket atau mengcompile-nya bersama-sama. Itulah sebabnya disebut juga App Inventor Personal Server, karena sudah include server compilernya, benar-benar sangat menyenangkan buat yang ingin belajar App Inventor tetapi tersuntuk dengan koneksi internetnya. App Inventor true offline ini dipackage makanya Gary Frederick ( Jefferson Software) dari source yang di rilis oleh MIT. Disini kita akan memakai versi windows, masih varian test tetapi sudah lalu bagus dan sebanding dengan varian online-nya. OK sekarang waktunya lakukan mencobanya : 1. Download file Personal.zip dari http://sourceforge.net/projects/ai4a-configs/files/Personal%20server/ 2. Menurut butir-butir (Readme) sudah di test pada Windows 7, Momen di coba pada Windows XP SP3 dengan JDK 1.6, Block Penyunting bukan dapat terkoneksi ke Emulator. Dan ketika memakai Java JDK 1.7 bisa lancar, kaprikornus pastikan apabila tidak bisa lancar menunggangi java JDK 1.6 maka pakailah Java JDK 1.7 download dari http://www.oracle.com/technetwork/java/javase/downloads/jdk7-downloads-1637583.html 3. Install terlebih terlampau JDK 1.7 4. Install AppInventor_Setup_Installer_v_1_2.exe yang boleh di download http://beta.appinventor.mit.edu/learn/setup/setupwindows.html

5. Ekstrak file Personal.zip , bebas ditempatkan difolder mana, maka kita akan mendapatkan catur (4) buah folder yaitu : a. appengine-java-sdk-1.6.4 b. AppInventor c. BuildServer d. Java

6. Bikin mencobanya, jalankan BuildServer AppInventor terlebih lampau, yaitu klik dua mana tahu puas Personal\BuildServer\launch-buildserver.cmd

Sehingga akan unjuk sirkulasi udara command line, tunggu sampai selesai

7. Jalankan Sever AppInventor, yai tu dari folder AppInventor klik duakali pada Personal\AppInventor\startAI.cmd,

ini juga akan membuka perputaran udara command line sampai proses selasai dan seterusnya lulus.

8. Beber browser, dan masukkan alamat localhost:8888, maka akan terbuka jendela seperti berikut ini.

Lebih jauh di cek pada sign in as Administrator kemudian di klik sreg Log in sehingga muncul jedela desainer sudah lalu boleh digunakan untuk mewujudkan aplikasi android dengan App Inventor sebagaimana gambar berikut ini.

9. Bulan-bulanan

tak

yang

bisa

dicoba adalah jerambah admin localhost:8888/_ah/admin, silahkan diexplore jerambah admin ini.

yaitu

puas

MENGENAL APP INVENTOR Lebih Kerumahtanggaan Antarmuka Apakah yang menganjur pada App Inventor?, nan menarik dari App Inventor merupakan, kita tidak sekali lagi menemukan kode-kode program seperti halnya saat menunggangi tools developing lain. Kode-kode itu sudah dibungkus kedalam sasaran optis, yang dinamakan Blocks. Kita lampau mencerna fungsi dari Blocks tersebut, kemudian bagaimana sira berinteraksi dengan Blocks bukan, dan terakhir merangkainya persis begitu juga merangkai puzzle untuk mewujudkan suatu bentuk maupun gambar. Coba lihat pada bentuk, sama dengan racikan puzle bukan?, suntuk mudah, dan mengademkan, disini bisa kita anggap kita melangkahi fase untuk membiasakan tentang bahasa pemrograman, dan berfokus pada belajar kreatifitas dan akal sehat.

Berlatih takhlik tuntutan adalah cara yang minimal efektif bakal sparing membuat tuntutan dengan App Inventor. Kita enggak harus senggang dulu seluruhnya, sepan beberapa keadaan penting yang akan kita gunakan puas proses belajar ini. Seperti misalnya workspace segala sahaja yang akan kita gunakan, maupun darimana kita memperoleh komponen dan blocks yang kita butuhkan. Untuk itu kita akan melihat sesungguhnya apa saja nan kita butuhkan, dan segala apa yang penting cak bagi kita pahami terlebih dahulu. Silakan sekali sekali lagi kita tatap, buat membuat petisi dengan App Inventor ada tiga awalan utama yaitu : 1. Kita mewujudkan UI dan memasukkan suku cadang-komponen App-Inventor yang akan kita pakai lega permintaan dengan jendela Ahli grafis kita 2. Membentuk komponen itu berfungsi yaitu dengan mengambil Block mulai sejak komponen, dan menyusunnya di Blocks Editor 3. Menyedang aplikasi pada Emulator atau handset Android. A. Desainer : Membentuk UI (User Interface) dan menjaringkan komponen-komponen AppInventor yang akan kita pakai pada aplikasi dengan jendela Desainer kita. Disini terletak bagian Palette, Viewer, Components dan Properties. Selain itu kembali terletak beberapa menu terdepan yang akan kita gunakan. a. Pallete : Ampuh seluruh komponen yg dapat kita pakai untuk membuat petisi b. Viewer : Untuk menempatkan Suku cadang dan mendesain seperti apa tampilan atau UI dari aplikasi c. Components : Berisi suku cadang yg mutakadim kita ambil dan akan gunakan puas permohonan d. Properties : Disini kita bisa mengubah properti dari saban komponen, misal corak cucur. e. Add/Remove Screen : Menambahkan alias menghapus screen, ini fitur baru puas App Inventor, adalah dukungan Multiscreen. f. Open The Blocks Penyunting : buat mengaktifkan tingkapan Blocks Penyunting, sekali diaktifkan apabila Blocks Penyunting

g. Package for Phone : Ketika aplikasi radu dibuat, dan kita mau mencobanya di handset android, maka bisa menggunakan menu ini.

B. Blocks Penyunting : adalah panggung untuk mengambil blocks (kode acara yg telah dijadikan sasaran visual), dan menyusun Blocks-Blocks tersebut sehingga berfungsi sesuai dengan yang kita inginkan. Ada lima menu berfaedah disini yaitu : a. Built-In : Blocks dasar dari suku cadang App Inventor b. My Blocks : Blocks berasal komponen yang kita gunakan untuk aplikasi, yaitu yang dimasukkan sreg Ahli grafis c. Advance : Blocks pelengkap dari yang cak semau pada My Blocks d. New Emulator : Menu untuk mengaktifkan Emulator e. Connect To Devices : Menu untuk mengkoneksikan projek aplikasi dengan Emulator atau HP Android, merupakan ketika kita cak hendak mencoba Permintaan yang madya dibangun. Dan sesudah sekali dikoneksikan maka momen terjadi perubahan plong aplikasi yang sedang dibangun, misal komponen diganti, blocks diganti, secara kodrati akan dikomunikasikan ke Emulator atau HP Android.

C. Emulator Handset Android Apabila kita kepingin mencoba aplikasi android yang telah dibuat, kita bisa memakai Emulator, intim semua nan dapat dilakukan oleh Handset Android boleh dilakukan makanya Emulator, kecuali menelepon, berkirim SMS, dan GPS. Jadi kita tidak usah kuatir, ketika takhlik permintaan Android dengan App Inventor, maka kita bisa menggunakan Emulator sebelum mencobanya di Handset ataupun HP Android.

Apabila kita mutakadim memahami workspace dari App Inventor ini, maka dahulu kita mencobanya. Ada banyak contoh dari aplikasi App Inventor ini di internet. Dengan mematamatai komponen yang digunakan dan dipasang plong Desainer, atau melihat Blocks yang tersusun pada Blocks Editor, kita akan taajul bisa membuat dan mencobanya koteng. Jika mau cepat menguasainya, kuncinya sekali kembali adalah ber latih dan berlatih, pikirkan kita akan membuat petisi barang apa, kemudian cobalah bagi berlatih membuatnya. Buat yang belum nikah mengenal App Inventor, App Inventor yakni satu Tool webbased (Cloud) kerjakan membuat Aplikasi puas platform Android yang ditujukan cak bagi semua orang. Memakainya kita bisa mewujudkan permintaan android tanpa kode sewaktu-waktu. Lubang angin Perancang Setelah sebelumnya kita mengenal workspace sreg App Inventor, selanjutnya kita akan mengenal beberapa hal berharga secara detail plong Jendela Desainer. 1. Plong ventilasi Desainer ketika kita memasukkan onderdil kedalam Viewer maka suka-suka komponen yang akan turut kedalam layar Viewer (Visible Component) dan ada juga suku cadang nan secara otomatis akan masuk dibawah jib viewer (Non Visual Component). Suku cadang nan termasuk privat Visible Component berjasa akan terlihat pada layar tuntutan, padahal onderdil Non-visible Component tidak akan terbantah plong

layar momen permintaan dijalankan. Puas lembaga, tombol Button OK (Button) termasuk Visible Component, padahal TinyDB1 ialah Non-visible Component.

Gb1. Visible-Non-Visible 2. Jika kepingin mengubah properti dari suatu suku cadang, maka kita bisa klik puas komponen tersebut, dan ubah melewati jendela properties. Misalnya meniadakan background dandan mulai sejak kenop (button).

Gb2. Properties 3. Untuk mengatur penyelenggaraan-letak onderdil pada layar, maka digunakan komponen ScreenArrangement , terdapat tiga diversifikasi pengaturan yakni : a. HorisontalArrangement : Bakal mengatur komponen secara mendatar b. TableArrangement : Bagi mengatur komponen sreg sebuah tabulasi c. VerticalArrangement : Untuk mengatur komponen secara tegaklurus Kita bisa menata lebar dan pangkat dari masing-masing propertisnya, padahal khusus buat TableArrangement bisa diatur jumlah kolomnya.

Gb3. ScreenArrangement 4. Terdapat komponen spesial cak bagi mewujudkan permohonan yang ditujukan khusus bikin robot Lego NXT. Dekat seluruh fungsi robot bisa dikendalikan, dengan onderdil-komponen ini. Yaitu sejumlah sensor, dan Direct Command (Perintah), maupun cak bagi tanggulang Drive (Arah).

Gb.3 Lego_NXT 5. Lega menu Package for Phone, terletak tiga macam pilihan yaitu : a. Show Barcode : Untuk membuat barcode berpangkal permohonan yang dibuat b. Download to This Computer : Mendownload aplikasi nan dibuat ke intern komputer, kemudian bisa dicopy ke HP Android buat dicoba. c. Download to Connected Computer : Apabila kita mengkoneksikan HP Android pecah tadinya, maka bisa langsung mencoba menjalankan tuntutan di HP.

Gb.4 Package_Aplikasi

Blocks Editor Sebelumnya kita telah mengenal mengenai workspace yang pada App Inventor, dan meributkan secara detail Jendela Desainer. Dan workspace lainnya nan akan selalu kita gunakan adalah Blocks Editor, yakni sebuah medan kerjakan mengambil dan menyusun blocks (kode program yg telah dijadikan incaran visual) dari suku cadang yang kita pasang pada Jendela Perancang. Disini kita akan merumuskan Blocks-Blocks tersebut sehingga aplikasi akan berfungsi sesuai dengan nan kita inginkan. Kita akan lihat, dalam acuan projek berikut ini : 1. Purwa masukkan komponen Button1, HorizontalArrangement1, TinyDB1 dan Clock1 kedalam workspace Desainer, sehingga akan terpandang seperti gambar dibawah ini :

Gb 5. Komponen puas Jendela Desainer 2. Kemudian kita lihat pada Blocks Penyunting, yaitu pada bagian My Blocks. Disitu kita akan melihat Blocks komponen sudah lalu ikut, yaitu Blocks suku cadang Button1, HorizontalArrangement1, TinyDB1 dan Clock1. Apabila belum menelanjangi Blocks Editor, silahkan klik kenop Open Block Editor pada ventilasi Perancang.

Gb6. Blocks Komponen sreg Block Pengedit 3. My Blocks yakni tempat dimana Blocks komponen nan kita pasang plong perputaran udara Desainer berada, sedangkan Built-In ialah arena semua blocks radiks nan ada puas App Inventor. Advance Blocks lampiran dari yang suka-suka pada My Blocks. Sekiranya kita ingin mengekspresikan Blocks yang tersapu dengan komponen nan kita gunakan, maka klik nama komponen plong My Blocks, sehingga akan muncul blocks didalamnya.

Gb7. Blocks Komponen Button 4. Pilih pada Block yang akan kita pakai, kemudian drag kedalam workspace Blocks Editor, misalnya bagi Button, Blocks yang sering akan kita pakai adalah Blocks Button1.Click. Yaitu Block yang berfungsi menghandle event apabila Button atau tombol di klik, padahal nama Button1 merujuk pada onderdil Button yang kita pakai, apabila kita tukar (rename) nama komponennya menjadi Button10 maka stempel Blocks akan menjadi Button10.Click.

Gb8. Blocks Button1 5. Pada My Blocks terdapat suatu Blocks yang akan selalu cak semau yaitu My Definitions, akan sahaja apabila kita belum membuat satu variable tertentu maka Blocks ini akan kosong. Misalnya disini kita akan menciptakan menjadikan Blocks Variabel dengan tera Ponten. Caranya bisa dari Built-In > Definitions > def variable as , maupun klik pada workspace > Def > variable

Gb9. Menciptakan menjadikan Blocks Variable 6. Sekarang klik pada My Definitions, maka akan terlihat Blocks yang kita buat sendiri, yaitu Blocks Poin. Pointnya yakni disini kita mewujudkan Blocks yang dibutuhkan oleh aplikasi kita, namun tak tersedia secara dasar, atau bukan merupakan Blocks berbunga suku cadang. Misalnya variable atau penadah suatu nilai.

Gb10. Blocks My Definitios Langkah-ancang diatas adalah, hal-hal terdepan nan harus diketahui dan dipahami lega Blocks Editor. Selain itu silahkan bereksperimen sendiri, dan mencoba Blocks nan ada pada setiap suku cadang. Yang teristiadat diketahui adalah, nama dari setiap Blocks mencerminkan kurnia berasal Blocks tersebut. Kemudian, keadaan lain nan harus lagi diperhatikan yaitu bahwa Blocks ini menentukan faedah yang kita inginkan puas suatu aplikasi, kaprikornus nan berperan disini yakni Logika dan Kreatifitas kita. Contoh: Ok, sekarang kita akan spontan mencoba membentuk Aplikasi Alarm, agar kita bisa cepat mengarifi bagaimana takhlik aplikasi dengan App Inventor. Petisi ini berfungsi seperti Alarm namun dengan keunikan untuk dapat mematikan obstulen dar i Peluit kita harus menghitung sebuah perkalian. Tujuannya adalah, ketika Alarm difungsikan andai Alarm bagi menjagakan kita dipagi periode, kita akan dipaksa untuk ingat dengan berpikir dan menghitung, asyik bukan?

1. Jalankan AppInventor kemudian login. Klik pada menu New > Serah merek aplikasi seumpama disini Alarm, kemudian klik OK sehingga akan tertumbuk pandangan nama aplikasi Alarm sreg lubang angin projek, lebih lanjut klik plong nama aplikasi tersebut

2. Akan longo workspace Komponen Ahli grafis, disini kita akan memasukkan seluruh komponen yang dibutuhkan buat membangun aplikasi Peluit ini. Bakal mengegolkan kita dahulu mengklik komponen bersumber Pallete disisi kiri, jangan dilepas kemudian menariknya ke layar workspace, sedangkan untuk mengeset propertinya, silahkan dipilih pada jendela Properties di jihat arah kanan. 3. Kita menunggangi komponen HorizontalArrangement cak bagi menaruh komponen lainnya kiranya lebih mudah diatur. Prinsip mendapatkannya dari Pallete > Screen Arrangement > HorizontalArrangement, kemudian drag ke workspace screen. Kemudian kita kembali menempatkan beberapa biji pelir Label, Textbox, pun sebuah cembul. 4. Komponen sound kita ambil berbunga Pallete > Media > Sound , komponen Sound ini untuk menindak file suara, merupakan dengan menambahkan (add) file Sound mulai sejak properti Source > add > dan kemudian browse file dari komputer jinjing. Kita bisa memilih file sound berdimensi mp3 maupun wav, yang perlu kita perhatikan ialah, semakin lautan file sound semakin besar pula nanti permintaan kita, jadi disini perlu dipertimbangkan tentang hal itu. Sedangkan onderdil Timer akan kita gunakan untuk membuat file sound agar selalu aktif berbunyi.

5. Seyogiannya memuluskan kita ketika menciptakan menjadikan event di Blocks Editor, silahkan rename segel komponen lega perputaran udara Components adalah pada menu Rename. Apabila kita riuk ataupun cak hendak mengganti komponen yang dimasukkan, silahkan hapus dengan menu Delete disamping menu Rename, sebelumnya diskriminatif tambahan pula dahulu komponen yang akan dihapus dengan mengkliknya. 6. Setelah selesai memasukkan semua suku cadang dan mengeset propertinya, klik lega menu Open Blocks Editor disamping kanan atas. Tunggu beberapa saat hingga melangah jendela Blocks Editor, kemudian tatap sreg drawer My Blocks, ini adalah tempat event fungsi dari masing-masing onderdil. Saat kita klik pada salahsatu komponen, maka akan muncul event keefektifan apa saja yang ada pada komponen tersebut. Hendaknya menghemat periode aktifkan pula Emulator, dengan cara klik lega menu New Emulator, dan biarkan proses pengaktifan Emulator selesai. Selepas Emulator aktif dan untuk mengkoneksikan projek kita dengan Emulator maupun Handset Android kita dapat memilih menu Connect to Device.

7. Sekarang waktunya lakukan memulai memprogram aplikasi kita dengan menciptakan menjadikan event keefektifan, pertaman-tama kita harus memahami hipotetis kerja aplikasi secara akal sehat terlebih dulu. Bakal Alarm ini karena kita ingin takhlik perhitungan perbanyakan maka kita membutuhkan dua buah angka sembarang (Random). Buat terlebih habis sebuah penghimpun var iabel, bakal menampar angka tersebut, kita dapat namakan netral andai disini angkaRandom1 dan angkaRandom2, kerjakan membuatnya klik pada workspace > defin > variable (atau bisa dari drawer Buil-In > Definition > Variable) drag ke cucur, klik lega blocks dan rename pustaka “fleksibel” menjadi angkaRandom1.

8. Kemudian cabut sebuah block Random Integer lakukan membuat batas angka random kita, pecah drawer Built-In > Math > Random Integer. Kemudian isi slot From dan To dengan skor yang kita inginkan, misal disini range angka acaknya yaitu antara 2 sd 9 bikin angkaRandom1, dan 10 sd 15 untuk angkaRandom2. 9. Kemudian, kita membutuhkan block event nan berfungsi mengeksekusi block-block event didalamnya, bilamana aplikasi dijalankan, ialah block Initialize, karena disini kita menggunakan cucur dgn nama Screen1, maka tanda bloknya yakni Screen1.Initialize, nan boleh rebut pecah drawer My Blocks > Screen1.Initialize. Disini kita akan menggunakan block Screen1.Initialize lakukan menampilkannya angka random yang kita dapatkan tadi, yakni dengan memasukkannya ke label LabelAngkaSatu dan LabelAngkaDua. Sampai tahap ini kita sudah bisa mencobanya pada emulator, yaitu dengan memilih menu Connect to Device.

10. Selanjutnya yaitu menangani event perbanyakan itu sendiri, kita akan membutuhkan hasil berpunca gerakan perkalian antara angkaRandom1 dan angkaRandom2. Dan kemudian membandingkanny dengan angka jawaban yang kita masukkan lega TextBoxJawaban , dan menaruh block kondisi untuk menilai apakah jawaban benar ataupun tidak. 11. Disini kita membutuhkan Block Event momen pentol ButtonJawab diklik, yaitu ButtonJawab.Click. Block ini kita ambil dari My Blocks > ButtonJawab > ButtonJawab.Click , kemudian block untuk perkalian skor berasal Built-In > Math > X Block operasi perkalian. Buat terlebih dulu block penadah variabel, kita namakan Hasil, yang digunakan kerjakan menggampar hasil perbanyakan. Masukkan block angkaRandom1 dan angkaRandom2 untuk dikalikan, kemudian hasilnya disimpanpada lentur Hasil yang telah kita cak bagi sebelumnya.

12. Kemudian rampas block kondisional If else , mulai sejak Built-In > Control > if else , ini kita akan gunakan bikin membandingkan antara nilai hasil perkalian dengan jawaban. Yakni Block Hasil dengan biji berasal TextBoxJawaban , apabila sama set LabelPenilaianJawaban dengan Block teks“Jawaban Benar”, apabila tak sama set LabelPenilaianJawaban dengan Block teks“Jawaban Salah”. 13. Setakat disini kita dapat mencobanya, sreg emulator. Ketik jawaban pada Textbox, kemudian klik pada tombol Klik Jawab. Maka apabila jawaban kita bersusila, maka akan mucul teks “Jawaban Benar”, sebagaimana dengan sebaliknya.

14. Tahap selanjutnya kita akan menambahkan event obstulen tanda bahaya, yaitu dengan menggunakan blocks komponen Clock1.Timer dan Sound1. Disini kita akan menyalakan terus menerus suara. Dari suku cadang Sound1, yang sudah lalu kita masukkan kedalam propertinya file suara. Idenya adalah, celaan akan terus berbunyi sejauh kita salah menjawab anggaran perbanyakan. Dan privat implementasinya kita menunggangi block block kondisional If else, lakukan membandingkan kondisi nan kita lakukan, yakni dengan membuat sebuah elastis dengan nilai 9 (sembilan) dan membuat sejauh nilai terbit laur Berbunyi = 9 , maka suara akan terus terdengar. Sementara itu cak bagi mematikannya merupakan kita menambahkan satu block yang akan mengeset variabel Berbunyi = 0 , yaitu ketika kita mengklik tombol Klik Jawaban

15. Terakhir kita menambahkan block close application, yang kita renggut berbunga drawer Built-In > Control > close application . Block ini merupakan event bikin menutup petisi, dan kita pasang puas fragmen block kondisi ButtonJawab.Click, sehingga aplikasi akan langsung tertutup momen kita mengklik tombol Klik Jawaban, dan jawaban kita bermoral.

16. Bakal menggunakan aplikasi ini pada HP Android, Download apalagi dari menu Package for Phone pada Desainer Komponen, memilah-milah Download to This Computer, sehingga aplikasi akan terdownload ke komputer kita, kemudian copy ke HP Android. Sortiran Download to Conected Phone dapat kita membeda-bedakan momen kita mengkoneksikan HP Android kita, dan mengaturnya pada mode USB debugging connected.

17. Bagi menggunakannya sebagai tanda bahaya, kita harus mengeset perian kapan petisi alarm ini akan berfungsi, dengan mengaturnya melalui permohonan Clock > Add Alarm > Set Periode > Application > pilih petisi Alarm sreg App to launch > Done . Ini signifikan aplikasi Sirene yang kita buat masih harus menggunakan petisi bukan bikin memanggilnya, karena disini kita belum membuat event kurnia untuk mengeset periode yang secara otomatis akan menjuluki aplikasi. Aplikasi yang kita cak bagi barusan, terasa sederhana dan mudah membuatnya, ini karena App Inventor memang didesain lakukan memuluskan siapapun menciptakan menjadikan aplikasi android. Teks:  Mulyadi, 2022, Membuat Aplikasi Android & Android App Inventor, Yogyakarta: Multimedia Center Publishing.  Tabloid PC Plus 2022

Source: https://pdfcoffee.com/download/modul-pembuatan-app-pdf-free.html