Bagikan melalui


Membuat kontrol pengguna .NET Framework Formulir Windows yang mendukung pengikatan data sederhana

Catatan

Himpunan data dan kelas terkait adalah teknologi .NET Framework warisan dari awal 2000-an yang memungkinkan aplikasi untuk bekerja dengan data dalam memori saat aplikasi terputus dari database. Teknologi ini sangat berguna untuk aplikasi yang memungkinkan pengguna memodifikasi data dan mempertahankan perubahan kembali ke database. Meskipun himpunan data telah terbukti menjadi teknologi yang sangat sukses, sebaiknya aplikasi .NET baru menggunakan Entity Framework Core. Entity Framework menyediakan cara yang lebih alami untuk bekerja dengan data tabular sebagai model objek, dan memiliki antarmuka pemrograman yang lebih sederhana.

Saat menampilkan data pada formulir di aplikasi Windows, Anda dapat memilih kontrol yang ada dari Kotak Alat, atau Anda dapat menulis kontrol kustom jika aplikasi Anda memerlukan fungsionalitas yang tidak tersedia dalam kontrol standar. Panduan ini menunjukkan cara membuat kontrol yang mengimplementasikan DefaultBindingPropertyAttribute. Kontrol yang mengimplementasikan DefaultBindingPropertyAttribute dapat berisi satu properti yang dapat terikat ke data. Kontrol tersebut mirip dengan TextBox atau CheckBox.

Untuk informasi selengkapnya tentang penulisan kontrol, lihat Mengembangkan Kontrol Formulir Windows pada Waktu Desain.

Saat menulis kontrol untuk digunakan dalam skenario pengikatan data, Anda harus menerapkan salah satu atribut pengikatan data berikut:

Penggunaan atribut pengikatan data
Terapkan DefaultBindingPropertyAttribute pada kontrol sederhana, seperti TextBox, yang menampilkan satu kolom (atau properti) data. (Proses ini dijelaskan di halaman panduan ini.)
Terapkan ComplexBindingPropertiesAttribute pada kontrol, seperti DataGridView, yang menampilkan daftar (atau tabel) data. Untuk informasi selengkapnya, lihat Membuat kontrol pengguna Formulir Windows yang mendukung pengikatan data yang kompleks.
Terapkan LookupBindingPropertiesAttribute pada kontrol, seperti ComboBox, yang menampilkan daftar (atau tabel) data tetapi juga perlu menyajikan satu kolom atau properti. Untuk informasi selengkapnya, lihat Membuat kontrol pengguna Formulir Windows yang mendukung pengikatan data pencarian.

Panduan ini membuat kontrol sederhana yang menampilkan data dari satu kolom dalam tabel. Contoh ini menggunakan Phone kolom Customers tabel dari database sampel Northwind. Kontrol pengguna sederhana menampilkan nomor telepon pelanggan dalam format nomor telepon standar, dengan menggunakan MaskedTextBox dan mengatur masker ke nomor telepon.

Selama panduan ini, Anda akan mempelajari cara:

  • Buat Aplikasi Formulir Windows baru (.NET Framework).

  • Tambahkan Kontrol Pengguna baru ke proyek Anda.

  • Merancang kontrol pengguna secara visual.

  • Terapkan atribut DefaultBindingProperty.

  • Buat himpunan data dengan wizard Konfigurasi Sumber Data.

  • Atur kolom Telepon di jendela Sumber Data untuk menggunakan kontrol baru.

  • Buat formulir untuk menampilkan data dalam kontrol baru.

Prasyarat

Untuk menyelesaikan tutorial ini, Anda memerlukan beban kerja pengembangan desktop .NET dan Penyimpanan data dan pemrosesan yang diinstal di Visual Studio. Untuk menginstalnya, buka penginstal Visual Studio, lalu pilih Ubah(atau Lebih> Ubah) di samping versi Visual Studio yang ingin Anda ubah. Lihat Ubah Visual Studio.

Panduan ini menggunakan SQL Server Express LocalDB dan database sampel Northwind.

  1. Jika Anda tidak memiliki SQL Server Express LocalDB, pasang dari halaman unduhan SQL Server Express, atau melalui Alat Penginstal Visual Studio. Di Alat Penginstal Visual Studio, Anda dapat memasang SQL Server Express LocalDB sebagai bagian dari beban kerja Penyimpanan dan pemrosesan data, atau sebagai komponen individual.

  2. Instal database sampel Northwind dengan mengikuti langkah-langkah berikut:

    1. Di Visual Studio, buka jendela SQL Server Object Explorer. (SQL Server Object Explorer diinstal sebagai bagian dari beban kerja Penyimpanan dan pemrosesan data di Alat Penginstal Visual Studio.) Perluas node SQL Server. Klik kanan pada instans LocalDB Anda dan pilih Kueri Baru.

      Jendela editor kueri terbuka.

    2. Salin skrip Northwind Transact-SQL ke clipboard Anda. Skrip T-SQL ini membuat database Northwind dari awal dan mengisinya dengan data.

    3. Tempelkan skrip T-SQL ke editor kueri, lalu pilih tombol Jalankan.

      Setelah beberapa saat, kueri selesai berjalan dan database Northwind dibuat.

Membuat Aplikasi Formulir Windows

Langkah pertama adalah membuat Aplikasi Formulir Windows (.NET Framework):

  1. Di Visual Studio, di menu File, pilih Proyek>Baru.

  2. Perluas Visual C# atau Visual Basic di panel sebelah kiri, lalu pilih Windows Desktop.

  3. Di panel tengah, pilih jenis proyek Aplikasi Formulir Windows.

  4. Beri nama proyek SimpleControlWalkthrough, lalu pilih OK.

    Proyek SimpleControlWalkthrough dibuat, dan ditambahkan ke Penjelajah Solusi.

Menambahkan kontrol pengguna ke proyek

Panduan ini membuat kontrol yang dapat mengikat data sederhana dari Kontrol Pengguna. Tambahkan item Kontrol Pengguna ke proyek SimpleControlWalkthrough:

  1. Dari menu Proyek, pilih Tambahkan Kontrol Pengguna.

  2. Ketik PhoneNumberBox di area Nama, dan klik Tambahkan.

    Kontrol PhoneNumberBox ditambahkan ke Penjelajah Solusi, dan terbuka di perancang.

Mendesain kontrol PhoneNumberBox

Panduan ini meluas pada yang ada MaskedTextBox untuk membuat kontrol PhoneNumberBox :

  1. MaskedTextBox Seret dari Kotak Alat ke permukaan desain kontrol pengguna.

  2. Pilih tag pintar pada yang MaskedTextBox baru saja Anda seret, dan pilih Atur Masker.

  3. Pilih Nomor telepon dalam kotak dialog Masker Input, dan klik OK untuk mengatur masker.

Menambahkan atribut pengikatan data yang diperlukan

Untuk kontrol sederhana yang mendukung pengikatan data, terapkan DefaultBindingPropertyAttribute:

  1. Alihkan kontrol PhoneNumberBox ke tampilan kode. (Pada Menu tampilan , pilih Kode.)

  2. Ganti kode di PhoneNumberBox dengan yang berikut ini:

    using System.Windows.Forms;
    
    namespace CS
    {
        [System.ComponentModel.DefaultBindingProperty("PhoneNumber")]
        public partial class PhoneNumberBox : UserControl
        {
            public string PhoneNumber
            {
                get{ return maskedTextBox1.Text; }
                set{ maskedTextBox1.Text = value; }
            }
    
            public PhoneNumberBox()
            {
                InitializeComponent();
            }
        }
    }
    
  3. Dari menu Build, pilih Build Solution.

Membuat tabel sumber data di database Anda

Langkah ini menggunakan wizard Konfigurasi Sumber Data untuk membuat sumber data berdasarkan Customers tabel dalam database sampel Northwind. Anda harus memiliki akses ke database sampel Northwind untuk membuat koneksi. Untuk informasi tentang menyiapkan database sampel Northwind, lihat Cara: Menginstal database sampel.

  1. Untuk membuka jendela Sumber Data, pada menu Data, klik Perlihatkan Sumber Data.

  2. Di jendela Sumber Data, pilih Tambahkan Sumber Data Baru untuk memulai wizard Konfigurasi Sumber Data.

  3. Pada halaman Pilih Tipe Sumber Data, pilih Database, lalu pilih Berikutnya.

  4. Di halaman Pilih Koneksi Data Anda, lakukan salah satu hal berikut:

    • Jika koneksi data ke database sampel Northwind tersedia di daftar dropdown, pilihlah.

    • Pilih Koneksi Baru untuk meluncurkan kotak dialog Tambahkan/Ubah Koneksi.

  5. Jika database Anda memerlukan kata sandi, pilih opsi untuk menyertakan data sensitif, lalu pilih Berikutnya.

  6. Pada halaman Simpan string koneksi ke file Konfigurasi Aplikasi, klik Berikutnya.

  7. Pada halaman Pilih Objek Database Anda, perluas node Tabel.

  8. Pilih tabel Customers, lalu pilih Selesai.

    NorthwindDataSet ditambahkan ke proyek Anda, dan tabel Customers muncul di jendela Sumber Data.

Atur kolom telepon untuk menggunakan kontrol PhoneNumberBox

Dalam jendela Sumber Data, Anda bisa mengatur kontrol yang akan dibuat sebelum menyeret item ke formulir Anda:

  1. Buka Formulir1 di perancang.

  2. Perluas node Pelanggan di jendela Sumber Data.

  3. Klik panah daftar dropdown pada simpul Pelanggan , dan pilih Detail dari daftar kontrol.

  4. Klik panah daftar dropdown pada kolom Telepon , dan pilih Kustomisasi.

  5. Pilih PhoneNumberBox dari daftar Kontrol Terkait dalam kotak dialog Opsi Kustomisasi UI Data.

  6. Klik panah daftar dropdown pada kolom Telepon , dan pilih PhoneNumberBox.

Menambahkan kontrol ke formulir

Anda dapat membuat kontrol terikat data dengan menyeret item dari jendela Sumber Data ke formulir.

Untuk membuat kontrol terikat data pada formulir, seret simpul Pelanggan utama dari jendela Sumber Data ke formulir, dan verifikasi bahwa kontrol PhoneNumberBox digunakan untuk menampilkan data di kolom Telepon.

Kontrol terikat data dengan label deskriptif muncul pada formulir, bersama dengan strip alat (BindingNavigator) untuk menavigasi rekaman. NorthwindDataSet, CustomersTableAdapter, BindingSource, dan BindingNavigator akan muncul dalam baki komponen.

Jalankan aplikasi

Tekan F5 untuk menjalankan aplikasi.

Langkah berikutnya

Bergantung pada persyaratan aplikasi Anda, ada beberapa langkah yang mungkin ingin Anda lakukan setelah membuat kontrol yang mendukung pengikatan data. Beberapa langkah umum berikutnya meliputi: