Codea mempunyai banyak kelebihan dalam memuat sprite, antara lain
1. Sprite dari Library Codea
2. Sprite dari Dropbox, dengan akun yang sudah dihubungkan dengan Codea
3. Sprite langsung dari Internet dengan menggunakan method httprequest
Untuk contoh kali ini kita akan mencoba memuat sprite ke environment Codea dengan method httprequest. Kita mengambil contoh image dari alamat berikut: http://www.linhadecodigo.com.br/artigos/img_artigos/Joel_Rodrigues/HTML5CanvasSprite/
HTML5CanvasCSSSprites01.jpg
Jika anda pernah memainkan game Secret of Monkey Island, tentunya Anda tidak asing dengan karakter ini, yang merupakan tokoh utama dari game tersebut yang bernama Guybrush Threepwood. Pada gambar tersebut, mengandung 7 sprite yang mewakili gerakan dari Guybrush saat dia sedang berjalan. Kita akan mencoba mengambil sprite Guybrush dimulai dari sprite kedua sampai ketujuh, jadi total akan ada 6 sprite Guybrush yang sedang berjalan (Sprite pertama adalah Guybrush saat berdiri diam)
Jadi untuk mengambil sprite Guybrush, kita siapkan variabel array untuk menampung koordinat x dan y untuk membedakan sprite mana yang akan kita ambil. Variabel coordx dan coordy digunakan untuk menampung koordinat awal x,y awal untuk mengambil sprite, kemudian variabel largeur adalah variabel array untuk menyimpan lebar dari sprite (catatan: sprite yang diambil bisa berbeda lebarnya antara satu dengan lainnya)
coordx={75,140,220,315,390,465}
coordy={0,0,0,0,0,0}
largeur={75,75,90,75,75,95}
Lalu untuk menggunakan method http.request, kita membutuhkan function didGetImage dimana fungsi ini akan mengembalikan nilai dalam bentuk image. Pada function draw, kita buat looping untuk menginisialisasi variabel array sprite yang sesuai dengan koordinat x,y dan lebar masing2 sprite. Setelah diinisialisasi, barulah kita put spritenya secara berurutan, sehingga akan menampilkan efek Guybrush berjalan. Untuk lebih jelasnya, berikut adalah listing programnya
— Animation Sprites
— Use this function to perform your initial setup
function setup()
coordx={75,140,220,315,390,465}
coordy={0,0,0,0,0,0}
largeur={75,75,90,75,75,95}
maxspr=6
sprites={}
chargeimage=false
continue=false
print(“Wait please loading Image from Http…”)
http.request(“http://www.linhadecodigo.com.br/artigos/img_artigos/Joel_Rodrigues/HTML5CanvasSprite/HTML5CanvasCSSSprites01.jpg”,didGetImage)
anim=1–a flag to state the current sprite image
animmax=maxspr — the number of sprite images
animcount=1–a counter for the delay between swapping images
parameter.integer(“animdelay”,1,531,65) — the length of delay hence speed of animation
end
— This function gets called once every frame
function draw()
background(233,233,233)
if chargeimage then
print(“Load completed…”)
for i=1,maxspr do
sprites[i]=matrice:copy(coordx[i],coordy[i],largeur[i],182)
end
continue=true
chargeimage=false
end
if continue then
for i=1,maxspr do
if anim==i then
w,h=spriteSize(sprites[i])
sprite(sprites[i],WIDTH/2,130,w,h)
end
animcount = animcount + 1
if animcount>animdelay then
anim = anim + 1
animcount=0
end
if anim>animmax then
anim=1
end
end
end
end
function didGetImage(image)
matrice=image
print(matrice)
if spriteSize(matrice)==0 then
print (“Download failure…..”)
setup()
end
chargeimage=true
end