03
Sep

Membuat Keyboard

Written by admin


Mengetik menggunakan keyboard sudah biasa, tapi kali ini kita akan mengetik dengan menekan tombol yang sudah disediakan. Prinsipnya sama seperti kalkulator. Jika tombol pada kalkulator ditekan akan muncul angka, pada tutorial di bawah ini akan muncul huruf.

1. Buatlah sebuah flash document.

2. Buatlah sebuah input text di stage. Seleksi input text tersebut dan tekan Ctrl+F3. Pada panel properties yang muncul masukkan kertas sebagai var dan aktifkan tombol show border around text.

3. Buatlah sebuah persegi berwarna merah dengan hitam sebagai warna garisnya. Seleksi persegi tersebut dan tekan F8. Pada panel yang muncul masukkan kotak_btn sebagai instance name dan button sebagai type lalu tekan ok.

4. Seleksi kotak_btn di stage dan tekan Ctrl+D sebanyak 27 kali.

5. Buatlah 27 buah static text masing-masing bertuliskan huruf abjad a-z, Space, Clear All.

6. Letakkan setiap static text tadi di tengah-tengah kotak_btn. Atur ukuran kotak_btn yang ditempati static text bertuliskan Space dan Clear All menjadi lebih besar.

7. Setelah masing-masing static text terpasang pada seluruh kotak_btn. Atur letaknya sehingga seperti gambar di bawah ini :

ltak-kybord

8. Berikan seluruh kotak_btn di stage dengan instance name seperti gambar di bawah ini :

Arahkan kursor mouse pada salah satu kotak untuk mengetahui instance namenya

9. Klik frame 1 dan tekan F9. Pada panel actions yang muncul masukkan script berikut :

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
//membuat variable bernama kertas dengan nilai kosong
kertas = "";
//membuat array bernama yang di dalamnya berisi kumpulan huruf abjad
huruf = ["a", "b", "c", "d", "e", "f", "g", "h", "i", "j", "k", "l", "m", "n", "o", "p", "q", "r", "s", "t", "u", "v", "w", "x", "y", "z"];
//membuat variable i dengan nilai 1 sampai 26
for (i=1; i<=26; i++) {
	//membuat variable no di dalam i+"_btn" dengan nilai sama dengan i
	_root[i+"_btn"].no = i;
	//ketika i+"_btn" ditekan
	_root[i+"_btn"].onPress = function() {
		//menambahkan nilai pada variable kertas sesuai nilai pada array huruf yang 
 
berdasarkan nilai variable no tombol ini dikurangi 1
		kertas += huruf[this.no-1];
	};
}
//ketika space_btn ditekan
space_btn.onPress = function() {
	//tambahkan spasi di variable kertas
	kertas += " ";
};
//ketika clearall_btn ditekan
clearall_btn.onPress = function() {
	//nilai variable kertas menjadi kosong
	kertas = "";
};
onEnterFrame = function () {
	kertas.focusEnabled = true;
 
};

10. Tekan Ctrl+Enter untuk melihat hasilnya.

Sourcenya dapat di download di sini





Apakah tutorial di atas menarik atau bermanfaat bagi anda? Bantulah Warung Flash agar tetap ada dan memberikan tutorial-tutorial yang lebih bagus dan bermanfaat lagi. Silahkan klik link berikut ini untuk lebih jelasnya : Bantu Warung Flash



Bookmark and Share

43 Responses to “Membuat Keyboard”

  1. made Says:

    gmana caranya buat huruf jadi besar? /??

  2. admin Says:

    Ubah script yang berisi kumpulan huruf diatas menjadi besar.

  3. ari Says:

    kalo mau ganti fontnya yang diubah di input textnya ya?misal font hiragana. ;;)

  4. admin Says:

    Ya, tinggal diubah jenis huruf di input textnya.

  5. masjonk_banten Says:

    punten y… bagaimana caranya meng_export animasi/game yg udah dibuat, menjadi satu aplikasi utuh tanpa masuk ke program flash lagi..

    thanks..

  6. admin Says:

    Pertama buka dulu fla yang anda ingin jadikan aplikasi utuh. Lalu pada menu bar pilih File>Publish Settings…
    Pada kotak dialog yang muncul berikan tanda cek hanya pada Windows Projector (.exe).
    Jika sudah tekan tombol Publish.

  7. made Says:

    thanks ya bang admin.. /jempol tapi gmana caranya buat huruf besar ada saat pencet suatu tombol.. kayak caps lock gitu.. /??
    dan saya tidak boleh menulis instance dengan awalan angka di flash cs3..??? /ngamuk koq gitu????? /stress misal : nulis instance 22_btn gak dikasih.. /kebakar

  8. admin Says:

    Kalau itu kami belum coba. Mungkin nanti pake kondisi dan variable untuk capslocknya.

    Nggak hanya CS3 tapi seluruh flash seperti itu. Coba tambahkan 1 huruf saja didepannya misalnya menjadi a22_btn.

  9. made Says:

    tapi koq di source nya bisa??? /sendiri

  10. admin Says:

    Iya ternyata bisa hehe :D
    Dari yang kami ketahui kelihatannya jika pake instance name langsung maka scriptnya jadi error tapi kalau pake perulangan seperti source pada tutorial ini tidak terjadi error.

    Contoh script yang error
    1_btn.onPress=function(){}

    Contoh script yang tidak error
    for (i=1;i<2;i++){ _root[i+"_btn"].onPress=function(){}}

  11. made Says:

    kalau mau buat keyboard instancenya diganti pake misal : a_btn koq gak mau..?? katanya flash bisa error..?? /ngamuk /stress

  12. admin Says:

    Kalau pake a_btn nanti scriptnya juga harus anda ubah. Anda nanti harus memasukkan script satu per satu untuk setiap button. Contohnya seperti berikut ini :
    a_btn.onPress=function(){//masukkan script di sini}
    b_btn.onPress=function(){//masukkan script di sini}
    c_btn.onPress=function(){//masukkan script di sini}
    dst…
    Keuntungan memakai angka sebagai instance name seperti tutorial diatas :I: adalah anda tidak perlu menulis terlalu banyak script. Memangnya kenapa mau pake a_btn sebagai instance name :-/

  13. leack Says:

    gak da backspace nya ya…???

  14. admin Says:

    Iya belum ada :D

  15. ari Says:

    terus kalo nginputin jawaban lewat keyboard yang ditampung di variabel kertas, variabel tu dibuat array gimana?untuk load pertanyaan dan jawaban yang benar da di notepad. ngejek jawabannya juga gimana?. /keringat /keringat /keringat /keringat /nangis pusing aku

    kalo aplikasinya perlu instal font hiragana.pas dipublish jadi file exe terus bukanya dikomputer yang gk da fontnya,kira2 fontnya berubah gk ya?kalo berubah,biar gak berubah cara publishnya gimana?ato file2 yang perlu disertakan pada folder tempat aplikasi mw dipublish.

  16. leack Says:

    kalau memasukkan fungsi key Enter di tombol gimaa master??? aku coba2 gak bisa2 ni…..

  17. admin Says:

    @ari
    untuk mengecek jawaban dari array akan kami coba buatkan besok. Untuk load pertanyaan dan jawaban dari notepad coba buka link berikut : http://warungflash.com/2009/07/mengambil-data-dari-txt/ Untuk mengecek jawaban dari notepada akan kami coba buatkan. Setahu kami kalau dipublish jadi exe walaupun komputernya tidak ada jenis font yang digunakan, fontnya tidak berubah. Tapi untuk lebih menyakinkan dicoba dulu saja. Karena kami jarang memakai exe jadi kurang begitu tahu :p

    @leack
    Maksudnya nanti ada tombol enter. Kalau tombol enter ditekan maka akan seperti kita menekan tombol enter di keyboard. Begitu? Kalau ya, kami belum tahu caranya :D

  18. ari Says:

    wah makasih bangget mas….. oya mas aku coba pake font aksara jawa, pas buat keyboard ini, semuanya berfungsi dengan baik. tapi pas aku klik tombol “\”, di input textnya kok gak keluar? kenapa ya mas…

  19. admin Says:

    Tombol “\” yang anda klik itu tombol dari keyboard atau tombol bikinan anda sendiri?
    Kalau kami boleh tahu jika anda mengklik tombol “\” tersebut, huruf apa yang keluar di input text? Apakah tetap \ atau berhubung fontnya anda ganti aksara jawa jadi berubah kebentuk lain?

  20. yin Says:

    mas bisa enggak kalau kita tekan tombol A lalu keluar huruf A dan juga gambarnya sekali. misalnya, tekan A keluar huruf A dan disisinya keluar gambar apple. bisa enggak ya mas? saya terpikir2 :-?

  21. admin Says:

    Bisa, kami coba buatkan tutorialnya besok ;)

  22. yin Says:

    wah…tq2 mas

  23. admin Says:

    Sudah kami buatkan, coba anda lihat di sini : http://warungflash.com/2009/10/memasukkan-huruf-dan-gambar-bersamaan/

  24. ari Says:

    kalo aku dah instal font aksara jawa, tombol \ pada keyboard beneran :D harusnya berupa aksara pangkon. tapi ketika saya klik tombol keyboard yang pada layar, di input box(kertas) gak kecetak apa2.padahal di array kertas dah aku masukkan “\”.

  25. admin Says:

    Coba kirim fla yang anda buat kepada kami bersama font aksara jawanya.

  26. made Says:

    gimana caranya buat tombol keyboard ga bisa diklik??? /??

  27. ari Says:

    oce… :-:

  28. admin Says:

    @made
    Tinggal nggak diberi script saja nanti pasti tidak bisa diklik.

  29. ari Says:

    dah aku kirim, tapi cuma flanya aja kan? sorry ya.,… /merayu

  30. rvien Says:

    om admin berarti bisa bikin kalkulator sederhana dong..!!!! tpi scrip untuk mod (%) gmn ya.??? saya agak binggung nih..!!! tolong pencerahannya :hope: :hope: /berkaca

  31. admin Says:

    Memangnya mau bikin kalkulator untuk menghitung apa?

  32. Julian Jackson Says:

    Bisaaa Bikinn Black Berry Nih . . .
    wkwkwkwkwkwkkw :idea:

  33. dee Says:

    gimana carany menginputkan text bukan memakai mouse yang diklik, namun menggunakan ketikan lwt keyboard asli ya?
    dan saat menekan tombol di keyboard asli, huruf pd keyboard layar bercahaya?

    trims…

  34. chaki_deathbat Says:

    mas…klo ngerubah misalnya ntu huruf2 make huruf arab / hijaiyah bijimane??? jd keyboard huruf arab gtu…

  35. bhag Says:

    om… kalo buat semacem kalkulator gitu gimana ya caranya..
    misal pembagian, input text 1 diisi “9” & input text 2 diisi “3”, trus ditekan tombol “hasil” biar muncul angka “3” di kolom hasil gimana ya caranya?

    kalo input text bisanya angka doang bisa ga ya? maksudnya kalo ditekan huruf ga muncul gitu lho….

    trimz….

  36. jo Says:

    kl mo ganti nilai keyboar jadi movieclip gimana..??

    misalnya kita ketik huruf “a” di keyboard yang muncul tu misalnya gambar mobil..

    kl kita ketik huruf “b” yang muncul tu misalnya gambar sepeda…
    dsb….

    thx before… :D

  37. HelpHelpARRISSS Says:

    kalo pake AS 3 gimana caranya kk ???
    :hope: :hope: :hope: :hope: :hope: :hope: :hope:

  38. dina Says:

    /hi bagaimana cara untuk menyimpan hasilketikan kita????
    tolong infonya y ak’ admin???? /thanks2

    /berkaca /berkaca /berkaca /?? /??

  39. trisnaclutch Says:

    bisa gak buat menu search di flash??
    caranya gimana??? ksh tw donk…

  40. acung wen Says:

    eh, gmn cara membuat virtual keyboard yang lengkap.
    kan tutor di atas hanya a-z space dan clear all.
    untuk buat “enter,caps lock, tap, R-shift, L-shift, back space” caranya gmn?
    mohon requestnya ke warung flash atau e-mail saya “seal.ghost@yahoo.com” tanpa tanda kutip
    thx

  41. Ata mut Says:

    script untuk tombol backspace,enter,shift,esc. bisa?? tlong kirimkan ke email saya. :hope: /berkaca

  42. akmaldi Says:

    kk ada nggak tutorial virtual keyboard yang tidak hanya huruf doank tpi angka juga……????????? /stress

    /thanks

  43. aanna Says:

    ane coba buat sesuai dengan tutorial agan pake adobe flash cs3, pas ngasih instance name e tombol sesuai dengan tutorial (cth : 1_btn, dst) itu ndak bisa, gimana caranya, mohon bantuan e gan :respect:

Leave a Reply

B-) =DV <:-P ;)) ;) :yeye: :respect: :peace: :p :idea: :hope: :I: :D :-SS :-? :-/ :)) :) :(( 8-> more »

Komentar yang berisi pertanyaan atau request tutorial kemungkinan besar tidak bisa kami jawab dan penuhi. Hal ini dikarenakan kesibukan kami yang padat . Oleh karena itu kami mohon maaf dan pengertiannya.