WPF DataGrid. Lutar por modelo

Olá pessoal!

Espero que, através do meu artigo, esclareça a questão de vincular a representação XML do DataGrid à sua coleção de códigos. Para isso, é melhor usar um exemplo específico. Portanto, precisamos colocar a lista de elementos de alguma estrutura na tabela. Digamos que os próprios elementos olhem no código da seguinte maneira:

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; } 

Por conseguinte, a lista deles será semelhante a:

 List<Element> elements = new List<Element>(); 

Agora vamos para o DataGrid. Como esse é o mesmo WPF, você pode puxá-lo para o formulário com as mãos. Deixe o IDE escrever o código para ele.

 <DataGrid x:Name="dataGrid" Margin="10,103,0,15" CellEditEnding="dataGrid_CellEditEnding" Grid.RowSpan="2" Grid.ColumnSpan="2" HorizontalAlignment="Left" Width="728" AutoGenerateColumns="False"/> 

Aqui, defino manualmente apenas AutoGenerateColumns = "False", pois no futuro editaremos as colunas da tabela.

Em seguida, precisamos vincular os dados à tabela, com cada campo do elemento deve corresponder à coluna da tabela.

 <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> 

Dois tipos de colunas DataGridTextColumn e DataGridTemplateColumn são usados ​​aqui. Você pode ler sobre seus tipos em qualquer lugar. O principal a entender aqui é que, com a ajuda do DataGridTemplateColumn, você pode definir qualquer modelo. Ou seja, nas células desta coluna, será possível colocar qualquer controle (botões, calendários etc.). Por exemplo, na terceira coluna, há um TextBox:

 <DataGridTemplateColumn Header="" SortMemberPath="PhoneNumber"> <DataGridTemplateColumn.CellTemplate> <DataTemplate> <TextBox Text="{Binding Path=PhoneNumber}"/> </DataTemplate> </DataGridTemplateColumn.CellTemplate> 

IMPORTANTE: Não se esqueça de registrar o cabeçalho, porque a conclusão automática está desativada para nós. E também para DataGridTemplateColumn, é necessário registrar SortMemberPath, para que ele saiba por qual campo classificar os dados.

Vamos seguir para o Binding. Essa é a própria ligação de dados. Nós o especificamos usando Binding Path = PhoneNumber. O principal a considerar aqui é que esse é o nome do método de classe que retorna o valor do campo (não phoneNumber, mas PhoneNumber, consulte a descrição da classe).
E mais uma coisa. É possível inserir diferentes tipos de modelos (DataTemplate) para células no estado normal (CellTemplate) e no estado de edição (CellEditingTemplate). Na quarta coluna da célula, no estado normal, é um TextBox e, no estado de edição, 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> 

Também é importante notar que, ao trabalhar com datas, o campo Texto possui uma propriedade StringFormat que pode ser formatada. É importante que, para a exibição correta do mês, "MM" seja grande.

Agora, para vincular dados específicos à tabela, vamos voltar ao código em C #.
Depois de preencher a matriz com elementos, ela deve ser especificada como uma fonte de dados:

 dataGrid.ItemsSource = elements; 

Portanto, quaisquer alterações nos elementos serão exibidas na tabela e, inversamente, quaisquer alterações feitas na tabela levarão a alterações nos elementos. Mas ao fazer alterações nos elementos, você deve chamar o método
 dataGrid.Items.Refresh(); 
.
E como outro bom exemplo de um pacote C # - XML, darei um exemplo de verificação do preenchimento das células de número de telefone apenas com números. Para fazer isso, edite levemente o trecho de código na terceira coluna:

 <DataGridTemplateColumn.CellTemplate> <DataTemplate> <TextBox Text="{Binding Path=PhoneNumber}" TextChanged="phN_TextChanged"/> </DataTemplate> </DataGridTemplateColumn.CellTemplate> 

Pode-se ver que, na tag TextBox, eu atribuí um manipulador para o evento de alteração de texto. Agora resta apenas registrar esse manipulador no código:

  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; } } } 

A verificação de números também pode ser feita através de expressões regulares.

Boa liberação para todos!

Source: https://habr.com/ru/post/pt484968/


All Articles