[Tutorial] Membangun Aplikasi Android via Adobe Flash CS5 Professional (dengan Teknologi Adobe AIR)

Pada kesempatan ini, saya akan memberikan gambaran bagaimana cara membangun atau mengembangkan aplikasi mobile pada ponsel berbasis OS Android dengan Adobe AIR dalam Flash CS5 Professional.

Bumbu-bumbu yang diperlukan adalah:

1. Android SDK (Windows/Mac) –> http://developer.android.com
2. Adobe Flash CS5 Professional –> http://www.adobe.com/products
3. AIR 2.5 runtime untuk Android –> http://labs.adobe.com/technologies/air2/android atau http://prerelease.adobe.com (sign-up now to participate in the AIR for android prerelease program)
4. AIR for Android extension untuk Flash CS5 Professional –> link yang sama dengan point (3)
5. (Tentu saja) Pengetahuan Anda tentang Flash CS5 IDE (Flash authoring tool) dan actionscript 3.0.   🙂

Saya asumsikan bahwa bumbu-bumbu di atas sudah Anda miliki.

Secara garis besar, alur yang akan kita lakukan adalah:

1. Menyiapkan komputer kita, sehingga koneksi USB ponsel Android bekerja dengan baik pada komputer Anda.
2. Meng-install AIR 2.5 runtime ke dalam ponsel Android (Eclair/FroYo).
3. Meng-install AIR for Android extension untuk Flash CS5 Professional.
4. Membangun applikasi Android di dalam Flash CS5 Professional.
5. Mem-publish applikasi yang sudah Anda bangun dan Meng-install aplikasi tersebut ke dalam ponsel Android Anda.

Bismillah… Semoga penjelasan saya di bawah ini cukup deskriptif.

===== LANGKAH PERTAMA =====
Anda extract terlebih dahulu bumbu (1) ke suatu direktori dalam hardisk Anda. (Dalam kasus ini, saya extract android-sdk_r06-windows.zip ke dalam direktori C:\Program Files\)
Apabila sudah berhasil di-extract, klik ganda SDK setup.exe sehingga muncul window seperti di bawah

Bila Anda pengguna OS Windows, klik Available Packages dan check USB Driver Package > Install Selected > Install. Tahap ini bertujuan agar koneksi antara USB komputer Anda dengan ponsel Android berfungsi dengan baik. Untuk pengguna OS Mac langkah ini tidak diperlukan.

Sambungkan ponsel Android Anda melalui USB dan uji apakah langkah pertama ini sudah dilakukan dengan benar atau belum. Pada command prompt atau terminal ketik

    cd C:\Program Files\android-sdk-windows\tools

lalu

    adb devices

Bila benar, pada command prompt akan muncul

    * daemon started successfully *
    List of devices attached
    ID_Android_Device_Anda    Device

===== LANGKAH KEDUA =====
Copy-kan bumbu (3), Runtime_Device_Froyo_20100517.apk, ke dalam direktori C:\Program Files\android-sdk-windows\tools
lalu ketik dalam command prompt

    adb install Runtime_Device_Froyo_20100517.apk

Tunggu hingga muncul

    pkg: /data/local/tmp/Runtime_Device_Froyo_20100517.apk
    Success

Bila tulisan ‘Success’ muncul, itu artinya AIR 2.5 Runtime telah berhasil di-install di dalam ponsel Android Anda.

===== LANGKAH KETIGA =====
Install AIR for Android extension dengan cara klik ganda pada bumbu (4), AIRforAndroid_FlashCS5_070510.zxp.

Secara otomatis program Adobe Extension Manager CS5 akan terbuka. Pada confirmation window-nya klik Accept/Yes.

Instalasi telah berhasil dilakukan.

===== LANGKAH KEEMPAT =====
Buka program Adobe Flash CS5 Professional. Pada Welcome Screen akan muncul satu opsi tambahan di bagian Create from Template,

Klik pada opsi tersebut (AIR for Android) > OK.

Untuk contoh kali ini, kita hanya akan membuat sebuah aplikasi sederhana, yaitu aplikasi drag-n-drop.
Dalam file Flash Anda, siapkan dua buah layer, layer actions dan layer circle. Setting background stage menjadi hitam.

Pada layer circle, buat sebuah lingkaran 100×100 pixels. Convert to Symbol (F8), beri nama mcCircle dengan registration point di tengah.

Selanjutnya, beri instance name circle_mc.

Kemudian, seleksi frame 1 layer actions. Ketikkan kode actionscript berikut

    circle_mc.addEventListener(MouseEvent.MOUSE_DOWN, goDrag);
    stage.addEventListener(MouseEvent.MOUSE_UP, goDrop);
    function goDrag(e:MouseEvent):void
    {
       circle_mc.startDrag();
    }
    function goDrop(e:MouseEvent):void
    {
       circle_mc.stopDrag();
    }

Simpan file Flash ini dengan nama Test.fla. Test applikasi dengan menekan Ctrl+Enter atau Cmd+Return.
Selain Test.swf, hasil compile yang muncul adalah Test-app.xml. Buka file Test-app.xml tersebut pada program text-editor apapun.
Perhatikan tag XML yang saya tandai dengan persegi merah!

Bila pada file Anda tertulis <version>1.0.0</version>, maka Anda harus mengubah tag dalam file Test-app.xml tersebut agar menjadi <versionNumber>1.0.0<versionNumber>. Jika tidak dilakukan, informasi yang saya baca dari dokumentasinya, Anda tidak akan bisa mem-publish file Flash ini menjadi file .apk (.apk merupakan ekstensi yang diterima Android).

===== LANGKAH KELIMA =====
Kita menuju publish setting (File > AIR Android Setting). Pada tab General, ikuti input berikut

Pada tab Deployment, klik Browse certificate. Jika belum punya, pilih create.
Lalu, masukkan password untuk certificate yang baru saja Anda buat. Kemudian, pilih salah satu opsi Android Deployment Type-nya. Dalam bagian After Publish, klik Browse lokasi Anda meng-extract Android SDK yang sudah dilakukan di LANGKAH PERTAMA.

Di bagian yang saya beri tanda persegi merah, itu bersifat opsional. Bila Anda memiliki ponsel Android dan sudah terhubung dengan komputer Anda, aplikasi yang baru saja Anda buat di Flash secara otomatis sudah ter-install dalam ponsel Anda. Akan tetapi, bila Anda tidak memiliki ponsel Android, pilihan tersebut jangan di-check.
Terakhir, klik Publish.

File Test.apk siap untuk didistribusikan.

Untuk melihat versi pdfnya, silakan download file ini. Semoga bermanfaat.

(Tambahan: Karena banyak yang meminta file extension-nya, saya upload-kan filenya di sini.

pass –> rulyardiansyah.wordpress.com

contents –> Runtime_Emulator_Froyo_20100930.apk, Runtime_Device_Froyo_20100930.apk, AIRforAndroid_FlashCS5_092910.zxp)

– ruly ardiansyah