Tutorial: Membuat aplikasi Windows Forms penampil gambar (.NET Framework)

Dalam rangkaian tiga tutorial ini, Anda membuat aplikasi Windows Forms yang memuat gambar dan menampilkannya. Visual Studio Integrated Design Environment (IDE) menyediakan alat yang Anda butuhkan untuk membuat aplikasi.

Dalam tutorial pertama ini, Anda mempelajari cara:

• Membuat proyek Visual Studio yang menggunakan Windows Forms
• Menambahkan elemen tata letak
• Jalankan aplikasi Anda

Untuk membuat Aplikasi Windows Forms baru dengan .NET, ikuti tutorial Membuat aplikasi Windows Forms dengan .NET. Lihat Panduan Desktop di Windows Forms .NET untuk mempelajari selengkapnya.

Prasyarat

• Anda memerlukan Visual Studio untuk menyelesaikan tutorial ini. Kunjungi halaman unduhan Visual Studio untuk versi gratis.
• Pengembangan desktop .NET beban kerja. Untuk memverifikasi atau menginstal beban kerja ini di Visual Studio, pilih Alat >Dapatkan Alat dan Fitur. Untuk informasi selengkapnya, lihat Mengubah beban kerja atau komponen individual.

Membuat proyek Windows Forms Anda

Saat Anda membuat penampil gambar, langkah pertama adalah membuat proyek Aplikasi Formulir Windows.

1. Buka Visual Studio.

2. Di jendela mulai, pilih Buat proyek baru.

   

3. Pada jendela Buat proyek baru , cari Formulir Windows. Lalu pilih Desktop dari daftar Jenis proyek .

4. Pilih templat Aplikasi Formulir Windows (.NET Framework) untuk C# atau Visual Basic, lalu pilih Berikutnya.

   

5. Di jendela Konfigurasikan proyek baru Anda , beri nama proyek Anda PictureViewer, lalu pilih Buat.

   

Visual Studio membuat solusi untuk aplikasi Anda. Solusinya adalah kontainer untuk semua proyek dan file yang diperlukan oleh aplikasi Anda.

Pada titik ini, Visual Studio menampilkan formulir kosong di Windows Form Designer.

Menambahkan elemen tata letak

Aplikasi tampilan gambar Anda berisi kotak gambar, kotak centang, dan empat tombol, yang Anda tambahkan dalam tutorial berikutnya. Elemen tata letak mengontrol lokasinya pada formulir. Bagian ini memperlihatkan kepada Anda cara mengubah judul formulir Anda, mengubah ukuran formulir, dan menambahkan elemen tata letak.

1. Di proyek Anda, pilih Desainer Formulir Windows. Tab membaca Form1.cs [Design] untuk C# atau Form1.vb [Design] untuk Visual Basic.

2. Pilih di mana saja di Form1.

3. Jendela Properti sekarang menampilkan properti untuk formulir. Jendela Properti biasanya berada di kanan bawah Visual Studio. Bagian ini mengontrol berbagai properti, seperti warna latar depan dan latar belakang, teks judul yang muncul di bagian atas formulir, dan ukuran formulir.

   Jika Anda tidak melihat Properti, pilih Tampilkan>Jendela Properti.

4. Temukan properti Teks di jendela Properti . Bergantung pada cara daftar diurutkan, Anda mungkin perlu menggulir ke bawah. Masukkan nilai Penampil Gambar, lalu pilih Enter.

   Formulir Anda sekarang memiliki teks Penampil Gambar di bilah judulnya.

   Nota

   Anda dapat menampilkan properti menurut kategori atau menurut abjad. Gunakan tombol pada jendela Properti untuk beralih bolak-balik.

5. Pilih formulir, sekali lagi. Pilih pegangan seret di kanan bawah pada formulir. Pegangannya adalah persegi putih kecil di sudut kanan bawah formulir.

   

   Seret pegangan untuk mengubah ukuran formulir sehingga formulir lebih lebar dan sedikit lebih tinggi. Jika Anda melihat jendela Properti , properti Ukuran berbeda. Anda juga dapat mengubah ukuran formulir dengan mengubah properti Ukuran .

6. Di sisi kiri Visual Studio IDE, pilih tab Kotak Alat . Jika Anda tidak melihatnya, pilih Tampilkan>Kotak Alat dari bilah menu atau Ctrl+Alt+X.

7. Pilih simbol segitiga kecil di samping Kontainer untuk membuka grup.

   

8. Klik dua kali TableLayoutPanel di Kotak Alat. Anda juga dapat menyeret kontrol dari kotak alat ke formulir. Kontrol TableLayoutPanel muncul dalam formulir Anda.

   

   Nota

   Setelah Anda menambahkan TableLayoutPanel, jika jendela muncul di dalam formulir Anda dengan judul Tugas TableLayoutPanel, pilih di mana saja di dalam formulir untuk menutupnya.

9. Pilih TableLayoutPanel. Anda dapat memverifikasi kontrol apa yang dipilih dengan melihat jendela Properti .

   

10. Dengan TableLayoutPanel dipilih, temukan properti Dock , yang memiliki nilai Tidak Ada. Pilih panah dropdown lalu pilih Isi, yang merupakan tombol besar di tengah menu dropdown.

    

    Docking mengacu pada cara suatu jendela ditempelkan pada jendela atau area lain.

    TableLayoutPanel sekarang mengisi seluruh formulir. Jika Anda mengubah ukuran formulir lagi, TableLayoutPanel tetap ditambatkan, dan mengubah ukurannya agar pas.

11. Dalam formulir, pilih TableLayoutPanel. Di sudut kanan atas, ada tombol segitiga hitam kecil.

    Pilih segitiga untuk menampilkan daftar tugas kontrol.

    

12. Pilih Edit Baris dan Kolom untuk menampilkan kotak dialog Gaya Kolom dan Baris .

13. Pilih Kolom1 dan atur ukurannya ke 15 persen. Pastikan opsi Persen dipilih.

14. Pilih Kolom2 dan atur ke 85 persen.

    

15. Dari Perlihatkan di bagian atas kotak dialog Gaya Kolom dan Baris , pilih Baris. Atur Row1 ke 90 persen dan Row2 ke 10 persen. Pilih OK untuk menyimpan perubahan Anda.

    TableLayoutPanel Anda sekarang memiliki baris atas besar, baris bawah kecil, kolom kiri kecil, dan kolom kanan besar.

    

Tata letak Anda selesai.

Nota

Sebelum menjalankan aplikasi, simpan aplikasi Anda dengan memilih tombol Simpan Semua toolbar. Atau, untuk menyimpan aplikasi Anda, pilih Simpan Semua File> dari bilah menu, atau tekan Ctrl++. Ini adalah praktik terbaik untuk menghemat lebih awal dan sering.

Jalankan aplikasi Anda

Saat membuat proyek Aplikasi Formulir Windows, Anda membuat program yang berjalan. Pada tahap ini, aplikasi Penampil Gambar Anda tidak melakukan banyak hal. Untuk saat ini, ini menampilkan jendela kosong yang memperlihatkan Penampil Gambar di bilah judul.

Untuk menjalankan aplikasi, ikuti langkah-langkah berikut.

1. Gunakan salah satu dari metode berikut ini:

   • Pilih kunci F5 .
   • Pada bilah menu, pilih Debug>Mulai Debugging.
   • Pada toolbar, pilih tombol Mulai .

   Visual Studio menjalankan aplikasi Anda. Jendela dengan judul Penampil Gambar muncul.

   

   Lihat toolbar IDE Visual Studio. Tombol lainnya muncul pada toolbar saat Anda menjalankan aplikasi. Tombol-tombol ini memungkinkan Anda melakukan hal-hal seperti menghentikan dan memulai aplikasi, dan membantu Anda melacak kesalahan apa pun.

   

2. Gunakan salah satu metode berikut untuk menghentikan aplikasi Anda:

   • Pada toolbar, pilih tombol Hentikan Debug.
   • Pada bilah menu, pilih Debug>Hentikan Debug.
   • Dari keyboard, masukkan Shift+F5.
   • Pilih X di sudut atas jendela Penampil Gambar .

   Saat Anda menjalankan aplikasi dari dalam Visual Studio IDE, itu disebut debugging. Anda menjalankan aplikasi untuk menemukan dan memperbaiki bug. Anda mengikuti prosedur yang sama untuk menjalankan dan men-debug program lain. Untuk mempelajari selengkapnya tentang penelusuran kesalahan, lihat Tinjauan awal tentang debugger.

Langkah selanjutnya

Lanjutkan ke tutorial berikutnya untuk mempelajari cara menambahkan kontrol ke program Penampil Gambar Anda.

Tutorial bagian 2: Menambahkan kontrol ke Penampil Gambar Anda