Masih membahas seputar graphics programing, untuk menampilkan banyak objek gambar pada canvas dapat menggunakan perulangan. Bahkan jika objek tersebut mempunyai karakteristik yang berbeda - beda sekalipun. Sebagai contoh, kita akan membuat efek hujan salju sederhana seperti screenshot diatas. Pada program ini satiap partikel salju mempunyai kordinat posisi (x, y) dan mempunyai ukuran yang berbeda - beda, kecepatan partikel turun (gravitasi) ditentukan dari besar kecilnya partikel tersebut.
Langkah awal, kita buat script untuk menampilkan tiga buah gambar point pada canvas (nanti kita perbanyak), posisi X, Y gambar terserah mau diisi berapa saja, namun jangan melebihi ukuran layar hp sobat, kodenya seperti ini:
import appuifw
import graphics
import e32
import random
def tutup():
>>global run
>>run=0
img=graphics.Image.new((176,208))
c=None
# agar program berjalan lebih cepat, gambar kita handel
def handel_gambar(rect):
>>if c: c.blit(img)
c=appuifw.Canvas(redraw_callback=handel_gambar)
appuifw.app.body=c
appuifw.app.screen='full'
appuifw.app.exit_key_handler=tutup
run=1
#posisi objek pertama
posX1=61
posY1=40
size1=1
#posisi objek kedua
posX2=10
posY2=89
size2=4
#posisi objek ketiga
posX3=75
posY3=23
size3=2
while run:
>>img.clear(0)
>>#menampilkan objek
>>img.point((posX1,posY1),0xdddddd,width=size1)
>>img.point((posX2,posY2),0xdddddd,width=size2)
>>img.point((posX3,posY3),0xdddddd,width=size3)
>># menjalankan semua objek ke bawah seolah-olah salju turun
>># agar lebih realistis, kecepatan objek turun ditentukan dari besar kecilnya objek tersebut
>>posY1+=size1
>>posY2+=size2
>>posY3+=size3
>># deteksi tubrukan, setiap Y objek lebih besar dari 208 (tinggi layar),
>># Y objek dipindahkan ke atas layar, sedangkan X objek di-random antara 0-176 (lebar layar), ukuran objek juga di random
>>#objek 1
>>if posY1>208:
>>>>posX1=random.randint(0,176)
>>>>posY1=0
>>>>size1=random.randint(1,5)
>>#objek 2
>>if posY2>208:
>>>>posX2=random.randint(0,176)
>>>>posY2=0
>>>>size2=random.randint(1,5)
>>#objek 3
>>if posY3>208:
>>>>posX3=random.randint(0,176)
>>>>posY3=0
>>>>size3=random.randint(1,5)
>>handel_gambar(())
>>e32.ao_yield()
Copas dan simpan kodenya menjadi file txt dengan exsistensi *.py. Ganti semua tanda ">" pada awal baris kode dengan spasi. Kode yang saya beri warna hijau adalah kode program aplikasi, sedangkan yang merah adalah kode program efek salju yang kita buat. Bingung membuat scriptnya? Monggo download scriptnya disini. Silahkan dilihat2 scriptnya, masih bingung membaca scriptnya? Monggo simak yang ini dulu. Sudah nggak bingung kan? Mari kita lanjut ...
Coba lihat kode yang saya tulis diatas. Untuk menampilkan 3 butir salju saja butuh 27 baris kode (kode yang berwarna merah, tidak termasuk penjelasan), bagaimana kalau butiran saljunya buanyak seperti pada screenshot? Pasti sampai ratusan baris. Wah bisa copot jempolnya... Karena kita semua sayang jempol, mari kita ubah kodenya agar program yang kita buat lebih pintar dan dapat melakukan semuanya. Sebelumnya, kita gabungkan semua variabel yang menyimpan data - data objek kedalam list, ubah kode yang berwarna merah menjadi seperti ini:
# semua X objek di masukkan dalam satu list
posX=[61, 10, 75]
# begitupun Y dan ukuran objek
posY=[40, 89, 23]
size=[1, 4, 2]
while run:
>># karena penyimpanan data objek nya di ubah menjadi list, cara pengambilan data nya juga harus dirubah
>>#menampilkan objek
>>img.point((posX[0],posY[0]),0xdddddd,width=size[0])
>>img.point((posX[1],posY[1]),0xdddddd,width=size[1])
>>img.point((posX[2],posY[2]),0xdddddd,width=size[2])
>># menjalankan semua objek ke bawah seolah-olah salju turun
>>posY[0]+=size[0]
>>posY[1]+=size[1]
>>posY[2]+=size[2]
>># deteksi tubrukan
# objek 1
>>if posY[0]>208:
>>>>posX[0]=random.randint(0,176)
>>>>posY[0]=0
>>>>size[0]=random.randint(1,5)
>>#objek 2
>>if posY[1]>208:
>>>>posX[1]=random.randint(0,176)
>>>>posY[1]=0
>>>>size[1]=random.randint(1,5)
>>#objek 3
>>if posY[2]>208:
>>>>posX[2]=random.randint(0,176)
>>>>posY[2]=0
>>>>size[2]=random.randint(1,5)
Simpan perubahan yang telah kita lakukan. Hmm... Sudah sedikit lebih ringkas, tapi masih belum bersahabat dengan jempol jika objek nya banyak. Yang kita lakukan diatas adalah menggabungkan semua data yang jenisnya sama (posX, posY, size). Selanjutnya meggabungkan pengolahan data yang prosesnya sama (program yang di while). Proses pengolahan pada program ini ada tiga macam, yaitu: proses menampilkan gambar, proses animasi salju turun kebawah, dan proses deteksi tubrukan. Salah satu cara penggabungannya adalah menggunakan perulangan "for". Apa itu "for"? Agar lebih jelas, saya ambil contoh perulangan for yang buanyak beredar diinternet seperti ini:
for i in range(2):
>>print i
hasil:
0
1
2
for menjalankan event yang berada didalamnya (pada contoh diatas event adalah print) sebanyak nilai yang kita tentukan (pada contoh diatas 2). Default nya dimulai dari angka nol. Didalam " i " tersimpan nilai - nilai proses perulangan. Berikut ilustrasi proses yang dilakukan for:
i = 0
print i # hasil: 0
i = i+1
print i # hasil: 1
i = i+1
print i # hasil: 2
Proses diatas akan terus berjalan sampai nilai " i " sama dengan nilai batasan yang ditentukan.
Seperti yang kita ketahui, untuk memanggil semua nilai list posX secara manual seperti ini:
print posX[0] # hasil: 61
print posX[1] # hasil: 10
print posX[2] # hasil: 75
Perhatikan angka - angka yang kita gunakan untuk memanggil list posX diatas (0, 1, 2). Angka - angka tersebut sama dengan nilai " i " pada contoh perulangan "for" bukan? Nah.. Jika kita memanggil semua list menggunakan for, kodenya:
for a in range(2):
>>print posX[a]
hasil:
61
10
75
Lho.. kok "a", Bukan "i"? "a" dan "i" adalah nama varibel, sama seperti nama list. Jadi terserah mau dikasih nama apa saja, misalnya:
for tomat in range(8):
>>print tomat
hasil:
0
1
2
3
4
5
6
7
8
Sebenarnya banyak variasi looping menggunakan for, tapi karena efek salju yang akan kita buat cukup menggunakan looping basic ini, jadi cuma satu ini yang saya jelaskan pada coretan ini. Silahkan googling jika ingin mengetahui lebih banyak tentang "for". Nah, sekarang pengaplikasian for pada program kita. Ubah semua kode yang berada didalam while yang berwarna merah menjadi seperti ini::
while run:
>># len() digunakan untuk mengetahui jumlah elmen yang terkandung pada sebuah list
>># kita menggunakan len(posX untuk memberi nilai batasannya agar kita tidak repot menggonta-ganti nilai batasan sesuai jumlah objek
>>for j in range(len( posX )):
>>>>img.point((posX[j],posY[j]),0xdddddd,width=size[j])
>>>>posY[j]+=size[j]
>>>>if posY[j]>208:
>>>>>>posX[j]=random.randint(0,176)
>>>>>>posY[j]=0
>>>>>>size[j]=random.randint(1,5)
Sekarang berapapun jumlah objek yang ingin kita tampilkan, for akan memproses semuanya. Untuk menambah objek, kita tinggal menambahkan nilai pada list posX, posY, dan size. Namun perlu diingat bahwa satu gambar point membutuhkan data posX, posY dan size. Jadi jumlah list posX, pos Y dan size harus sama.
Script diatas sudah selesai jika partikel salju yang ingin kita tampilkan sedikit misalnya 8. Masalah datang ketika kita ingin menampilkan banyak partikel. Misalnya 50 partikel maka list data nya juga akan panjang. Atau kita ingin mengubah jumlah salju yang ditampilkan kita harus mengedit - edit semua list tersebut. Agar masalah diatas tidak muncul kita tambahkan fungsi untuk men-generate data objek dengan sendirinya. Untuk membuat generator kita masih menggunakan perulangan juga, namun perulangan yang kita gunakan adalah " while ". Berbeda dengan for, while akan terus melakukan perulangan tanpa menyimpan proses perulangannya hingga exception terjadi. Kita tambahkan kode yang berfungsi sebagai generator sebelum while utama:
# Semua list kita kosongkan
posX=[]
posY=[]
size=[]
partikel=20 # jumlah partikel
# proses generating (bukan while utama)
while len(posX) < partikel:
>>proses pengisian data
>># data - data yang dimasukkan nilainya kita acak
>>posX.append(random.randint(0,176))
>>posY.append(random.randint(0,208))
>>size.append(random.randint(1,5))
while run:
Kode yang berwarna biru adalah generatornya. Nah, akhirnya selesai juga. Sekarang untuk mengubah jumlah butiran salju yang ditampilkan kita tinggal merubah nilai variabel "partikel". Awas!! Jangan menampilkan partikel salju terlalu banyak (misalnya 1000), jika dilakukan mungkin dapat menyebabkan ponsel hang karena keterbatasan kemampuan ponsel. Dengan Pys60 kita dapat membuat simulasi hujan salju, namun bukan berarti dapat membuat simulasi badai salju hehe... Jumlah partikel maksimal yang telah saya coba pada ponsel N-Gage QD adalah 100 dan sudah terasa beratnya. Jadi jika ponsel sobat nge-hang dikarenakan menampilkan partikel salju terlalu banyak jangan salahkan saya :D.
Tehnik perulangan ini tidak hanya digunakan untuk membuat efek salju saja, coba lihat pesawat - pesawat musuh pada game Sky Force reloaded ini:
Tehnik memunculkan banyak musuh pada game tersebut basic nya kurang lebih mirip dengan efek salju yang kita buat, namun kita tidak mungkin membuat game seperti ini pada Pys60 khususnya s60 1st dikarenakan banyak faktor.
Coretan ini hanya berdasarkan hasil coba - coba saya (trial & error), mohon maaf jika ada penjelasan - penjelasan yang salah. Sampai disini dulu, semoga bermanfaat dan happy coding ...
Updated:
Kelupaan ga nampilin hasil akhirnya hehe... Buat yang pengen langsung nyoba script yang sudah jadi download disini.
