Membuat Aplikasi Menggambar Pada Flash (ActionScript 3.0)

Kali ini nggak ada tutorial ya bro.. soalnya aku dapet source code ini dari web udah lama banget, lupa sumbernya mana... aku sendiri belum paham koding aplikasi ini.. hahaha..

Fitur aplikasi menggambar ini lumayan lengkap untuk aplikasi sederhana, diantaranya :
* Mengganti warna pensil/brush dan teks
* Penghapus
* Menyimpan gambar (Joss tenan iki..)

Berikut screenshotnya :

Udah lah download langsung aja source code nya..
credit to original creator, maaf lupa.

DOWNLOAD

Membuat Aplikasi Deret Fibonacci Pada Flash (ActionScript 3.0)

Sesuai janji postingan sebelumnya, kali ini tentang menampilkan deret fibonacci sesuai suku yang dimasukkan. Langsung aja ke langkah kerjanya.

1) Buka Adobe Flash Pro kamu, lalu buat dokumen baru ActionScript 3.0

2) Buat sebuah input text, sebuah dynamic text, sebuah tombol, dan static text(opsional sih..) pada stage. 

Lihat gambar berikut, perhatikan objek yang dipilih dan propertinya (klik gambar untuk memperbesar) :

3) Buat layer baru, tambahkan script :

import flash.events.MouseEvent;
import flash.events.Event;
import flash.events.TextEvent;
import flash.events.KeyboardEvent;

var suku,a,b,c:int;
suku_txt.restrict = "0-9";
ok_btn.addEventListener(MouseEvent.CLICK,fibo);
function fibo(e:MouseEvent):void
{
hasil_txt.text = "";
suku = Number(suku_txt.text);
a = 1;
b = 1;
if (suku == 1)
{
hasil_txt.appendText(a.toString());
}
else if (suku == 2)
{
hasil_txt.appendText(a.toString());
hasil_txt.appendText(",");
hasil_txt.appendText(b.toString());
}
else if (suku > 2)
{
hasil_txt.appendText(a.toString());
hasil_txt.appendText(",");
hasil_txt.appendText(b.toString());
hasil_txt.appendText(",");
for (var i:int=3; i<=suku; i++)
{
c = a + b;
a = b;
b = c;
hasil_txt.appendText(c.toString());
hasil_txt.appendText(",");
}
hasil_txt.text = hasil_txt.text.substring(0, hasil_txt.text.length-1);;
}
}

4) Test movie

Selamat mencoba, dan juga yang paling penting... dipahami LOGIKA-nya.. okeeehh..

Membuat Konversi Angka/Bilangan ke Terbilang/Teks Menggunakan Flash (ActionScript 3.0)

Udah lama banget bro nggak update nih blog. Sekitar setahun mungkin, maklum aja... orang sok sibuk.. wkwk.. Ini ada tutorial untuk membuat konversi bilangan menjadi terbilang broh.. Misal angka 1 menjadi "satu" dan seterusnya.

Diperhatikan juga, ini tutorial tujuannya untuk memahami LOGIKA scriptnya yah, bukan tampilan aplikasi dan tetek bengek lainnya, urusan itu bisa dioprek sendiri lah. Soalnya ini aku dapet dari logika bahasa C hasil googling... :p

*)FYI, ini sebenernya soal tes waktu mau ngelamar kerja.. yah, sekedar sharing aja..semoga bermanfaat.

1) Buka Adobe Flash Pro kamu, lalu buat dokumen baru ActionScript 3.0

2) Buat sebuah input text, sebuah dynamic text, sebuah tombol, dan static text(opsional sih..) pada stage. 

Lihat gambar berikut, perhatikan objek yang dipilih dan propertinya (klik gambar untuk memperbesar) :

3) Buat layer baru, lalu tambahkan script berikut :

import flash.ui.Mouse;

var satuan:Array = ["","satu","dua","tiga","empat","lima","enam","tujuh","delapan","sembilan"];

var n:int;

ok_btn.addEventListener(MouseEvent.CLICK,konversi);

function konversi(e:MouseEvent):void

{

n = int(input_txt.text);

trace(n);

hasil_txt.text = convert(n);

}

function convert(a:int):String

{

if (a<10 font="">

{

return satuan[a];

}

else if (a == 10)

{

return "sepuluh";

}

else if (a == 11)

{

return "sebelas";

}

else if (a < 20)

{

return satuan[a - 10] + " belas";

}

else if (a<100 font="">

{

return satuan[(a-(a%10))/10] + " puluh " + convert(a%10);

}

else if (a < 1000)

{

return (a < 200 ? "seratus " : satuan[(a-(a%100))/100] + " ratus ") + convert(a%100);

}

else if(a < 1000000)

{

return (a < 2000 ? "seribu " : convert((a-(a%1000))/1000) + " ribu ") + convert(a % 1000);

}

else if(a < 1000000000)

{

return convert((a-(a%1000000))/1000000) + " juta " + convert(a%1000000)

}

else

{

return "Overload, maksimal cuma sampai JUTA :P";

}

}

4) Jalankan movie, nih screenshot hasil movienya.

Selamat mencoba, tunggu post selanjutnya... masih berhubungan dengan soal tes yang aku dapat.. Bye..

Memainkan File MP3 Eksternal Menggunakan Flash (ActionScript 2.0)

Memainkan file suara tidak harus selalu dengan mengimportnya kedalam dokumen flash secara langsung, selain itu akan lebih memberatkan dokumen tersebut. Nah, kali ini kita akan membuat program untuk memainkan file MP3 eksternal kedalam file swf yang akan kita buat. Berikut ini langkah-langkahnya :

1. Buat flash document baru 250 x 200 pixels, tidak perlu terlalu besar karena tidak terlalu berguna.
2. Buat dua buah tombol play dan stop dan masing-masing diberi instance name “play_btn” untuk tombol play, dan “stop_btn” untuk tombol stop.
   
   

   

   
   
3. Simpan file disebuah folder baru
4. Siapkan file mp3 yang ingin anda mainkan, misal bernama “musik.mp3” kedalam folder dimana anda menyimpan file flash yang barusan anda buat.
5. Kembali ke program flash, Klik frame 1 layer 1, tekan F9 lalu masukkan script :

//membuat variabel baru bernama murottal

var murottal:Sound = new Sound();

play_btn.onRelease = function() {

//memanggil 114.mp3 ketika tombol play_btn ditekan lalu dilepaskan

//nama file mp3 harus sesuai dengan yang akan dimainkan

murottal.loadSound("musik.mp3", true);

//mengatur volume menjadi 200

murottal.setVolume(200);

};

stop_btn.onRelease = function() {

//menghentikan suara ketika tombol stop_btn ditekan lalu dilepaskan

murottal.stop();

};

6. Tekan Ctrl+Enter untuk test movie. Tekan tombol play untuk memainkan musik, dan stop untuk berhenti.

Keterangan :

Jika anda ingin memainkan file mp3 dari folder lain, maka harus jelas dimana alamat file mp3 tersebut, misal “D://sound/musik.mp3”.
Ingat! Kesalahan penulisan huruf seperti tidak menulis huruf kapital seperti pada nama file mp3 yang sebenarnya tidak akan berpengaruh, tetapi kurang atau kelebihan spasi jika nama file mp3 menggunakan spasi mengakibatkan error dalam meload file.

Untuk lebih jelasnya, silakan download sourcenya disini atau disini

Mengganti Warna Objek Pada Flash (ActionScript 2.0)

Kali ini kita akan membuat kursor yang akan berubah warna ketika menekan tombol warna yang diingankan. Script dasar yang digunakan adalah “setRGB()”. Penulisannya adalah :

Variable.setRGB(0xRRGGBB)

Kode RR (red), GG (green) dan BB (blue) dapat dilihat pada panel color. Namun ada pengecualian untuk beberapa kode RGB, seperti angka “255” diganti dengan kode “ff”.

Untuk lebih jelasnya, lakukan langkah dibawah :

1. Buatlah flash document baru 20 fps ukuran sembarang.
2. Buat 2 buah layer baru, masing-masing dari paling bawah diberi nama “warna”,”kursor” dan “as”
3. Klik frame 1 layer warna. Buat 5 buah kotak masing masing berwarna hitam, hijau, biru, merah dan kuning, lalu convert menjadi symbol (button). Masing-masing beri instance name “black_btn”, “green_btn”, “blue_btn”, “red_btn” dan “yellow_btn”.
4. Klik frame 1 layer kursor lalu buatlah sebuah tanda panah sederhana dengan ukuran kira-kira 100x250 pixels. Convert kursor tersebut menjadi movieclip,lalu beri instance name “kursor” (tanpa tanda kutip).
5. Klik frame 1 layer as,tekan F9 lalu masukkan script :

Mouse.hide()

kursor.startDrag(true)

myColor=new Color(kursor)

black_btn.onRelease=function(){

myColor.setRGB(0x000000)

}

green_btn.onRelease=function(){

myColor.setRGB(0x00ff00)

}

blue_btn.onRelease=function(){

myColor.setRGB(0x0000ff)

}

red_btn.onRelease=function(){

myColor.setRGB(0xff0000)

}

yellow_btn.onRelease=function(){

myColor.setRGB(0xffff00)

}

6. Tekan Ctrl+Enter untuk test movie. Klik pada kotak warna, maka warna kursor akan berubah seperti tombol yang diklik.
   Download surcenya disini atau disini
   
   
   
   
   

Animasi Rotasi Objek Mengikuti Arah Kursor (ActionScript 2.0)

Posting pertama di bulan Mei nih. Kali ini saya akan share tutorial membuat animasi suatu objek yang berputar mengikuti arah kursor. Berikut langkah-langkahnya :

1. Buka program Macromedia Flash, lalu buat dokumen flash baru (ActionScript 2.0)
2. Tekan Ctrl+J lalu atur ukuran dokumen 300x300 pixels.
3. Buat sebuah objek horizontal. Kali ini saya membuat sebuah panah yang menunjuk ke arah kanan.

Membuat Animasi Masking Teks

Sebelumnya saya pernah share tutorial tentang pembuatan efek masking di Flash. Nah, kali ini saya akan share pengembangan dari tutorial tersebut menggunakan motion tween untuk membuat efek masking berbentuk teks yang akan berjalan melewati gambar background.

Pertama, buka program Macromedia Flash lalu buat Flash Document baru.
Tekan Ctrl+J untuk mengatur properti dokumen sebagai berikut :
300x225 pixels, background hitam, framerate 15 fps, lalu tekan OK.

Event Handling (ActionScript 2.0)

Event handling adalah suatu kode penanda dimana didalamnya terdapan perintah-perintah yang akan dieksekusi atau dijalankan ketika event terpenuhi. Misal perintah akan berjalan ketika sebuah tombol ditekan, dan sebagainya. 

Sebelum mengetahui lebih jauh tentang event handling pada flash, setidaknya kita perlu mengetahui suatu elemen penting yang mempengaruhi syarat terpenuhinya suatu event, yaitu area hit. Area hit adalah sebuah batas berbentuk segi empat yang mengelilingi suatu objek seperti movie clip atau button. Area hit ini akan muncul saat suatu objek telah dirubah menjadi movie clip atau button. Setiap sisi area hit berada pada titik terluar dari objek tersebut. Berikut gambarannya.

Operasi String Pada ActionScript 2.0

Tutorial kali ini kita akan bermain-main dengan variabel string. Ada kalanya kita ingin merubah atau memanipulasi teks yang akan tampil pada movie flash, misal ingin mengambil sebagian huruf atau karakter, merubah menjadi huruf kapital dan sebaliknya. Berikut tutorialnya.

Pertama, buat terlebih dahulu sebuah dynamic text pada stage lalu beri variable “teks_tampil” .

Ketikkan perintah pada contoh penggunaan perintah dibawah.

substr

Perintah ini berfungsi untuk mengambil sebagian karakter dari sebuah variabel string.

Contoh penggunaan :

                teks=”zorc-colozha.blogspot.com”;

                teks_tampil=teks.substr(5,7);

Perintah diatas berarti, telah disediakan teks string “zorc-colozha.blogspot.com” dan akan diambil 7 karakter saja mulai dari karakter setelah karakter ke-5. Jadi akan tampil teks “colozha” saja.

toLowerCase

Perintah ini berfungsi untuk merubah string menjadi huruf kecil saja.

Contoh penggunaan :

                teks=”ZORC-COLOZHA.BLOGSPOT.COM”;

                teks_tampil=teks.toLowerCase();

Pada movie akan tampil teks "zorc-colozha.blogspot.com"

toUpperCase

Perintah ini berfungsi untuk merubah string menjadi huruf kapital.

Contoh penggunaan :

                teks=” zorc-colozha.blogspot.com”;

                teks_tampil=teks.toUpperCase();

Pada movie akan tampil teks "ZORC-COLOZHA.BLOGSPOT.COM" 

length

Perintah ini berfungsi untuk menghitung jumlah karakter dalam suatu teks string.

Contoh penggunaan :

                teks=” zorc-colozha.blogspot.com”;

                teks_tampil=teks.length;

Pada movie akan tampil jumlah karakter dari string tersebut, yaitu 25 karakter.

LATIHAN :

Coba buat teks berikut menggunakan beberapa perintah diatas jika teks awal yang disediakan adalah “zorc-colozha.blogspot.com”

ZORC-colozha.BLOGSPOT.com

Download Source Disini

Membuat Animasi Tulis Tangan

Tutorial kali ini sebenarnya mudah dan sama sekali tidak menggunakan script apapun, hanya perlu ketekunan dan kesabaran. Karena pada dasarnya, animasi yang dibuat adalah animasi frame-by-frame. Jadi harus mengerjakan setiap frame satu persatu.

Pertama buka program Macromedia/Adobe Flash, lalu buat dokumen baru.

Buat sebuah teks dengan ukuran yang cukup besar (hal ini bertujuan agar memudahkan pembuatan animasi), kalau ada menggunakan font yang berbentuk seperti tulisan latin seperti contoh berikut.

Seleksi teks tersebut, lalu tekan Ctrl+B sebanyak dua kali.

Klik pada frame 2 layer 1, klik kanan lalu pilih insert Keyframe (atau tekan tombol F6).

Lakukan penghapusan teks mulai dari huruf paling akhir dan dimulai dari ujung teks.

Buat lagi keyframe baru, lalu lakukan penghapusan sedikit demi sedikit pada setiap keyframe yang dibuat sampai akhirnya mencapai awal teks. Ketika melakukan ini, saya harus membuat keyframe sebanyak 115. Karena itulah diperlukan kesabaran dan keuletan dalam melakukannya.

Setelah selesai, klik kanan pada sembarang frame lalu pilih Select All Frames.

Kemudian, klik kanan pada sembarang frame lalu pilih Reverse Frames.

Tekan Ctrl+Enter untuk melihat hasilnya.

Demikian tutorial kali ini semoga bermanfaat.

Download Source disini

Membuat Animasi Revolusi Planet dan Satelit Planet

Tentunya anda pernah belajar mengenai revolusi planet, dimana planet bergerak mengelilingi matahari dalam jangka waktu tertentu. Hal yang sama juga berlaku pada satelit planet yang juga berevolusi terhadap planet tersebut.
Kali ini kita akan membuat animasinya sehingga bisa menjadi contoh pembelajaran interaktif kepada anak.
Semoga bermanfaat .

Download source-nya disini

Membuat Animasi Menggambar Otomatis (ActionScript 2.0)

Dulu sekali saya pernah posting mengenai cara membuat program untuk menggambar pada plash, dimana kita bisa membuat coretan garis seperti layaknya menggambar pada program seperti Ms.Paint misalnya. Nah, kali ini kita akan membuat sebuah animasi dimana akan ada sebuah titik (dot) yang akan bergerak dengan rute tertentu. Selama melewati rute ini, dot tersebut akan menggambar garis mengikuti rute yang telah dilewati. 

Secara teknis, ini adalah pengembangan dari tutorial sebelumnya. Penasaran ?

Silakan download source-nya disini

Menampilkan Status dan Kapasitas Baterai Pada Flash Lite

Senelumya saya pernah share mengenai pembuatan jam digital menggunakanflash lite 1.1. Kali ini saya akan share mengenai pembuatan aplikasi untuk menampilkan status baterai, dalam hal ini adalah kapasitas baterai yang akan ditampilkan secara visual dan teks.

Pertama buka program Macromedia Flash, tekan Ctrl+N pilih tipe dokumen Global Phones – FlashLite 1.1 .

Klik frame 1 layer Content.

Dengan menggunakan Rectangle Tool (R) buatlah sebuah persegi panjang.

Seleksi persegi panjang tersebut, lalu convert menjadi MovieClip (tekan F8 setelah persegi panjang diseleksi), perhatikan pula letak registration point-nya. 

Klik pada movieclip persegi panjang, buka panel properties, lalu beri instance name “baterai_mc” (tanpa tanda petik) .

Buat sebuah dynamic text menggunakan Text Tool dibawah persegi panjang, buka panel action lalu beri variabel “stat_txt” (tanpa tanda petik).

Buka frame 1 layer ActionScript, tekan F9 (membuka panel action). Masukkan perintah berikut :

// this ActionScript sets your content to be full screen

fscommand2("FullScreen", true);

//perintah untuk menangkap kapasitas baterai

batt_cap = fscommand2("GetBatteryLevel");

/*perintah untuk menampilkan status

baterai dalam bentuk grafis*/

baterai_mc._xscale = battcap;

/*perintah untuk menampilkan status baterai

dalam bentuk teks persentase*/

stat_txt = batt_cap add “%”;

Untuk mengujinya, harus pada perangkat mobile (HP) yang mempunyai flash player, minimal mendukung FlashLite 1.1 .

Sebelum memindahkan ke perangkat anda, publish terlebih dahulu swf-nya. Lalu pindahkan file swf ke perangkat mobile anda.

Untuk mengekspor flash menjadi swf, tekan tombol Shift+F12 atau klik menu File – Publish.

Demikian tutorial singkat mengenai FlashLite 1.1 . Semoga bermanfaat

Download source disini

Animasi Perubahan Bentuk Pada Flash

Kali ini saya akan share cara membuat animasi sederhana menggunakan fitur shape tween pada flash. Kali ini tidak ada coding sama sekali jadi, gak perlu mikir yang sulit sulit.

Pertama buka program Macromedia Flash, lalu buat document flash baru ActionScript 2.0
Klik frame 1 layer 1. Buat sebuah kotak atau bentuk apapun terserah anda. 

Konsep Dasar Pembuatan Timer Pada Flash (ActionScript 2.0)

Sebelumnya saya pernah posting tentang pembuatan program penghitung waktu mundur, namun belum sempat saya jelaskan mengenai konsepnya secara detail. Nah, untuk mengetahuinya, perhatikan konsep sederhana berikut :

Pada animasi flash dikenal istilah frame dan fps (frame per second). Frame diibaratkan sebagai selembar kertas pada buku dan fps diibaratkan sebagai jumlah kertas yang dibuka dengan cepat selama 1 detik.

Contoh Penggunaan Numeric Stepper Component Pada Flash (ActionScript 2.0)

Salah satu fitur component pada Flash adalah numeric stepper.Numeric Stepper berfungsi menentukan angka yang diinginkan dengan batas minimal dan maksimal serta interval pada setiap perubahannya. Kali ini kita akan membahas bagaimana contoh penggunaanya. Berikut langkah-langkahnya :

1.      Buka flash document baru (ActionScript 2.0), 300x200 pixels.

2.      Buka panel Components (Ctrl+F7), expand pada User Interface.

3.      Drag component Numeric Stepper ke stage.

Membuat Jam Digital Menggunakan Flash Lite (FlashLite 1.1)

Memang flashlite 1.1 sudah tergolong jadul dan sangat sederhana, tapi kompatibilitasnya masih bisa diharapkan untuk hp model lawas (seperti punya saya,,,, hehehe). Biasanya program ini berguna untuk wallpaper di hp. Berikut langkah-langkahnya :

Membuat Game Modifikasi Rumah Sederhana Menggunakan Flash (ActionScipt 2.0)

Sebenarnya game ini adalah salah satu request dari salah satu pengunjung blog ini. Karena penasaran, langsung saja saya buat dan ternyata sangat sederhana dan tidak memerlukan script yang banyak. Aturan mainnya mudah, cukup klik salah satu gambar jendela, pintu, dan atap rumah, maka akan berganti sesuai pilihan anda. Selain itu anda juga bisa mengganti warna dinding rumahnya.
Langsung saja download source dari game ini (padahal males nulis penjelasannya,hehehe...)

Membuat Password Text Menggunakan Flash dan ActionScript 2.0

Anda pasti sudah sering melihat bagaimana tampilan password yang anda ketik saat akan masuk ke akun tertentu bukan? Kali ini kita akan membuatnya menggunakan Adobe Flash dan ActionScript 2.0. Berikut langkah-langkahnya :
1. Buat flash document baru 300x200 pixels

Menampilkan Gambar Eksternal Kedalam Movie Flash Menggunakan Scrollpane Components

Kali ini saya akan share tutorial yang cukup mudah,tanpa menggunakan ActionScript. Kita akan menggunakan salah satu fitur components pada flash. Berikut langkah-langkahnya :

1. Siapkan sebuah gambar, lalu masukkan ke drive dan direktori sembarang, pada contoh ini saya meletakkan gambar pada drive F: bernama "po.jpg".
2. Buat sebuah flash document baru. Buka panel component : Klik menu Window -> Components.
3. Pilih components bernama Scrollpane, lalu seret ke stage.