Tuesday, December 16, 2014

Progress Bar menggunakan Background Worker di C# WPF VS2010 - Basic

Pada postingan kali ini akan ditunjukkan cara menggunakan progress bar dengan background worker di C# wpf menggunakan visual studio 2010. Pertama-tama silahkan buat project baru dan tambahkan 1 buah textbox, 1 buah tombol, 1 buah listBox, dan 1 buah progressbar. Kemudian atur posisinya seperti terlihat di bawah :


Kemudian untuk pertama kali, tambahkan kode berikut didalam tombol start :

Kode didalam tombol start ini nantinya akan diupdate lagi, jad yang itu belum fix :-)
Ok. Kode program diatas adalah kode untuk menerima masukan angka dari user yang terletak pada textbox1. Kemudian angka tersebut dikonvert ke integer melalui fungsi convert.toInt32, nah fungsi convert ini ada eksepsinya, yaitu jika ternyata user memasukkan huruf bukan angka, maka formatException akan dieksekusi dengan menampilkan "format Exception" output visual studio. Kemudian jika user memasukkan angka terlalu besar atau melebihi daya tampung data integer, maka akan digenerate overflow exception.

Next, kita akan menambahkan kode untuk background workernya. Background worker bekerja di thread berbeda dengan main thread. Jadi boleh dikatakan penggunaan background worker ini sebenarnya adalah salah satu proses multithreading di C#. Program C#-nya seperti terlihat di bawah :


Mari kita telaah ketiga fungsi diatas, yaitu fungsi threadProcess, updateGUI, dan selesai. Pada project ini fungsi threadProcess berguna untuk memproses angka dari user(input dari textbox) dan memberikan event dan data kepada fungsi updateGUI. Pada line 64, variabel "args" mengambil input data dari user yang berupa argument pada variabel input "e". "mBilGanjil" adalah variabel untuk menampung jumlah bilangan ganjil yang berawal dari 0 sampai args, makanya di loop for itu (line 67) "i<args". Kemudian di line 69 terdapat variabel "presentase", variabel ini akan menampung jumlah presentasi dari keseluruhan proses, dan dari variabel inilah tampilan progressbar kita akan diupgrade. Terus untuk line 71, itu cuma buat ngecek bilangan ganjil atau bukan. Jika misalkan bilangan ganjil, maka mBilGanjil akan bertambah 1 (line 73). terus di Line 74, Nah inilah yang membuat updateGUI di run ketika line 74 tersebut di eksekusi. Di line 74 tersebut juga diberikan presentase, dan bilangan ganjil tersebut yang nantinya ditampilkan dalam listbox. Terus untuk kode dibagian else, itu sama dengan line 74, cuman yang dibawa ke GUI hanya presentase saja, sedangkan nilai yang genap g' dipake. Terus, diline 81, threadnya dibuat sleep biar ada jeda untuk update tampilan GUI-nya oleh fungsi updateGUI. Kemudian diline terakhir untuk (85), jumlah bilangan ganjilnya dikirim ke fungsi "selesai". fungsi "selesai" tersebut akan dieksekusi tepat setelah fungsi "threadProcess" selesai.

Beralih ke fungsi "updateGUI". Di line 90, progressBar akan diupdate nilainya sesuai dengan nilai presentasi dari fungsi threadProcess. Kemudian di line berikutnya dicek, jika userstate tidak nol {bilangan ganjil} maka bilangan tersebut akan ditambahkan ke listbox.

Untuk fungsi "selesai". Dia hanya menampilkan jumlah bilangan ganjil yang didapat dari fungsi threadProcess yaitu mBilGanjil.

Setelah ketiga fungsi diatas ditambahkan, maka boleh dikatakan kita telah membuat kerangka background worker dan telah siap digunakan. Untuk menggunakan background worker ini, tambahkan kode berikut didalam fungsi handle untuk button "start" seperti terlihat di bawah :


Ok, sekarang kita sudah dapat menggunakan aplikasi yang telah kita buat. Silahkan di run, dan masukkan nilai 100 pada textboxnya, kemudian tekan tombol "start" :



Ok,,,Terlihat programnya telah berjalan sesuai dengan yang diharapkan. Selanjutnya kita dapat melangkah untuk memberikan konfigurasi-konfigurasi untuk progressbar-nya, misalkan dengan mengubah warna hijaunya dengan warna ungu :


Hasilnya :


Cukup sekian permainan tentang progressbar dan background workernya. Moga bermanfaat... :-)


*Info lain seputar progressbar masih dalam proses... :-)

No comments:

Post a Comment