Pengembangan Aplikasi Bahan Ajar Dalam Perangkat · PDF fileIDE sendiri adalah sebuah aplikasi...

JARC Seamolec | Pengembangan Aplikasi Bahan Ajar i

Pengembangan Aplikasi Bahan Ajar

Dalam Perangkat Bergerak

Prayitno

Pengembangan Aplikasi Bahan Ajar dalam Perangkat Bergerak © JARC Seamolec, 2013 Hak cipta dilindungi oleh undang-undang. Dilarang memperbanyak sebagian atau seluruh buku ini dalam bentuk apapun tanpa izin tertulis dari Seamolec. Penulis Prayitno Editor Prayitno Tim JARC Seamolec Cahya Kusuma Ratih Abdul Rizal Adompo Kristinanti Charisma Sandi Satya Nugraha Harits Cahya Nugraha Aji Wicaksono Mochamad Basofi

Seameo Seamolec

Jl. Cabe Raya, Pondok Cabe, Pamulang 15418 PO Box 59/CPA, Ciputat, Jakarta, Indonesia Phone: (62-21) 7422184 Fax: (62-21) 7422276 Website: http://www.seamolec.org

i

Kata Pengantar

Buku JENI tentang Pengembangan Aplikasi

Bahan Ajar dalam Perangkat Bergerak J2ME

ini dirancang untuk dapat digunakan oleh para

pendidik atau instruktur maupun umum untuk

membantu mereka dalam proses belajar di

bidang programming skill berbasis JENI.

Selain itu buku ini dapat dijadikan tutorial dalam mengembangkan

produk pembelajaran interaktif (Aplikasi) berbasis Java yang akan

difokuskan untuk pengembangan aplikasi berbasis Mobile, baik

dijenjang Perguruan Tinggi, SLTA, SLTP maupun masyarakat.

Buku ini berisi tentang proses pembuatan aplikasi sederhana

untuk perangkat bergerak meliputi materi tentang perangkat

bergerak, membangun aplikasi di handphone serta contoh projek

yang akan dibuat.

SEAMEO SEAMOLEC sebagai pengembang pembelajaran

terbuka dan jarak jauh di Asia Tenggara memandang bahwa

kurikulum JENI dan Aplikasi Permainan Edukatif berbasis

Mobile (Mobile Game Based Learning) dapat diintegrasikan

dalam pola pembelajaran terbuka maupun jarak jauh untuk

mendukung pembelajaran yang dapat dilakukan “dimana saja,

kapan saja, dan oleh siapa saja”. Oleh karena itu, dengan

disseminasi program JENI pada mitra-mitra SEAMOLEC, dapat

mendorong munculnya inovasi-inovasi media pembelajaran baru

berbasis ICT yang murah dan dapat diaplikasikan oleh seluruh

pelajar di pelosok Indonesia.

Akhir kata semoga buku ini dapaat memberikan manfaat.

Direktur SEAMEO SEAMOLEC

Dr. Ir. Gatot Hari Priowirjanto

JARC Seamolec | Suplemen Bahan Ajar Berbasis Mobile ii

DAFTAR ISI

BAB I Pendahuluan ............................................................................. 1

1.1 Era Mobile (Perangkat Bergerak) ....................................... 1

1.2. Java dan Netbeans .............................................................. 4

1.3 Spesifikasi ........................................................................... 7

1.4 Contoh Projek ..................................................................... 8

BAB II ISI ............................................................................................ 10

2.1. Persiapan Materi ................................................................... 10

2.2. Target Handphone ................................................................. 15

2.3. Persiapan Gambar, material, atau Resource ......................... 16

2.4 Bekerja dengan Netbeans Visual Midlet ................................ 17

2.5 Uji Coba ................................................................................... 49

BAB III Penutup ................................................................................. 51

3.1 Pengembangan Materi Bahan Ajar ......................................... 51

JARC Seamolec | Supplemen Bahan Ajar Berbasis Mobile 1

BAB I Pendahuluan

1.1 Era Mobile (Perangkat Bergerak)

Era mobile ditandai dengan meluasnya penggunaan peralatan

yang mengunakan teknologi tanpa kabel (wireless). Perangkat-

perangkat tersebut awalnya dominasi oleh Mobile phone (atau

populer disebut handphone/ponsel). Kemudian berbagai

aplikasi dan fitur ditambahkan dalam handphone sehingga

fungsinya lebih dari sekedar alat komunikasi suara. Mobile

phone kemudian dikenal dengan smart phone (ponsel pintar).

Trend terbaru perangkat mobile akhir-akhir ini adalah tablet PC

yang memiliki lebih banyak fungsionalitas perangkat mobile.

Menurut rilis laporan PBB yang ditulis oleh kompas pada 16

Februari 2010 diperkirakan tahun ini pengguna ponsel lebih

dari lima milyar pengguna. Sementara data yang dirilis

Wireless Intelligent menempatkan Indonesia pada peringkat

ke-6 pengguna ponsel dengan 116 juta pengguna (data tahun

2009). Hal ini tentu menunjukkan bagaimana penetrasi

teknologi mobile telah sedemikian cepat.

Gambar 1.1. Data Wireless Intlligent

JARC Seamolec | Suplemen Bahan Ajar Berbasis Mobile 2

Era mobile membawa kemudahan dalam berbagai bidang.

Dukungan teknologi, penggunaan yang relatif mudah, dan

perangkat yang semakin affordable membuat layanan-layanan

berbasis mobile tumbuh dengan subur. E-commerce, e-

banking, dan entertainment adalah bidang-bidang yang aktif

berkembang di era mobile.

Gambar 1.2. E-banking dengan perangkat mobile pada layanan salah satu

Bank di Indonesia

Gambar 1.3. Tampilan MLE (Mobile Learning Engine) untuk pengguna

Moodle di ponsel

JARC Seamolec | Pengembangan Aplikasi Bahan Ajar 3

Dunia pendidikan adalah dunia yang sangat dinamis. Berbagai

upaya dilakukan untuk meningkatkan kualitas teknik maupun

media transformasi ilmu pengetahuan. Sejalan dengan tren era

mobile maka menggunakan teknologi dan media mobile

sebagai suplemen bahan ajar adalah hal yang sangat tepat.

Perangkat telekomunikasi mobile/ponsel yang telah banyak

dimiliki oleh siswa dapat digunakan sebagai sarana untuk

belajar. Dengan dukungan teknologi Java Micro Edition bahan-

bahan belajar dapat dibuat dan disesuaikan dengan teknologi

yang dapat diaplikasikan pada ponsel yang mendukung java.

Hal ini akan memberikan fungsi tambahan terhadap ponsel.

Selain itu siswa dapat belajar kapanpun dimanapun.

Gambar .1.4. Suplemen bahan ajar yang telah dikembangkan Seamolec

Sampai pada bagian ini mungkin Anda yang masih awam

dengan bahasa pemrograman jangan khawatir terhadap

kemampuan Anda. Namun percayalah perlahan-lahan Anda


akan mampu membuat suplemen bahan ajar berbasis mobile ini

.

1.2. Java dan Netbeans

1.2.1 Berkenalan dengan Java

Java adalah salah satu bahasa pemrograman. Sementara bahasa

pemrograman dapat didefinisikan sebagai “Bahasa

pemrograman, atau sering diistilahkan juga dengan bahasa

komputer, adalah teknik komando/instruksi stAndar untuk

memerintah komputer.”

(http://id.wikipedia.org/wiki/Bahasa_pemrograman, tanggal

akses 02 November 2010). Beberapa bahasa pemrograman

yang lain diantaranya C, Visual Basic, PHP, dan Delphi.

Bahasa pemrograman inilah yang membuat perangkat dapat

diperintah untuk melakukan aksi sesuai dengan keinginan

pengguna.

Java dibuat pada tahun 1991 oleh James Gosling dan timnya

dari Sun Microsystem (saat ini diakuisisi oleh Oracle). Pada

awal pembuatannya bahasa ini dinamai Oak, namun ternyata

nama ini telah digunakan. Beberapa sumber menyatakan

penamaan bahasa ini menjadi Java adalah terinspirasi dari kopi

yang digemari oleh pengembang Java tersebut. Kopi itu berasal

dari Jawa (Java dalam bahasa Inggris).

Java memiliki beberapa platform (seri tertentu untuk

kebutuhan perangkat/teknologi khusus). Pada bahasan kita kali

ini kita akan menggunakan platform J2ME yang ditujukan

untuk perangkat ponsel. Pada awal langkah kerja kita akan

menginstal JDK (Java Development Kit) sebagai plaftrom


standar untuk pengembangan aplikasi berbasis java dan

kemudian mengintegrasikannya dengan IDE Netbeans yang

akan dibahas pada sub berikutnya. Gambar di bawah ini

menunjukkan susunan platform Java.

Gambar 1.5. Berbagai Platform Java

Pada dekade ini java sangat populer digunakan dalam dunia

teknologi informasi. Beberapa kelebihan java sehingga

membuatnya populer adalah:

Platform independen, aplikasi java dapat

berjalan pada berbagai sistem operasi dan

berbagai perangkat.

Gratis, java dan tools-tools integrated

development environtment (software untuk


memudahkan penulisan pemrograman) gratis

untuk digunakan.

Kolaborasi komunitas pengguna yang besar,

banyak sekali JUG (java user group) yang

tesebar diseluruh dunia.

1.2.2. Berkenalan dengan Netbeans

Netbeans adalah sebuah IDE (integrated development

environtment) populer yang digunakan untuk menulis kode

program. IDE sendiri adalah sebuah aplikasi yang

memudahkan penulis program untuk membuat aplikasi. Di

dalamnya terdapat code writer dan editor serta plugin lain yang

terintegrasi. Hal ini membuat penulisan program menjadi lebih

mudah. IDE juga menyediakan link ke compiler (penerjemah

bahasa pemrograman menjadi kode binary yang dipahami

mesin komputer). Saat ini versi Netbeans termutakhir bulan

desember 2010 yang dirilis adalah 6.9.1.

Netbeans memiliki beberapa kelebihan dibandingkan dengan

IDE yang lain. Netbeans memiliki game builder yang dengan

mudah dapat digunakan untuk mendesain sebuah game. Satu

lagi kelebihan netbeans yang akan banyak kita eksplorasi pada

bagian ini adalah Visual Midlet, dimana kita bisa membuat

aplikasi mobile hanya dengan drag n drop elemen di Visual

Midlet. Visual Midlet ini berbasis bahasa pemrograman Java.

Menarik bukan? Anda tidak perlu lagi bersusah payah

berjibaku dengan bahasa pemrograman, cukup klik dan

tarik dan jadilah aplikasi Anda.


Gambar 1.6. Panel Visual Midlet

1.3 Spesifikasi

Pada bagian ini kita akan membahas spesifikasi perangkat

ponsel yang dapat digunakan untuk menggunakan suplemen

bahan ajar berbasis mobile dan spesifikasi komputer yang dapat

digunakan untuk pengembangan aplikasi ini. Komputer yang

disarankan untuk bekerja dengan JDK dan Netbeans adalah:

Processors: Intel Pentium 4, Intel Centrino, Intel Xeon,

or Intel Core Duo (atau yang kompatibel) minimum 1.8

GHz ( direkomendasikan 2.6 GHz Intel Pentium IV

atau yang setara)


Operating systems: Microsoft Windows XP Service

Pack 3 atau Windows Vista Home Premium, Business,

Ultimate, or Enterprise (certified for 32-bit editions),

Linux family, Machintos.

Memory: 512 MB of RAM (direkomendasikan 1 GB)

Disk space: 778 MB of free disk space

(direkomendasikan 1 GB)

Web Browsers: Internet Explorer 6 minimum, FireFox

2.0 minimum

Java SE Development Kit (JDK): JDK 6 Update 7

minimum (direkomendasikan JDK 6 Update 13) JDK

ini sudah termasuk Java Runtime Environement(JRE)

yang digunakan untuk menjalankan aplikasi berbasis

Java.

Sedangkan telepon seluler yang disarnakan adalah telepon

seluler apapun yang mendukung Java. Biasanya dapat dengan

mudah teridentifikasi saat kita membeli telepon seluler.

Dukungan Java juga dapat dicek pada sistem operasi ponsel,

dikenali dengan adanya logo java ( ).

1.4 Contoh Projek

Modul ini juga akan memberikan sebuah contoh proyek yang

aplikatif. Proyek ini dapat Anda pelajari sebagai dasar

membangun proyek suplemen bahan ajar berbasis mobile Anda

sendiri. Pada modul ini kita akan membuat sebuah suplemen

bahan ajar tentang rumus-rumus matematika geometri dua

dimensi. Langkah demi langkah pembuatan suplemen bahan

ajar akan dibahas dalam modul ini dengan menggunakan

Visual Midlet Netbeans.


Gambar 1.7. Contoh Project

Tugas / Latihan 1

Ceritakan Era digital / perangkat bergerak berdasarkan pengalaman

Anda dan pendapat disertai dengan referensi. Kirim dalam bentuk

softcopy file pdf dan dimasukkan dalam Elearning edmodo!


BAB II ISI

2.1. Persiapan Materi

2.1.1. Installasi JDK

Hal pertama yang harus dilakukan adalah installasi JDK. JDK

dapat berjalan baik di sistem operasi Linux maupun Windows.

Untuk installasi berbasis Linux dapat menyesuaikan dengan

cara installasi sesuai dengan distro masing-masing. Sementara

yang akan lebih banyak dibahas disini adalah installasi berbasis

sistem operasi Windows. Installasi dimulai dari file installer

JDK. Versi JDK yang penulis gunakan adalah versi paling

mutakhir dari JDK yaitu JDK 6 update 22 yang bisa di

download di situs sun.com. Kemudian lakukan installasi

dengan cara klik ganda file installer. Langkah instalasi pada

umumnya sama dengan installasi program lainnya.

Gambar 2.1. Mendapatkan file installer JDK 6 update 22


2.1.2. Installasi Netbeans

Netbeans yang akan kita gunakan adalah Netbeans 6.9.1 yang

bisa di download di situs http://netbeans.org/download

Gambar 2.2. Download Installer dari situs netbeans.org

Gambar 2.3. Memulai proses installasi


Gambar 2.4. Perjanjian Lisensi

Gambar 2.5. Menentukan lokasi installasi


Gambar 2.6. Summary installasi

Gambar 2.7. Proses Installasi


Gambar 2.8. Installasi selesai dan tawaran registrasi (tidak wajib)

2.1.3. Persiapan Materi Suplemen Bahan Ajar

Bahan-bahan materi yang akan kita jadikan Suplemen bahan

ajar adalah rumus-rumus bangun dua dimensi sesuai dengan

data yang penulis dapatkan dari

http://id.wikipedia.org/wiki/Bangun_datar, http://www.belajar-

matematika.com/matematika-

sd/Keliling%20dan%20Luas%20Bangun%20Datar.pdf., dan

BSE karangan Atik Wintarti dkk berjudul Contextual Teaching

Learning Matematika kelas 7. Kemudian dari bahan-bahan

yang didapatkan kita akan segera membuat suplemen bahan

ajar ini. Bagi Anda yang akan mengembangkan suplemen


bahan ajar sendiri Anda dapat menyiapkan terlebih dahulu

material sesuai dengan topik bahasan yang akan Anda buat.

2.2. Target Handphone

Dalam membuat aplikasi ponsel target ponsel sangat penting

untuk ditentukan sebelumnya. Hal itu karena bervariasinya

ukuran layar dan versi MIDP telepon seluler. Ukuran layar bisa

berukuran 120 x 240 pixel, 240 x 320 pixel, maupun 320 x 240

pixel. Bahkan telepon seluler termutakhir yang menggunakan

touch screen rata-rata berukuran diagonal 2,6”-3”. Hal ini

tentu menyulitkan dalam mendesain berbagai komponen isi

aplikasi.

Ponsel dengan berbagai variasi ukuran layar

Berdasarkan hal-hal tersebut maka aplikasi suplemen bahan

ajar ini akan menggunakan target ponsel yang umum. Visual

midlet menggunakan high level user interface dimana visual

midlet mampu menyesuaikan dengan berbagai jenis ponsel.

Untuk konten-konten berupa gambar penulis akan

menggunakan referensi ukuran layar 240 x 320 pixel.


2.3. Persiapan Gambar, material, atau Resource

Setelah bahan-bahan pembelajaran kita dapatkan langkah

selanjutnya adalah menyiapkan resource lain seperti gambar,

suara, dan teks. Berikut ini gambar-gambar yang akan

digunakan dalam aplikasi Suplemen bahan ajar.

Gambar 2.9. Bahan yang akan digunakan dalam aplikasi suplemen


2.4 Bekerja dengan Netbeans Visual Midlet

2.4.1. Membuat Project Baru

Setelah semua persiapan telah disiapkan maka langkah

selanjutnya adalah mulai membuat aplikasi suplemen bahan

ajar ini. Buka Netbeans Anda (klik start menu cari Netbeans).

Setelah jendela aplikasi terbuka buatlah sebuah project baru

dengan cara mengklik icon new project atau dengan mengklik

File > New project. Pilih Java ME dan pilih Mobile Application

kemudian tekan Next.

Gambar 2.10. Pembuatan Project baru di Netbeans

Selanjutnya beri nama project dan tentukan lokasi

penyimpanannya. Secara default Netbeans akan


menyimpannya di My Documents\netbeansproject\. Hilangkan

juga centang pada create Hello Midlet karena kita akan

membuatnya sendiri.

Gambar 2.11. Pemberian nama project baru

Pada langkah selanjutnya Anda akan diminta untuk memilih

Emulator dan device serta versi CLDC dan MIDP. Pada

emulator platform Anda tidak perlu menggantinya tetapi

sesuaikan device yang sebelumnya ClamshellCdcPhone

menjadi Default Cldc phone untuk mendapatkan tipe emulator

ponsel yang memiliki layar 240 x 320 pixel. Versi MIDP ganti

ke pilihan 2.0 untuk memperluas kompabilitas dengan ponsel.


Gambar 2.12. Konfigurasi platform dan profil

Setelah membuat project baru selesai Anda akan mendapatkan

project Anda di sisi panel kiri. Langkah selanjutnya adalah

membuat class Midlet dengan Visual Midlet. Hal ini dapat

dilakukan dengan cara klik kanan pada default package di

folder source packages, kemudian pilih Visual Midlet. Anda

dapat memberi nama class Midlet sesuai keinginan Anda tapi

penulis lebih senang membiarkannya tanpa perubahan. Tekan

tombol finish untuk membuat Visual Midlet.


Gambar 2.1.3. Membuat class Midlet dengan Visual Midlet

Gambar 2.1.4. Memberi nama class Visual Midlet


2.4.2. Mengenal Bagian-bagian Jendela Kerja Visual

Midlet

Tampilan awal Visual Midlet setelah dibuat kurang lebih

seperti gambar di bawah ini. Pastikan Anda berada pada tab

Flow. Jendela Visual Midlet terdiri dari beberapa bagian yaitu

kanvas, tab, dan pallet. Dengan berpindah tab Anda dapat

berpindah dari tampilan flow (aliran aplikasi), ke screen

(tampilan saat aplikasi dijalankan), source (tampilan asli kode

program, umumnya tidak diperlukan kecuali mengedit kode

program), dan analizer (penganalisa efisiensi aplikasi). Canvas

adalah tempat Anda meletakkan obyek-obyek yang bisa ditarik

(drag n drop) dari panel Pallete.

Gambar 2.15. Bagian-bagian dari jendela kerja Visual Midlet


2.4.3. Menyiapkan Material

Sebelum memulai menambahkan obyek pada Visual Midlet

ada baiknya kita menyiapkan segala bahan yang diperlukan.

Buatlah sebuah package baru di folder Soruce packages

dengan cara klik kanan Source Packages kemudian pilih New

Java Packages. Beri nama sesuai dengan isi dan klik tombol

finish untuk membuat package. Anda akan melihat sebuah

package baru dengan nama yang Anda tentukan di folder

Source packages.

Gambar 2.16. Menambahkan package baru


Gambar 2.17. Memberi nama package

Gambar 2.18. Mengkopi file-file yang diperlukan dari Windows Eksplorer


Gambar 2.19. Proses tempel (paste) file ke dalam package

2.4.4. Membuat Splash screen

Setelah bahan-bahan telah siap di dalam package kita bisa

memulai aktivitas menambahkan obyek pada aplikasi kita.

Pertama-tama kita akan membuat sebuah Splash screen.

Splash screen adalah layar yang muncul secara singkat di awal

aplikasi dijalankan. Tujuannya agar pengguna tidak bosan


ketika aplikasi sedang dimuat oleh ponsel. Di samping itu

splash screen juga dapat digunakan sebagai identitas aplikasi

dan pembuat aplikasi, dalam hal ini pembuat suplemen bahan

ajar. Tarik Menu Splash screen dari pallete ke atas jendela

kanvas

Gambar 2.20. Membuat obyek splashScreen

Selanjutnya klik dua kali box splashScreen yang telah Anda

tambahkan tadi. Akan muncul jendela baru (jendela tab screen)

tempat Anda dapat mengedit tampilan obyek splash screen ini.


Klik dua kali pada bagian image untuk masuk ke jendela baru

untuk menambahkan gambar.

Pada jendela penambahan gambar tekan tombol add untuk

menambahkan gambar, kemudian browse untuk memilih

gambar yang sesuai (gambar splash screen). Tekan tombol ok

dan lihat hasilnya.

Terdapat beberapa properties yang dapat diatur pada obyek

splashScreen ini. Pada tab properties Anda dapat mencentang

full screen untuk membuat tampilan menjadi full screen. Selain

itu Anda juga dapat mengatur time out/lama waktu kemunculan

splash screen (dinyatakan dalam satuan mili detik).

Gambar 2.21. Tampilan layar/screen dari obyek splash screen


Gambar 2.22. Menambahkan gambar pada obyek

Gambar 2.23. Tampilan layar setelah penambahan gambar


2.4.5. Membuat Menu Awal

Setelah selesai dengan splash screen sekarang kita akan

membuat Menu. Menu ini berguna sebagai daftar pilihan yang

menentukan kemana pengguna akan melanjutkan. Kita akan

membuat empat menu yaitu Materi, Latihan, Tentang, dan

Keluar. Tarik menu List dari panel Pallete ke atas kanvas.

Gambar 2.24. Pembuatan obyek List

Langkah selanjutnya adalah menambahkan item pilihan. Hal ini

dapat diakukan dengan cara klik kanan pada box list yang baru

saja kita tambahkan tadi dan pilih List Element. Lakukan

berulang sampai dengan empat kali (sesuai kebutuhan).

Gantilah tulisan list elemen tersebut dengan double click pada

list yang ada. Ganti nama daftar sesuai dengan yang telah


direncanakan yaitu list untuk materi, latihan, halaman tentang,

dan keluar.

Gambar 2.25. Penambahan List Element untuk Menu

Sama seperti obyek splash screen Anda dapat men-double klik

obyek list untuk menambahkan gambar. Tambahkan gambar

kecil/ikon pada menu agar terlihat lebih menarik. Langkah-

langkahnya sama dengan memberi gambar pada splash screen.

Anda harus terlebih dahulu mengklik tombol add untuk

menambahkan obyek gambar. Setelah obyek gambar terbuat

Anda dapat memilih gambar yang sesuai. Ingat Netbeans hanya

mendukung format gambar .png.


Gambar 2.26. Menambahkan gambar pada list

Gambar 2.27. Memilih gambar yang tepat


Gambar 2.28. Hasil akhir list yang telah diberi gambar

2.4.6. Membuat Menu Materi

Setelah membuat List untuk menu awal langkah selanjutnya

adalah membuat list untuk daftar materi. Dengan langkah yang

sama tambahkan sebuah list baru dari panel. Tambahkan pula

list element pada obyek list yang telah kita buat tadi sesuai

dengan kebutuhan. Selanjutnya ganti nama list elemen sesuai

dengan kebutuhan kita.

Gambar 2.29. Membuat list untuk daftar materi


2.4.7. Mengatur Alur Program

Sampai dengan tahap ini Anda telah memiliki empat buah

obyek. Nah, kita dapat memberikan alur program yang tepat.

Klik dan tarik blok Started pada obyek Mobile Device ke

splash screen. Anda akan meilihat sebuah panah muncul. Anda

baru saja memerintahkan aplikasi untuk memulai splash screen

saat pertama kali dijalankan.

Selanjutnya tarik panah alur dari Dissmiss_command pada

splash screen menuju obyek menu. Dengan langkah ini Anda

baru saja memerintahkan aplikasi untuk menampilkan menu

setelah splash scren ditampilkan sesuai time out yang Anda

atur sebelumnya.

Langkah berikutnya tarik panah dari blok Materi belajar ke List

yang berisi daftar materi belajar. Anda tentu sudah bisa

menebak tujuan langkah yang Anda lakukan barusan.

Kemudian tariklah blok Keluar pada Menu ke obyek mobile

device. Hal ini berarti aplikasi akan keluar saat list keluar

dipilih.

Cobalah menekan F6 atau icon Play pada toolbar untuk

melihat hasilnya. Emulator ponsel akan tampil dan

mensimulasikan aplikasi Anda.


Gambar 2.30. Memberikan alur aplikasi

2.4.8. Membuat Materi Belajar

Sekarang tariklah sebuah form dari Palet. Anda akan membuat

sebuah obyek form pada kanvas. Di form inilah Anda akan

menempatkan materi pembelajaran. Tarik panah alur aplikasi

dari blok persegi pada box list ke form. Anda akan

menciptakan alur aplikasi.


Gambar 2.31. Pembuatan obyek form

Selanjutnya tambahkanlah obyek baru pada form dengan cara

klik kanan > New/Add. Tambahkan obyek Image dan String.

Setelah itu klik dua kali obyek form untuk masuk ke tampilan

layar dan melakukan pengeditan. Tambahkan gambar seperti

cara yang telah dibahas sebelumnya. Klik string item untuk

menambahkan tulisan tentang materi Anda. Akhiri proses

editing dengan menekan tombol enter karena jika tidak peng-

edit-an tidak akan tersimpan.


Gambar 2.32. Menambahkan obyek pada form

Gambar 2.33. Tampilan layar obyek form


Gambar 2.34. Menambahkan gambar pada form

Gambar 2.35. Layar setelah penambahan materi


Anda dapat mengganti nama-nama obyek yang ada di canvas

dengan cara klik dua kali nama yang tertampil tebal.

Tambahkan sebuah obyek BackCommand pula pada form yang

telah berganti nama menjadi persegi. Hal ini bertujuan untuk

menambahkan sebuah tombol back yang dapat membawa

pengguna ke menu daftar materi. Hal ini akan memudahkan

navigasi pengguna. Ulangi proses penambahan form ini

sebanyak sesuai dengan kebutuhan. Tambahkan satu persatu

materi dan lengkapi pula dengan tombol Back. Jangan lupa

untuk memberikan alur program yang sesuai.

Gambar 2.36. Menambahkan back command


Gambar 2.37. Hasil akhir setelah semua materi tertambahkan dan alur

program telah diatur

Sampai dengan proses ini Anda telah membuat sebuah obyek

list yang digunakan untuk membuat menu. Kemudian Anda

juga telah berhasil membuat splash screen dan satu per satu

materi melalui obyek form. Pada bagian selanjutnya Anda akan

belajar membuat kuis dan membuat halaman ‘tentang

suplemen’.


2.4.9. Membuat Kuis/Latihan Soal

Langkah pertama untuk membuat kuis adalah dengan membuat

obyek form baru. Tarik tombol form pada pallete ke atas

kanvas kerja. Selanjutnya tambahkan image item dan string

item. Langkah selanjutnya untuk mengisi image item dan string

item tentu Anda masih ingat bukan?

Yang akan kita bahas kali ini lebih berfokus pada pembuatan

pilihan jawaban dengan menggunakan choice group.

Tambahkan choice group dengan cara klik kanan dan add >

choice group. Seperti tampak pada gambar dibawah ini

2.38. Menambahkan obyek choice group pada form


Kemudian pada tab screen akan muncul blok choice group.

Pada blok ini dengan klik kanan tambahkan choice item

sebanyak yang Anda perlukan.

Menambahkan 2.39. Choice element pada choice group

Sekarang perhatikan choice element yang telah Anda

tambahkan, berbentuk kotak bukan? Hal tersebut menandakan

bahwa tipe choice group masih multiple, dengan kata lain

pengguna dapat memilih lebih dari satu pilihan. Untuk

menjadikannya exclusive/pengguna hanya dapat memilih satu


pilihan gantilah nilai properties choice group pada bagian Type

menjadi EXCLUSIVE.

Gambar 2.40. Screen kuis

Jika pilihan sudah berubah menjadi bulat maka Anda telah

berhasil mengganti tipe choice group. Langkah selanjutnya

gantilah choice element dengan pilihan jawaban yang Anda

inginkan. Pastikan terdapat satu jawaban yang benar, dari

jawaban ini lah kita akan membuat penilaian.


Gambar 2.41. Hasil editing choice element

Sejauh ini Anda telah berhasil membuat bagian-bagian utama

kuis. Sekarang kita akan sedikit memodifikasi kode program.

Sedikit sulit memang tapi penulis yakin Anda akan mampu

melakukannya. Klik tab source untuk masuk ke jendela baris

kode program. Tampilannya akan menjadi seperti ini:


Gambar 2.42. Tampilan asli baris kode program pada tab Source

Tambahkan baris kode berikut dibawah baris public class

visualMIDlet ....

int nilai = 0;

Baris kode program tersebut berfungsi untuk membuat variabel

yang akan menyimpan nilai Anda.


Langkah selanjutnya tinggal menambahkan tombol utuk

kembali dan men-submit pekerjaan quiz/melihat nilai.

Tambahkan okCommand dan cancelCommand pada obyek

form kuis/soal latihan yang Anda buat.

Gambar 2.43. Menambahkan tombol OK dan Cancel

Kemudian ganti properties tombol OK tersebut. Pada bagian

label ganti nilai yang sebelumnya ‘OK’ menjadi ‘Kirim &

Lihat nilai’.


Gambar 2.44. Merubah properties label tombol Ok

Selanjutnya kita akan menambahkan kode ke tombol

okCommand ini, sehingga ketika tombol ditekan aplikasi

mampu mendeteksi jawaban. Klik kanan okCommand dan pilih

Go To Source.


Gambar 2.45. Menuju ke baris kode

Tambahkan kode di bawah ini:

if (choiceGroup.getSelectedIndex()==0)

{

nilai+=25;

getStringItem3().setText("Nilai kamu

adalah "+nilai);

}

Maka baris kode akan menjadi seperti gambar di bawah ini:


Gambar 2.46. Baris kode okCommand (bagian yang berwarna abu-abu tidak

dapat diedit)

Selanjutnya buat sebuah obyek baru. Obyek baru ini akan kita

gunakan untuk menampilkan nilai hasil kuis tadi. Beri nama

obyek tersebut ‘hasil’. Pada obyek ini tambahkan string item

juga. Masuklah ke tab Souce untuk menambahkan kode

program ini pada blok kode program yang merepresentasikan

obyek yang baru kita buat.

stringItem3 = new StringItem("Nilai kamu

adalah "+nilai, null);


Gambar 2.47. Penambahan baris kode.

Lanjutkan dengan langkah terakhir yaitu memberikan alur yang

tepat. Arahkan tombol cancel kembali ke Menu awal dan

tombol Ok ke obyek hasil. Anda dapat menguji aplikasi Anda.

Gambar 2.48. Hasil akhir alur aplikasi


Berhasil bukan? Tambahkan lebih banyak pertanyaan pada

kuis!

Nah sekarang dengan kemampuan dan pengalaman Anda tentu

tidak sulit membuat obyek ketika menu ‘tentang’ ditekan

bukan?

Selamat Mencoba !

2.5 Uji Coba

Aplikasi-aplikasi yang dibuat dengan Java dapat langsung

digunakan di telepon genggam (tentunya yang mendukung

Java). Telusuri folder dimana Anda membuat project (lokasi

default di MyDocuments/Nebeans Project/namaProject) dan

kopikan file namaaplikasiAnda.jad dan

namaaplikasiAnda.jar pada ponsel.

Berikut ini merupakan hasil pengujian yang penulis lakukan

pada emulator. Anda dapat menguji aplikasi pada ponsel Anda

masing-masing.


Gambar 2.49. Rangkaian uji coba pada emulator

Tugas / Latihan 2

Buat file Hello Mobile pertama buatan Anda dalam netbeans. Kirim

dalam bentuk softcopy file .zip / .rar dan dimasukkan dalam Elearning

edmodo!

Tugas / Latihan 3

Buat Mind Map / Action plan project yang akan anda buat dalam

bentuk softcopy file pdf dan dimasukkan dalam Elearning Edmodo!


BAB III Penutup

3.1 Pengembangan Materi Bahan Ajar

Ketika Anda telah sampai pada bagian ini tim penulis

mengharapkan Anda telah mampu membuat suplemen bahan

ajar dengan menggunakan perangkat mobile. Penulis harap

dengan keberhasilan itu Anda akan mampu meningkatkan

kualitas proses pembelajaran yang Anda ampu. Lebih jauh

penulis berharap Anda mampu mengembangkan suplemen

bahan ajar tersebut dengan lebih variatif, lebih baik, dan

menarik. Berbagai e-book maupun buku-buku yang telah

diterbitkan oleh Seamolec tersedia untuk membantu Anda

belajar lebih jauh lagi.

Selamat belajar dan berkarya!

Tugas / Latihan 4

Laporkan Progress Perkembangan projek Anda melalui edmodo baik

berupa projek netbeans, ataupun video singkat dalam Elearning

edmodo!

Tugas / Latihan 5

Laporkan hasil projek akhir anda dalam file pdf dan video singkat

produk serta kirimkan dalam Elearning Edmodo!


Profil Penulis

Prayitno. Lahir di Semarang, 10 April

1985. Menyelesaikan pendidikan dasar di

SDS. Bandarharjo Semarang kemudian

melanjutkan pendidikan di SLTP Negeri

36 Semarang. Setelah menamatkan

jenjang SLTP kemudian melalang buana

di dunia Sekolah Teknik dengan

menempuh pendidikan di SMK Negeri 7

(STM Pembangunan) Semarang mengambil jurusan Teknik Elektronika Industri dan lulus

pada tahun 2005. Karena tidak puas dengan jenjang pendidikan

SMK, lalu melanjutkan lagi pengembaraan di dunia

perkuliahan dengan memperoleh beasiswa dari DIKMENJUR

dengan program D4 Joint Program BA Malang – PENS ITS

Surabaya dengan pendidikan 3,5 tahun dan gelar S.ST.

jurusan Teknik Informatika serta lulus pada tahun 2009

dengan predikat cumlaude. Tahun 2012 telah menyelesaikan

pendidikan S2 Magister Teknik di ITB konsentrasi

TMDG(Teknik Media Digital dan Game) dengan beasiswa

dari SEAMOLEC.

Pengembangan Aplikasi Bahan Ajar Dalam Perangkat · PDF fileIDE sendiri adalah sebuah aplikasi...

Documents

Transcript of Pengembangan Aplikasi Bahan Ajar Dalam Perangkat · PDF fileIDE sendiri adalah sebuah aplikasi...