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

Posted in Flash - Menengah

38 Responses to “Membuat Keyboard”

  1. made Says:
    September 3rd, 2009 at 13:26

    gmana caranya buat huruf jadi besar? /??

  2. admin Says:
    September 3rd, 2009 at 15:26

    Ubah script yang berisi kumpulan huruf diatas menjadi besar.

  3. ari Says:
    September 7th, 2009 at 11:13

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

  4. admin Says:
    September 7th, 2009 at 15:19

    Ya, tinggal diubah jenis huruf di input textnya.

  5. masjonk_banten Says:
    September 8th, 2009 at 12:36

    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:
    September 9th, 2009 at 11:35

    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:
    September 20th, 2009 at 11:45

    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:
    September 20th, 2009 at 14:02

    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:
    September 21st, 2009 at 08:38

    tapi koq di source nya bisa??? /sendiri

  10. admin Says:
    September 22nd, 2009 at 11:51

    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:
    September 23rd, 2009 at 12:53

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

  12. admin Says:
    September 23rd, 2009 at 15:13

    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:
    September 23rd, 2009 at 17:02

    gak da backspace nya ya…???

  14. admin Says:
    September 24th, 2009 at 08:49

    Iya belum ada :D

  15. ari Says:
    September 24th, 2009 at 12:23

    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:
    September 24th, 2009 at 18:33

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

  17. admin Says:
    September 26th, 2009 at 07:07

    @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:
    September 28th, 2009 at 12:29

    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:
    September 28th, 2009 at 13:41

    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:
    October 1st, 2009 at 07:41

    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:
    October 1st, 2009 at 08:05

    Bisa, kami coba buatkan tutorialnya besok ;)

  22. yin Says:
    October 1st, 2009 at 08:55

    wah…tq2 mas

  23. admin Says:
    October 2nd, 2009 at 07:00

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

  24. ari Says:
    October 5th, 2009 at 16:33

    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:
    October 5th, 2009 at 16:45

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

  26. made Says:
    October 5th, 2009 at 17:45

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

  27. ari Says:
    October 5th, 2009 at 18:06

    oce… :-:

  28. admin Says:
    October 6th, 2009 at 15:15

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

  29. ari Says:
    October 7th, 2009 at 16:10

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

  30. rvien Says:
    October 28th, 2009 at 16:17

    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:
    October 29th, 2009 at 07:13

    Memangnya mau bikin kalkulator untuk menghitung apa?

  32. Julian Jackson Says:
    November 27th, 2009 at 19:38

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

  33. dee Says:
    January 19th, 2010 at 08:32

    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:
    April 9th, 2010 at 11:25

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

  35. bhag Says:
    May 8th, 2010 at 08:50

    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:
    October 29th, 2010 at 16:41

    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:
    December 1st, 2010 at 17:04

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

  38. dina Says:
    February 2nd, 2012 at 12:32

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

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

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.