Halo semuanya!
Saya berharap bahwa melalui artikel saya, saya akan mengklarifikasi masalah menghubungkan representasi XML dari DataGrid dengan koleksi kodenya. Untuk ini, yang terbaik adalah menggunakan contoh tertentu.
Jadi, kita perlu menempatkan daftar elemen dari beberapa struktur dalam tabel. Katakanlah elemen-elemen itu sendiri terlihat dalam kode sebagai berikut:
class Element { public Element (string firstName, string lastName, string phoneNumber, DateTime date) { this.firstName = firstName; this.lastName = lastName; this.phoneNumber = phoneNumber; this.date = date; } public string FirstName { get { return this.firstName; } set { this.firstName = value; } } public string LastName { get { return this.lastName; } set { this.lastName = value; } } public string PhoneNumber { get { return this.phoneNumber; } set { this.phoneNumber = value; } } public DateTime Date { get { return this.date; } set { this.date = value; } } private string firstName; private string lastName; private string phoneNumber; private DateTime date; }
Dengan demikian, daftar mereka akan terlihat seperti:
List<Element> elements = new List<Element>();
Sekarang mari kita beralih ke DataGrid. Karena ini adalah WPF yang sama, Anda dapat menariknya ke formulir dengan tangan. Biarkan IDE menulis kode untuk itu.
<DataGrid x:Name="dataGrid" Margin="10,103,0,15" CellEditEnding="dataGrid_CellEditEnding" Grid.RowSpan="2" Grid.ColumnSpan="2" HorizontalAlignment="Left" Width="728" AutoGenerateColumns="False"/>
Di sini, saya hanya menetapkan AutoGenerateColumns = "Salah" secara manual, karena di masa mendatang kita akan mengedit kolom tabel sendiri.
Selanjutnya, kita perlu mengikat data ke tabel, dengan masing-masing bidang elemen yang sesuai dengan kolom tabel.
<DataGrid.Columns> <DataGridTextColumn Header="" Binding="{Binding Path=FirstName}"/> <DataGridTextColumn Header="" Binding="{Binding Path=LastName}"/> <DataGridTemplateColumn Header="" SortMemberPath="PhoneNumber"> <DataGridTemplateColumn.CellTemplate> <DataTemplate> <TextBox Text="{Binding Path=PhoneNumber}"/> </DataTemplate> </DataGridTemplateColumn.CellTemplate> <DataGridTemplateColumn.CellEditingTemplate> <DataTemplate> <TextBox Text="{Binding Path=PhoneNumber}" /> </DataTemplate> </DataGridTemplateColumn.CellEditingTemplate> </DataGridTemplateColumn> <DataGridTemplateColumn Header="" SortMemberPath="Date"> <DataGridTemplateColumn.CellTemplate> <DataTemplate > <TextBlock Text="{Binding Path=Date, StringFormat='dd/MM/yyyy'}"/> </DataTemplate> </DataGridTemplateColumn.CellTemplate> <DataGridTemplateColumn.CellEditingTemplate> <DataTemplate> <DatePicker SelectedDate="{Binding Date}"/> </DataTemplate> </DataGridTemplateColumn.CellEditingTemplate> </DataGridTemplateColumn> </DataGrid.Columns>
Dua jenis kolom DataGridTextColumn dan DataGridTemplateColumn digunakan di sini. Anda dapat membaca tentang tipenya di mana saja. Hal utama yang harus dipahami di sini adalah bahwa dengan bantuan DataGridTemplateColumn Anda dapat mengatur template apa pun. Yaitu, di sel-sel kolom ini akan dimungkinkan untuk menempatkan kontrol apa pun (tombol, kalender, dll.). Misalnya, di kolom ketiga adalah TextBox:
<DataGridTemplateColumn Header="" SortMemberPath="PhoneNumber"> <DataGridTemplateColumn.CellTemplate> <DataTemplate> <TextBox Text="{Binding Path=PhoneNumber}"/> </DataTemplate> </DataGridTemplateColumn.CellTemplate>
PENTING: Jangan lupa mendaftar Header, karena pelengkapan otomatis dinonaktifkan untuk kami. Dan juga untuk DataGridTemplateColumn perlu mendaftar SortMemberPath, sehingga ia tahu bidang apa yang harus diurutkan data.Mari kita beralih ke Binding. Ini adalah data yang mengikat itu sendiri. Kami menentukannya menggunakan Binding Path = PhoneNumber. Hal utama yang perlu dipertimbangkan di sini adalah bahwa ini adalah nama metode kelas yang mengembalikan nilai bidang (bukan phoneNumber, tetapi PhoneNumber, lihat deskripsi kelas).
Dan satu hal lagi. Dimungkinkan untuk memasukkan berbagai tipe templat (DataTemplate) untuk sel dalam keadaan normal (CellTemplate) dan dalam kondisi pengeditan (CellEditingTemplate). Di kolom keempat sel dalam keadaan normal itu adalah TextBox, dan dalam status pengeditan DatePicker:
<DataGridTemplateColumn Header="" SortMemberPath="Date"> <DataGridTemplateColumn.CellTemplate> <DataTemplate > <TextBlock Text="{Binding Path=Date, StringFormat='dd/MM/yyyy'}"/> </DataTemplate> </DataGridTemplateColumn.CellTemplate> <DataGridTemplateColumn.CellEditingTemplate> <DataTemplate> <DatePicker SelectedDate="{Binding Date}"/> </DataTemplate> </DataGridTemplateColumn.CellEditingTemplate> </DataGridTemplateColumn>
Perlu juga dicatat bahwa ketika bekerja dengan tanggal, bidang Teks memiliki properti StringFormat yang dapat diformat. Adalah penting bahwa untuk tampilan yang benar pada bulan "MM" harus besar.
Sekarang, untuk mengikat data spesifik ke tabel, mari kita kembali ke kode di C #.
Setelah mengisi array dengan elemen, itu harus ditentukan sebagai sumber data:
dataGrid.ItemsSource = elements;
Dengan demikian, setiap perubahan pada elemen akan ditampilkan dalam tabel dan, sebaliknya, setiap perubahan yang dilakukan pada tabel akan menyebabkan perubahan pada elemen. Tetapi ketika membuat perubahan pada elemen, Anda harus memanggil metode
dataGrid.Items.Refresh();
.
Dan sebagai contoh bagus lain dari bundel C # - XML, saya akan memberikan contoh memeriksa pengisian sel nomor telepon dengan hanya angka. Untuk melakukan ini, edit sedikit kode di kolom ketiga:
<DataGridTemplateColumn.CellTemplate> <DataTemplate> <TextBox Text="{Binding Path=PhoneNumber}" TextChanged="phN_TextChanged"/> </DataTemplate> </DataGridTemplateColumn.CellTemplate>
Dapat dilihat bahwa di tag TextBox saya menetapkan handler untuk acara perubahan teks. Sekarang tinggal mendaftarkan register ini dalam kode:
private void phN_TextChanged(object sender, TextChangedEventArgs e) { int result = 0; TextBox txtx = sender as TextBox; if (txtx !=null) { if (!int.TryParse(txtx.Text, out result)) { txtx.Text = txtx.Text.Substring(0, txtx.Text.Length - 1); txtx.CaretIndex = txtx.Text.Length; } } }
Memeriksa nomor juga dapat dilakukan melalui ekspresi reguler.
Rilis yang bagus untuk semua!