Program sederhana dengan C# menghitung sekor bola

Berikut adalah membuat Aplikasi Penghitung sekor bola dengan C#
1. Klik tombol Start , pada Windows Taskbar, kemudianpilih All Programs > Microsoft Visual Studio 2005 > Microsoft Visual Studio 2005, lihat Gambar 1.

Gambar 1. Membuka Program Microsoft Visual Studio 2005

Catatan :
Jika Anda baru pertama kali menjalankan program Microsoft Visual Studio 2005 ini, maka akan tampil kotak dialog yang meminta Anda untuk memilih editor bahasa pemrograman manakah yang akan menjadi editor utama (default) setiap kali program Microsoft Visual Studio 2005 dijalankan. Anda silahkan pilih / klik pada pilihan C#, lalu tekan tombol Ok.
2. Lalu akan tampil Start Page seperti pada gambar di bawah ini.

Gambar 2. Tampilan Start Page

2. Membuat Project Baru

Selanjutnya kita akan belajar bagaimana cara untuk membuat project baru. Berikut langkah-langkahnya.
1. Pada Start Page ini kita akan membuat project baru, caranya adalah sebagai berikut. Klik Project… yang berada disamping tulisan Create. Seperti pada gambar di bawah ini.

Gambar 3. Membuat Projet Baru

2. Lalu akan tampil kotak dialog New Project. Pada Project types: klik Visual C# lalu pilih Windows. Kemudian bagian Templates: pilih Windows Application. Setelah itu klik tombol Browse.. . Lihat gambardi bawah ini.

Gambar 4. Petunjuk Memilih Jenis Aplikasi

3. Akan muncul kotak dialog Project Location. Pilih lokasi penyimpanan file project Anda, klik tombol Create New Folder, isikan nama foldernya (saya menggunakan nama ‘e-Trik_1’). Tekan OK, akan otomatis masuk ke folder baru tersebut, lalu tekan tombol Open. Lihat Gambar 5.

Gambar 5. Menyiapkan Folder Penyimpanan Project

4. Setelah itu tampilan akan kembali lagi ke kotak dialog New Project, kotak dialog seperti yang ada di Gambar 4.
5. Pada bagian Name:, isi dengan nama project Anda, untuk tahap ini nama project-nya lebih baik disamakan dulu dengan penulis untuk menghindari adanya kebingungan yang mungkin timbul nantinya. Nama project-nya, yaitu menghitungPointSepakBola, perhatikan cara penulisannya, besar kecil hurufnya, dan harus tanpa spasi.
6. Pastikan checkbox Create directory for solution dicentang, lalu tekan tombol OK. Lihat Gambar 6 untuk langkah 5 dan 6.

Gambar 6.Memberi Nama Project

7. Selanjutnya kita akan dibawa ke area kerja (workspace). Disinilah kita akan melakukan berbagai aktivitas kita, mulai dari mendesain tata letak objek, coding, hingga debugging program. Lihat Gambar 7.

Gambar 7. Tampilan Area Kerja Visual C# (C++) 2005

3. Membuat Program

Pada bagian ini kita akan mulai belajar bagaimana cara untuk membuat program kita sendiri. Berikut deskripsi program yang akan kita buat.

• Program berguna untuk menghitung poin yang diterima sebuah klub sepakbola.
• Nilai yang diinput oleh user adalah, jumlah kemenangan, jumlah kekalahan, dan jumlah hasil seri yang dialami oleh klub tersebut.
• Program juga akan memutuskan apakah klub bersangkutan berada di peringkat utama atau kedua.
• Dengan kondisi, jika poin-nya lebih besar dari 50, maka berada di peringkat 1. Sedangkan, jika poin-nya sama dengan atau lebih kecil dari 50, maka berada di peringkat 2.
• Tampilan hasil akhir program yang akan kita buat nanti adalah seperti pada Gambar 8.

Gambar 8. Tampilan Hasil Akhir Program

Langkah-langkah membuat tampilan program tersebut adalah sebagai berikut:
1. File project yang kita gunakan adalah yang sebelumnya kita buat, yaitu menghitungPointSepakBola.
2. Jika Anda sudah menutup project-nya, Anda bisa membukanya dengan cara. Klik File > Open > Project/Solution…, lalu cari file project yang tadi kita buat.
3. Setelah itu, pada ToolBox, bagian Common Controls, anda klik komponen Label, lalu drag ke Form1 (Gambar 9). Mengenai letaknya sembarang saja dulu, karena nanti kita akan mengaturnya melalui Properties.

Gambar 9. Klik Dan Drag Label Ke Form 1

4. Masukkan lagi 7 buah Label, 5 buah TextBox , 3 buah Button, atur tata letaknya kira-kira seperti Gambar 10.

Gambar 10. Tata Letak Awal Komponen

5. Setelah itu, kita akan mengatur Properties dari masing-masing komponen. Caranya adalah, jika Panel Properties yang berada di sebelah kanan layar monitor (Panel Properties seperti yang ada pada Gambar 7), di bawah Solution Explorer belum tampil. Maka, klik kanan pada salah satu komponen, misalkan Label1. Lalu pilih Properties.
6. Ubah Value (nilai) dari Properties Text dengan kata ‘Main’ (Gambar 11).
7. Lalu ubah juga Properties Location, dengan nilai (lihat Gambar 12).
8. Lalu ubah nilai Properties Font, dengan cara klik (lihat Gambar 13). Maka akan tampil kotak dialog Font. Pada bagian Font Style, pilih Bold, tekan OK (lihat Gambar 14).

Gambar 11. Menguba Value Properties Text

Gambar 12. Mengubah Value Properties Location

Gambar 13. Mengubah Value Properties Font

Gabar 14. Kotak Dialog Font

9. Untuk langkah selanjutnya, kita akan mengubah semua nilai properties pada masing-masing objek yang ada pada Form1, termasuk Form1 itu sendiri. Untuk mengetahui objek dan properties yang mana yang akan diubah, dan apa nilainya, silahkan Anda lihat pada Tabel 1.

Tabel 1. Properties Dan Value Yang Akan Dibah

Catatan :

• Untuk mengubah nilai properties Form1, klik pada area kosong di Form1, jangan di atas objek/kontrol.
• Supaya tidak terjadi masalah ke depannya nanti, tolong untuk nilai properties-nya terutama properties (Name), Location dan Size, benar-benar disamakan dengan yang ada pada Tabel 8.
• Untuk pemrograman berbasis objek, biasakanlah dalam hal penamaan komponen / kontrol dengan diawali singkatan jenis kontrol yang bersangkutan. Misal, untuk komponen TextBox, diberi nama txtHasil. Untuk komponen Button, diberi nama cmdHitung (cmd singkatan dari Command, kebiasaan di VB) atau btnHitung. Dijamin hal ini bisa lebih mempermudah Anda dalam melakukan pengkodean nantinya.

Akan tetapi belum bisa berinteraksi dengan user atau pengguna, maka dari itu kita perlu melakukan tahap yang disebut coding atau pengkodean. Langkah-langkah melakukan pengkodean program adalah sebagai berikut:
1. Klik ganda pada komponen txtMenang, ketikkan kode yang berwarna merah seperti dibawah ini.

Gambar 15. Membuat Program

Keterangan Program:

• Baris 1, 2, dan 4: akan tercipta dengan sendirinya begitu kita melakukan klik ganda pada komponen txtMenang tadi. Jadi tidak perlu diketik lagi.
• Baris 1: txtMenang_TextChanged adalah nama komponen (txtMenang) dan nama event-nya (TextChanged).
• Event adalah trigger yang akan memicu baris kode di dalamnya untuk dijalankan. Biasanya event dipicu oleh interaksi pengguna dengan program yang kita buat.
• Pada event untuk komponen txtMenang ini, baris kode akan dijalankan jika pada komponen txtMenang terjadi perubahan teks atau isinya.
• Baris 3: berguna untuk memanggil method HitungJumlahMain(), method ini sendiri nanti akan kita buat.

2. Kembali lagi ke form design, dengan cara klik tab pada bagian atas yang bertuliskan Form1.cs [Design].
3. Setelah itu, lalukan cara yang sama seperti pada langkah 1, untuk komponen txtSeri dan txtKalah. Sehingga hasilnya nanti seperti ini.

Gambar 16. Membuat Program

4. Kembali lagi ke form design dengan cara yang sama seperti pada langkah 2.
5. Lalu klik ganda pada komponen cmdHitung untuk masuk kembali ke editor kode, dan ketikkan kode berikut.

Gambar 17. Membuat Program

Keterangan Program:

• Baris 1 dan 2: mendeklarasikan tujuh buah variabel bertipe data Integer.
• Baris 5: mengambil isi dari komponen txtMenang, dan karena data bertipe String maka harus dikonversi dulu ke tipe Integer. Setelah itu masukkan hasilnya ke variabel jmlMenang. - Baris 6 dan 7: sama dengan baris 6. Untuk setiap data dari komponen TextBox, Label, ComboBox, dll, tipe datanya adalah String. Maka jika variabel penampungnya bukan String juga, harus dikonversi ke tipe data yang sesuai.
• Baris 8, 10, 12: adalah baris komentar. Komentar tidak akan diparsing oleh bahasa pemrograman, jadi tidak akan berpengaruh dengan program yang kita buat.
• Dalam membuat program biasakanlah untuk memberikan komentar seperlunya, hal ini sangat berguna untuk mengingatkan kita, misalnya, apa maksud dan guna dari kode ini, variabel ini berguna untuk program yang mana, dan lain-lain.
• Baris 9: menghitung jumlah poin yang diperoleh untuk kemenangan (jmlPoinMenang), dengan rumus banyaknya kemenangan yang diraih (jmlMenang) dikalikan dengan 3.
• Baris 11: menghitung jumlah poin yang diperoleh untuk hasil seri (jml Poin Seri), dengan rumus banyaknya hasil seri yang diraih (jml Seri) dikalikan dengan 1.
• Baris 13: menghitung jumlah poin yang diperoleh untuk kekalahan (jml Poin Kalah), dengan rumus banyaknya kekalahan yang diraih (jml Kalah) dikalikan dengan 0. Sebetulnya baris kode ini bisa diganti dengan jmlPoinKalah = 0, karena bagaimanapun juga, hasil dari perhitungan ini akan tetap menghasilkan nilai 0 (nol).
• Baris 14: menjumlahkan hasil dari proses pada baris 11, 14, dan 17, lalu hasilnya disimpan ke variabel jmlPoint.
• Baris 15: menampilkan isi variabel jmlPoint, melalui komponen txt Point. Akan tetapi, sebelumnya harus dikonversi dulu ke tipe String (ToString()).
• Baris 16: menentukan klub kita ada diperingkat berapa berdasarkan jmlPoint, dengan menggunakan method Tentukan Peringkat Klub(). Lalu hasilnya akan ditampilkan melalui lblPeringkatKlub.

6. Klik ganda cmdReset, ketikkan kode berwarna merah berikut ini.

Gambar 18. Mebuat Program

Keterangan Program:

• Kode ini berguna untuk me-reset atau mengembalikan kondisi tampilan seolah-olah seperti program baru dijalankan.
• Baris 3-7: mengisi masing-masing komponen dengan angka 0. Karena angka 0 bukan bertipe string jadi harus dikonversi dulu ke tipe String, dengan menggunakan perintah Convert.ToString() .
• Sebenarnya untuk baris 3-7 bisa saja kodenya diganti dengan, misal txtMain.Text = “0”; . Akan tetapi yang harus diingat, meskipun jumlah karakternya hanya 1 (yaitu 0), akan tetapi jangan dianggap sebagai karakter dan ditulis dengan petik satu (‘0’), karena akan menyebabkan program error.
• Baris 8: mengisi komponen lblPeringkatKlub dengan simbol ? .

7. Klik ganda cmdKeluar, ketikkan kode berikut ini.

Gambar 19. Membuat Program

Keterangan Program:

• Kode ini berguna untuk keluar dari program.
• Baris 3: this, maksudnya Form1. Close(), adalah method untuk menutup program.

8. Selanjutnya kita akan membuat method kita sendiri, yaitu method dengan nama HitungJumlahMain(). Ketikkan kode yang berwarna merah berikut dibawah kode sebelumnya tadi. Lihat kode dibawah ini.

Gambar 20. Membuat Program

Keterangan Program:

• Baris 1 dan 2: potongan kode program langkah 7, untuk menunjukkan dimana posisi kita mulai mengetikkan kode langkah 8.
• Baris 4: karena method ini tidak punya nilai kembalian (return value), jadi bertipekan void.
• Baris 7-14: adalah salah satu kelebihan yang dimiliki oleh C#, yaitu perangkap kesalahan (exception handling).
• Baris 7-10: mencoba (try) untuk mengkonversi isi dari variabel txt Menang ke tipe data Integer. Jika ada kesalahan (error), misalnya, txt Menang masih kosong, atau diinput yang bukan angka. Maka program akan menjalankan baris kode di dalam catch, yaitu men-set isi komponen txtMenang dengan angka 0 (nol).
• Baris 31: menjumlahkan variabel jmlMenang, jmlSeri, jmlKalah, hasilnya simpan ke variabel jmlMain.
• Baris 35: tampilkan isi variabel jmlMain, ke dalam komponen txtMain, setelah sebelumnya (lagi-lagi) dikonversi ke tipe data String.

9. Dan untuk yang terakhir, kita akan membuat method dengan nama Tentukan Peringkat Klub (). Ketikkan kode berikut ini.

Gambar 21. Membuat program

Keterangan Program:

• Baris 2: berbeda dengan method yang pertama kita buat (langkah 7), method kali ini memiliki parameter, yaitu variabel int jumlahPoin. Selain itu karena tipe data yang akan dikembalikan adalah Integer, maka method ini pun harus bertipe Integer (private int TentukanPeringkatKlub()).
• Baris 4-7: periksa apakah nilai yang ada pada variabel jumlahPoin, bernilai lebih besar dari 50. Jika iya, maka nilai kembalian (return value)-nya adalah 1.
• Baris 8-11: jika tidak, maka nilai kembalian (return value)-nya adalah 2.
• Coba Anda lihat lagi penggunaan method ini pada langkah 5 (untuk komponen cmdHitung).  ”lblPeringkatKlub.Text = TentukanPeringkatKlub(jmlPoint).ToString();” Jadi, apabila jmlPoint, misalkan bernilai 65, maka yang akan tampil pada komponen “lblPeringkatKlub adalah angka 1″. Karena 65 lebih besar dari 50, dan nilai kembaliannya adalah 1.

10. Setelah itu tekan tombol F6, untuk melakukan Build Solution. Jika ada error, coba Anda teliti lagi apakah ada kode yang terlewat atau salah dalam pengetikannya. Jika tidak ada error, tekan tombol F5. Maka program akan dijalankan.
Dan tahap terakhir dalam pembuatan program adalah tahap yang disebut testing atau ujicoba program.
Langkah-langkah melakukan ujicoba program adalah sebagai berikut:

1. Setelah program dijalankan, isi Menang dengan angka 25 (misalkan), Seri dengan angka 12, dan Kalah dengan angka 5.
2. Klik tombol Hitung atau tekan kombinasi tombol ALT + H, pada keyboard. Maka program akan menghitung jumlah point dan menampilkannya. Bersamaan dengan itu juga program akan menentukan berada pada peringkat berapakah klub kita.
3. Klik tombol Reset atau ALT + R, untuk mengulangi proses penghitungan.
4. Klik tombol Keluar atau ALT + K, untuk menutup atau keluar dari program.

Gambar 22 Tampilan Running Program

Catatan :
Anda pasti bertanya-tanya, hanya dengan menekan kombinasi tombol ALT + H, Anda bisa menjalankan perintah Hitung, Kenapa?, Kok program bisa tahu bahwa kombinasi tombol tersebut untuk menjalankan perintah Hitung?
Jawabannya adalah, coba Anda lihat lagi Tabel 8 (Properties dan Value yang Akan Diubah). Pada bagian pengaturan komponen Button1 (cmdHitung), properties Text kita isi dengan &Hitung. Nah simbol & itulah yang berguna untuk memberitahu program bahwa karakter setelah simbol &, adalah karakter yang bisa dikombinasikan dengan tombol ALT. Jadi, jika yang diisi adalah Hi&tung, maka kombinasi tombolnya adalah ALT + t.