C# Windows Tutorial Aplikasi Formulir Beserta Contohnya

Sejauh ini kita telah melihat cara bekerja dengan C# untuk membuat aplikasi berbasis konsol. Namun dalam skenario kehidupan nyata, tim biasanya menggunakan Visual Studio dan C# untuk membuat Windows Formulir atau aplikasi berbasis web.

Aplikasi Windows Form adalah aplikasi yang dirancang untuk dijalankan di komputer. Aplikasi ini tidak akan berjalan di peramban web karena akan menjadi aplikasi web.

Tutorial ini akan fokus pada bagaimana kita bisa berkreasi Windowsaplikasi berbasis. Kita juga akan mempelajari beberapa dasar tentang cara bekerja dengan berbagai elemen C# Windows aplikasi.

Windows Dasar-Dasar Bentuk

A Windows Aplikasi formulir adalah aplikasi yang berjalan di komputer desktop. A Windows Aplikasi formulir biasanya memiliki kumpulan kontrol seperti label, kotak teks, kotak daftar, dll.

Di bawah ini adalah contoh sederhananya Windows formulir aplikasi C#. Ini menunjukkan layar Login sederhana, yang dapat diakses oleh pengguna. Pengguna akan memasukkan kredensial yang diperlukan dan kemudian mengklik tombol Login untuk melanjutkan.

Demikianlah contoh kontrol yang tersedia pada aplikasi diatas

Ini adalah kumpulan kontrol label yang biasanya digunakan untuk menjelaskan kontrol yang berdekatan. Jadi dalam kasus kita, kita memiliki 2 kotak teks, dan label digunakan untuk memberi tahu pengguna bahwa satu kotak teks untuk memasukkan nama pengguna dan yang lainnya untuk kata sandi.
Kedua kotak teks digunakan untuk menampung nama pengguna dan kata sandi yang akan dimasukkan oleh pengguna.
Terakhir, kami memiliki kontrol tombol. Kontrol tombol biasanya memiliki beberapa kode yang dilampirkan untuk melakukan serangkaian tindakan tertentu. Jadi misalnya dalam kasus di atas, kita dapat meminta tombol tersebut melakukan tindakan memvalidasi nama pengguna dan kata sandi yang dimasukkan oleh pengguna.

C# Halo Dunia

Sekarang mari kita lihat contoh bagaimana kita dapat mengimplementasikan aplikasi 'hello world' sederhana di Visual Studio. Untuk ini, kita perlu mengimplementasikan langkah-langkah yang disebutkan di bawah ini

Langkah 1) Langkah pertama melibatkan pembuatan proyek baru di Visual Studio. Setelah meluncurkan Visual Studio, Anda harus memilih opsi menu Baru->Proyek.

Langkah 2) Langkah selanjutnya adalah memilih jenis proyek sebagai a Windows Aplikasi formulir. Disini kita juga perlu menyebutkan nama dan lokasi proyek kita.

Dalam kotak dialog proyek, kita dapat melihat berbagai pilihan untuk membuat berbagai jenis proyek di Visual Studio. Klik Windows pilihan di sisi kiri.
Ketika kami mengklik Windows opsi pada langkah sebelumnya, kita akan dapat melihat opsi untuk Windows Formulir Aplikasi. Klik opsi ini.
Kami akan memberi nama untuk aplikasi tersebut. Dalam kasus kami, ini adalah DemoApplication. Kami juga akan menyediakan lokasi untuk menyimpan aplikasi kami.
Terakhir, kita klik tombol 'OK' untuk membiarkan Visual Studio membuat proyek kita.

Jika langkah-langkah di atas diikuti, Anda akan mendapatkan output di bawah ini di Visual Studio.

Keluaran:-

Anda akan melihat Form Designer ditampilkan di Visual Studio. Di Form Designer inilah Anda akan mulai membangun Windows Aplikasi formulir.

Di Solution Explorer, Anda juga akan dapat melihat DemoApplication Solution. Solusi ini akan berisi 2 file proyek di bawah ini

Aplikasi Formulir bernama Forms1.cs. File ini akan berisi semua kode untuk Windows Formulir aplikasi.
Program utama yang disebut Program.cs adalah berkas kode default yang dibuat saat aplikasi baru dibuat di Visual Studio. Kode ini akan berisi kode awal untuk aplikasi secara keseluruhan.

Di sisi kiri Visual Studio, Anda juga akan melihat AlatBoxKotak peralatan berisi semua kontrol yang dapat ditambahkan ke Windows Formulir. Kontrol seperti kotak teks atau label hanyalah beberapa kontrol yang dapat ditambahkan ke formulir. Windows Formulir.

Berikut adalah tangkapan layar tampilan Toolbox.

Langkah 3) Pada langkah ini, kita akan menambahkan label ke Formulir yang akan menampilkan “Halo Dunia.” Dari kotak peralatan, Anda perlu memilih kontrol Label dan cukup menyeretnya ke Formulir.

Setelah Anda menyeret label ke formulir, Anda dapat melihat label yang disematkan pada formulir seperti yang ditunjukkan di bawah ini.

Langkah 4) Langkah selanjutnya adalah pergi ke properti kontrol dan Ubah teks menjadi 'Hello World'.

Untuk masuk ke properti kontrol, Anda perlu mengklik kanan kontrol dan memilih opsi menu Properti

Panel properti juga muncul di Visual Studio. Jadi untuk kontrol label, di kontrol properti, buka bagian Teks dan masukkan “Halo Dunia”.
Setiap Kontrol memiliki sekumpulan properti yang mendeskripsikan kontrol.

Jika Anda mengikuti semua langkah di atas dan menjalankan program Anda di Visual Studio, Anda akan mendapatkan output berikut

Keluaran:-

Pada outputnya, Anda dapat melihat bahwa Windows Formulir ditampilkan. Anda juga dapat melihat 'Hello World' ditampilkan pada formulir.

Menambahkan Kontrol ke formulir

Kita telah melihat cara menambahkan kontrol ke formulir ketika kita menambahkan kontrol label di bagian sebelumnya untuk menampilkan “Halo Dunia.”

Mari kita lihat kontrol lain yang tersedia Windows bentuk dan melihat beberapa sifat umum mereka.

Dalam kami Windows contoh aplikasi formulir dalam C#, kita akan membuat satu formulir yang akan memiliki fungsionalitas berikut.

Kemampuan bagi pengguna untuk memasukkan nama dan alamat.
Opsi untuk memilih kota tempat tinggal pengguna
Kemampuan bagi pengguna untuk memasukkan opsi gender.
Opsi untuk memilih kursus yang ingin dipelajari pengguna. Akan ada pilihan untuk C# dan ASP.Net

Jadi mari kita lihat setiap kontrol secara detail dan menambahkannya untuk membuat formulir dengan fungsionalitas yang disebutkan di atas.

Kelompok Box

Kotak grup digunakan untuk mengelompokkan kontrol secara logis ke dalam satu bagian. Mari kita ambil contoh jika Anda memiliki sekumpulan kontrol untuk memasukkan detail seperti nama dan alamat seseorang. Idealnya, ini adalah detail seseorang, jadi Anda ingin memiliki detail ini di bagian terpisah pada Formulir. Untuk tujuan ini, Anda dapat memiliki kotak grup. Mari kita lihat bagaimana kita dapat menerapkannya dengan contoh yang ditunjukkan di bawah ini

Langkah 1) Langkah pertama adalah menyeret kontrol Groupbox ke Windows Formulir dari kotak peralatan seperti yang ditunjukkan di bawah ini

Langkah 2) Setelah groupbox ditambahkan, buka jendela properti dengan mengklik kontrol groupbox. Di jendela properti, buka properti Text dan ubah ke “User Details”.

Setelah Anda membuat perubahan di atas, Anda akan melihat output berikut

Keluaran:-

Pada output, Anda dapat melihat dengan jelas bahwa Groupbox telah ditambahkan ke formulir. Anda juga dapat melihat bahwa teks groupbox telah diubah menjadi “User Details.”

Kontrol Label

Berikutnya adalah Kontrol Label. Kontrol label digunakan untuk menampilkan teks atau pesan kepada pengguna pada formulir. Kontrol label biasanya digunakan bersama dengan kontrol lainnya. Contoh umum adalah saat label ditambahkan bersama dengan kontrol kotak teks.

Label menunjukkan kepada pengguna apa yang diharapkan untuk diisi di kotak teks. Mari kita lihat bagaimana kita dapat menerapkannya dengan contoh yang ditunjukkan di bawah ini. Kita akan menambahkan 2 label, satu yang akan disebut 'nama' dan yang lainnya disebut 'alamat.' Label-label tersebut akan digunakan bersama dengan kontrol kotak teks yang akan ditambahkan di bagian selanjutnya.

Langkah 1) Langkah pertama adalah menyeret kontrol label ke Windows Bentuk dari kotak peralatan seperti yang ditunjukkan di bawah ini. Pastikan Anda menyeret kontrol label 2 kali sehingga Anda dapat memiliki satu untuk 'nama' dan yang lainnya untuk 'alamat'.

Langkah 2) Setelah label ditambahkan, buka jendela properti dengan mengklik kontrol label. Di jendela properti, buka properti Teks dari setiap kontrol label.

Setelah Anda membuat perubahan di atas, Anda akan melihat output berikut

Keluaran:-

Anda dapat melihat kontrol label ditambahkan ke formulir.

Kolom tulisan

Kotak teks digunakan untuk memungkinkan pengguna memasukkan beberapa teks pada Windows aplikasi dalam C#. Mari kita lihat bagaimana kita dapat mengimplementasikannya dengan contoh yang ditunjukkan di bawah ini. Kita akan menambahkan 2 kotak teks ke formulir, satu untuk Nama dan yang lainnya untuk alamat yang akan dimasukkan untuk pengguna

Langkah 1) Langkah pertama adalah menyeret kontrol kotak teks ke Windows Formulir dari kotak peralatan seperti yang ditunjukkan di bawah ini

Langkah 2) Setelah kotak teks ditambahkan, buka jendela properti dengan mengeklik kontrol kotak teks. Di jendela properti, buka properti Nama dan tambahkan nama yang bermakna ke setiap kotak teks. Misalnya, beri nama kotak teks untuk pengguna sebagai txtName dan untuk alamat sebagai txtAddress. Konvensi dan standar penamaan harus dibuat untuk kontrol karena akan lebih mudah untuk menambahkan fungsionalitas tambahan ke kontrol ini, yang akan kita lihat nanti.

Setelah Anda membuat perubahan di atas, Anda akan melihat output berikut

Keluaran:-

Pada output, Anda dapat melihat dengan jelas bahwa Kotak Teks telah ditambahkan ke formulir.

Kotak daftar

Listbox digunakan untuk menampilkan daftar item pada Windows formulir. Mari kita lihat bagaimana kita dapat menerapkannya dengan contoh yang ditunjukkan di bawah ini. Kita akan menambahkan kotak daftar ke formulir untuk menyimpan beberapa lokasi kota.

Langkah 1) Langkah pertama adalah menyeret kontrol kotak daftar ke Windows Formulir dari kotak peralatan seperti yang ditunjukkan di bawah ini

Langkah 2) Setelah kotak daftar ditambahkan, buka jendela properti dengan mengklik kontrol kotak daftar.

Pertama, ubah properti kontrol kotak Listbox, dalam kasus kami, kami telah mengubahnya menjadi lstCity
Klik pada properti Items. Ini akan memungkinkan Anda untuk menambahkan berbagai item yang dapat ditampilkan di kotak daftar. Dalam kasus kami, kami telah memilih item “collection”.
Di Editor Koleksi String yang muncul, masukkan nama kota. Dalam kasus kami, kami telah memasuki “Mumbai”, “Bangalore” dan “Hyderabad”.
Terakhir, klik tombol 'OK'.

Setelah Anda membuat perubahan di atas, Anda akan melihat output berikut

Keluaran:-

Pada output, Anda dapat melihat bahwa Listbox telah ditambahkan ke formulir. Anda juga dapat melihat bahwa listbox telah diisi dengan nilai kota.

Tombol radio

Radiobutton digunakan untuk menampilkan daftar item yang dapat dipilih oleh pengguna. Mari kita lihat bagaimana kita dapat menerapkannya dengan contoh di bawah ini. Kami akan menambahkan tombol radio untuk opsi pria/wanita.

Langkah 1) Langkah pertama adalah menyeret kontrol 'radiobutton' ke Windows Bentuk dari kotak peralatan seperti yang ditunjukkan di bawah ini.

Langkah 2) Setelah Radiobutton ditambahkan, buka jendela properti dengan mengklik kontrol Radiobutton.

Pertama, Anda perlu mengubah properti teks dari kedua kontrol Radio. Buka jendela properti dan ubah teks menjadi laki-laki pada salah satu tombol radio dan teks pada tombol radio lainnya menjadi perempuan.
Demikian pula, ubah properti nama kedua kontrol Radio. Buka jendela properti dan ubah nama menjadi 'rdMale' untuk satu tombol radio dan menjadi 'rdfemale' untuk tombol radio lainnya.

Setelah Anda membuat perubahan di atas, Anda akan melihat output berikut

Keluaran:-

Anda akan melihat tombol Radio ditambahkan ke Windows bentuk.

kotak centang

Kotak centang digunakan untuk menyediakan daftar pilihan yang memungkinkan pengguna memilih beberapa pilihan. Mari kita lihat bagaimana kita dapat menerapkannya dengan contoh yang ditunjukkan di bawah ini. Kita akan menambahkan 2 kotak centang ke Windows formulir. Kotak centang ini akan memberikan pilihan kepada pengguna apakah mereka ingin mempelajari C# atau ASP.Net.

Langkah 1) Langkah pertama adalah menyeret kontrol kotak centang ke Windows Formulir dari kotak peralatan seperti yang ditunjukkan di bawah ini

Langkah 2) Setelah kotak centang ditambahkan, buka jendela properti dengan mengklik kontrol Kotak Centang.

Di jendela properti,

Pertama, Anda perlu mengubah properti teks dari kedua kontrol kotak centang. Buka jendela properti dan ubah teks menjadi C# dan ASP.Net.
Demikian pula, ubah nama properti kedua kontrol Radio. Buka jendela properti dan ubah nama menjadi chkC untuk satu kotak centang dan menjadi chkASP untuk yang lain.

Setelah Anda membuat perubahan di atas, Anda akan melihat output berikut

Keluaran:-

Tombol

Tombol digunakan untuk memungkinkan pengguna mengklik tombol yang kemudian akan memulai pemrosesan formulir. Mari kita lihat bagaimana kita dapat menerapkannya dengan contoh di bawah ini. Kami akan menambahkan tombol sederhana bernama 'Kirim' yang akan digunakan untuk mengirimkan semua informasi pada formulir.

Langkah 1) Langkah pertama adalah menyeret kontrol tombol ke Windows Formulir dari kotak peralatan seperti yang ditunjukkan di bawah ini

Langkah 2) Setelah Tombol ditambahkan, buka jendela properti dengan mengklik kontrol Tombol.

Pertama, Anda perlu mengubah properti teks pada kontrol tombol. Buka jendela properti dan ubah teks menjadi 'submit'.
Demikian pula, ubah nama properti kontrol. Buka jendela properti dan ubah nama menjadi 'btnSubmit'.

Setelah Anda membuat perubahan di atas, Anda akan melihat output berikut

Keluaran:-

Selamat, Anda sekarang memiliki dasar pertama Anda Windows Bentuk di tempatnya. Sekarang mari kita beralih ke topik berikutnya untuk melihat bagaimana kita dapat melakukan penanganan Event untuk Kontrol.

C# Penanganan Peristiwa untuk Kontrol

Saat bekerja dengan form windows, Anda dapat menambahkan event ke kontrol. Event adalah sesuatu yang terjadi saat suatu tindakan dilakukan. Mungkin tindakan yang paling umum adalah mengklik tombol pada form. Dalam C# Windows Formulir, Anda dapat menambahkan kode yang dapat digunakan untuk melakukan tindakan tertentu ketika tombol pada formulir ditekan.

Biasanya ketika tombol ditekan pada formulir, itu berarti beberapa pemrosesan harus dilakukan.

Mari kita lihat salah satu kejadian dan cara menanganinya sebelum kita masuk ke skenario kejadian tombol.

Contoh di bawah ini akan menampilkan peristiwa untuk kontrol Listbox. Jadi, setiap kali item dipilih dalam kontrol listbox, kotak pesan akan muncul yang menunjukkan item yang dipilih. Mari kita lakukan langkah-langkah berikut untuk mencapainya.

Langkah 1) Double klik pada Listbox di desainer formulir. Dengan melakukan ini, Visual Studio akan secara otomatis membuka berkas kode untuk formulir tersebut. Dan secara otomatis akan menambahkan metode peristiwa ke dalam kode. Metode peristiwa ini akan dipicu, setiap kali item apa pun dalam kotak daftar dipilih.

Di atas adalah potongan kode yang secara otomatis ditambahkan oleh Visual Studio, saat Anda mengklik dua kali kontrol List box pada formulir. Sekarang mari tambahkan bagian kode di bawah ini ke potongan kode ini, untuk menambahkan fungsionalitas yang diperlukan ke acara listbox.

Ini adalah metode penanganan peristiwa yang secara otomatis dibuat oleh Visual Studio saat Anda mengklik dua kali kontrol kotak Daftar. Anda tidak perlu khawatir tentang kerumitan nama metode atau parameter yang diteruskan ke metode tersebut.
Di sini kita mendapatkan SelectedItem melalui properti lstCity.SelectedItem. Ingat bahwa lstCity adalah nama kontrol Listbox kita. Kita kemudian menggunakan metode GetItemText untuk mendapatkan nilai sebenarnya dari item yang dipilih. Kita kemudian menetapkan nilai ini ke variabel teks.
Terakhir, kami menggunakan PesanBox metode untuk menampilkan nilai variabel teks kepada pengguna.

Setelah Anda membuat perubahan di atas, dan menjalankan program di Visual Studio, Anda akan melihat output berikut

Keluaran:-

Dari output, Anda dapat melihat bahwa saat item apa pun dari kotak daftar dipilih, kotak pesan akan muncul. Ini akan menampilkan item yang dipilih dari kotak daftar.

Sekarang mari kita lihat kontrol terakhir yaitu Metode klik tombol. Sekali lagi ini mengikuti filosofi yang sama. Cukup klik dua kali tombol di Forms Designer dan secara otomatis akan menambahkan metode untuk pengendali peristiwa tombol. Kemudian Anda hanya perlu menambahkan kode di bawah ini.

Ini adalah metode penanganan peristiwa yang secara otomatis dibuat oleh Visual Studio saat Anda mengklik dua kali kontrol tombol. Anda tidak perlu khawatir tentang kerumitan nama metode atau parameter yang diteruskan ke metode tersebut.
Di sini kita mendapatkan nilai yang dimasukkan dalam kotak teks nama dan alamat. Nilai dapat diambil dari properti teks kotak teks. Kemudian kita tetapkan nilai ke 2 variabel, nama, dan alamat.
Terakhir, kami menggunakan PesanBox metode untuk menampilkan nilai nama dan alamat kepada pengguna.

Setelah Anda membuat perubahan di atas, dan menjalankan program di Visual Studio, Anda akan melihat output berikut

Keluaran:-

Pertama, masukkan nilai di kolom nama dan alamat.
Kemudian klik tombol Kirim

Setelah Anda mengklik tombol Kirim, kotak pesan akan muncul dan akan menampilkan dengan benar apa yang Anda masukkan di bagian detail pengguna.

Pohon dan GambarBox kontrol

Ada 2 kontrol lebih lanjut yang bisa kita lihat, satu adalah 'Kontrol Pohon' dan yang lainnya adalah 'Kontrol Gambar'. Mari kita lihat contoh bagaimana kita dapat menerapkan kontrol ini

Pengendalian Pohon

– Kontrol pohon digunakan untuk membuat daftar item dalam mode seperti pohon. Mungkin contoh terbaiknya adalah ketika kita melihat Windows Penjelajah itu sendiri. Struktur folder di Windows Explorer itu seperti struktur mirip pohon.

Mari kita lihat bagaimana kita dapat menerapkannya dengan contoh di bawah ini.

Langkah 1) Langkah pertama adalah menyeret kontrol Pohon ke Windows Formulir dari kotak peralatan seperti yang ditunjukkan di bawah ini

Langkah 2) Langkah selanjutnya adalah mulai menambahkan node ke kumpulan pohon sehingga dapat muncul di pohon sesuai dengan itu. Pertama, ikuti sub-langkah di bawah ini untuk menambahkan simpul akar ke kumpulan pohon.

Buka kotak peralatan properti untuk kontrol tampilan pohon. Klik pada properti Node. Ini akan memunculkan Editor TreeNode
Di Editor TreeNode, klik tombol Tambah Akar untuk menambahkan simpul akar ke koleksi pohon.
Selanjutnya, ubah teks dari node Root dan berikan teks sebagai Root dan klik tombol 'OK'. Ini akan menambahkan simpul Root.

Langkah 3) Langkah selanjutnya adalah mulai menambahkan node anak ke kumpulan pohon. Mari ikuti sub-langkah di bawah ini untuk menambahkan simpul akar anak ke kumpulan pohon.

Pertama, klik tombol Tambahkan anak. Ini akan memungkinkan Anda untuk menambahkan node anak ke koleksi Pohon.
Untuk setiap simpul anak, ubah properti teks. Terus ulangi langkah sebelumnya dan langkah ini dan tambahkan 2 simpul tambahan. Pada akhirnya, Anda akan memiliki 3 simpul seperti yang ditunjukkan di atas, dengan teks sebagai Label, Tombol, dan Kotak Centang.
Klik tombol OK

Setelah Anda membuat perubahan di atas, Anda akan melihat output berikut.

Keluaran:-

Anda akan dapat melihat tampilan Pohon ditambahkan ke formulir. Saat Anda menjalankan Windows formulir aplikasi, Anda dapat memperluas simpul akar dan melihat simpul anak dalam daftar.

GambarBox kontrol

Kontrol ini digunakan untuk menambahkan gambar ke Winforms C#. Mari kita lihat bagaimana kita dapat menerapkannya dengan contoh di bawah ini.

Langkah 1) Langkah pertama adalah menyeret GambarBox kontrol ke C# Windows Formulir dari kotak peralatan seperti yang ditunjukkan di bawah ini

Langkah 2) Langkah selanjutnya adalah melampirkan gambar ke kontrol kotak gambar. Ini dapat dilakukan dengan mengikuti langkah-langkah berikut.

Pertama, klik pada properti Gambar untuk GambarBox kontrol. Sebuah jendela baru akan muncul.
Di jendela ini, klik tombol Impor. Tombol ini akan digunakan untuk melampirkan gambar ke kontrol picturebox.
Kotak dialog akan muncul di mana Anda dapat memilih gambar untuk dilampirkan ke kotak gambar
Klik tombol OK

Setelah Anda membuat perubahan di atas, Anda akan melihat output berikut

Keluaran:-

Dari outputnya, Anda dapat melihat bahwa gambar ditampilkan pada formulir.

Kesimpulan

A Windows Form dalam aplikasi C# adalah form yang berjalan di desktop komputer. Visual Studio Form bersama dengan C# dapat digunakan untuk membuat Windows Aplikasi formulir.
Kontrol dapat ditambahkan ke Windows formulir C# melalui Toolbox di Visual Studio. Kontrol seperti label, kotak centang, tombol radio, dll. dapat ditambahkan ke formulir melalui toolbox.
Seseorang juga dapat menggunakan kontrol lanjutan seperti kontrol tampilan pohon dan GambarBox kontrol.
Pengendali peristiwa digunakan untuk merespons peristiwa yang dihasilkan dari kontrol. Yang paling umum adalah yang ditambahkan untuk acara klik tombol.

Baca Selengkapnya