Case avec DataGrid WPF

Lorsque vous travaillez avec MVVM, vous devez être conscient de ce qui est considéré comme des données et de ce qui est strictement de l'INTERFACE utilisateur.

Est votre SelectedItems va être une partie de vos données, ou seulement votre INTERFACE utilisateur?

Si c'est une partie de vos données, vous devriez vraiment avoir une IsSelected de propriété sur votre modèle de données, même si cela signifie que l'extension de la classe de données pour inclure une IsSelected de la propriété, ou la création d'une classe wrapper qui ne contient que bool IsSelected et object MyDataItem. La première option est probablement préférable, car vous pourriez garder AutoGenerateColumns="True", et il rend les liaisons de colonne plus simple.

Alors vous lier votre DataGridRow.SelectedItem à la IsSelected propriété de l'élément de données:

<Style TargetType="{x:Type DataGridRow}">
    <Setter Property="IsSelected" Value="{Binding IsSelected}" />
</Style>

Mais si votre SelectedItems est uniquement pour l'INTERFACE utilisateur, ou si vous êtes en rupture le modèle MVVM pour une raison quelconque, dans ce cas, que vous pouvez créer indépendant CheckBox et l'utilisation du code derrière pour assurer la CheckBox est correctement synchronisée à la SelectedItem.

J'ai fait un rapide exemple d'application, et voici ce que mon code ressemblait:

Tout d'abord, j'ai juste ajouté le unbound CheckBox colonne de la liste des colonnes à l'aide d'un DataGridTemplateColumn. Ce sera ajouté avant le AutoGenerateColumns liste de colonnes.

<DataGrid x:Name="TestDataGrid" ItemsSource="{Binding Test}" 
          SelectionMode="Extended" CanUserAddRows="False"
          PreviewMouseLeftButtonDown="TestDataGrid_PreviewMouseLeftButtonDown_1">
    <DataGrid.Columns>
        <DataGridTemplateColumn>
            <DataGridTemplateColumn.CellTemplate>
                <DataTemplate>
                    <CheckBox x:Name="TestCheckBox"
                              PreviewMouseLeftButtonDown="CheckBox_PreviewMouseLeftButtonDown" />
                </DataTemplate>
            </DataGridTemplateColumn.CellTemplate>
        </DataGridTemplateColumn>
    </DataGrid.Columns>
</DataGrid>

Deuxième, j'ai ajouté un PreviewMouseDown événement à la CheckBox à faire de l'ensemble de la IsSelected propriété de la ligne.

private void CheckBox_PreviewMouseLeftButtonDown(object sender, MouseButtonEventArgs e)
{
    var chk = (CheckBox)sender;
    var row = VisualTreeHelpers.FindAncestor<DataGridRow>(chk);
    var newValue = !chk.IsChecked.GetValueOrDefault();

    row.IsSelected = newValue;
    chk.IsChecked = newValue;

    //Mark event as handled so that the default 
    //DataGridPreviewMouseDown doesn't handle the event
    e.Handled = true;
}

Il a besoin pour naviguer dans le VisualTree pour trouver le DataGridRow associés à l'cliqué CheckBox pour le sélectionner, et à rendre la vie plus facile, je suis en utilisant certains personnalisée VisualTreeHelpers que j'ai sur mon blog pour trouver le DataGridRow. Vous pouvez utiliser le même code, ou vous pouvez créer votre propre méthode pour la recherche de la VisualTree.

Et le dernier de tous, si l'utilisateur clique sur un endroit autre que le CheckBox, nous voulons désactiver par défaut DataGrid événement de sélection. Cela garantit que le IsSelected valeur ne changera que lorsque vous cliquez sur le CheckBox.

Il y a plusieurs façons de faire qui permet de désactiver la sélection à différents niveaux, mais pour rendre la vie simple, j'ai juste désactivé le DataGrid.PreviewMouseLeftButtonDown cas si l'utilisateur n'a pas cliqué sur le CheckBox.

private void TestDataGrid_PreviewMouseLeftButtonDown_1(object sender, MouseButtonEventArgs e)
{
    var chk = VisualTreeHelpers.FindAncestor<CheckBox>((DependencyObject)e.OriginalSource, "TestCheckBox");

    if (chk == null)
        e.Handled = true;
}

Je l'aide de mon custom VisualTreeHelpers de nouveau pour naviguer dans l'arborescence visuelle et de découvrir si la Case sur laquelle vous avez cliqué, et à l'annulation de l'événement, si l'utilisateur a cliqué sur un autre endroit que le CheckBox.

Comme pour votre 2ème demande d'ajout d'un CheckBox à SelectAll ou UnselectAll éléments, ce serait une fois de plus être dépendant si votre sélection est la partie de l'INTERFACE utilisateur ou les données.

Si c'est une partie de l'INTERFACE utilisateur, il suffit d'ajouter un CheckBox à la DataGridTemplateColumn.HeaderTemplate, et quand il est cliqué, une boucle par la DataGrid.Rows, trouver le CheckBox dans la première colonne, puis cochez ou décochez la case.

Si c'est une partie des données, vous pouvez toujours faire la même chose (seulement la valeur liée à la DataGrid.Items au lieu de la CheckBox.IsChecked de la DataGrid.Rows), ou vous pouvez faire comme Adolfo Perez a suggéré, et le lier à une propriété sur la ViewModel.

OriginalL'auteur Rachel

Votre point de vue peut être quelque chose comme

    <DataGrid Name="SomeDataGrid" Grid.Row="0" ItemsSource="{Binding Path=SomeCollection}">
            <DataGrid.Columns>
            <DataGridTemplateColumn>
            <DataGridTemplateColumn.HeaderTemplate>
    <DataTemplate>
        <CheckBox IsChecked="{Binding
            RelativeSource={RelativeSource AncestorType={x:Type DataGrid}},
            Path=DataContext.AllItemsAreChecked}" />
    </DataTemplate>
</DataGridTemplateColumn.HeaderTemplate>
                    <DataGridTemplateColumn.CellTemplate>
                        <DataTemplate DataType="{x:Type local:SomeType}">
                            <CheckBox Focusable="False" IsChecked="{Binding Path=IsSelected, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"  
                                      HorizontalAlignment="Left" VerticalAlignment="Center"/>
                        </DataTemplate>
                    </DataGridTemplateColumn.CellTemplate>
                </DataGridTemplateColumn>

                <DataGridTemplateColumn Header="RandomNumber" Width="160">
                    <DataGridTemplateColumn.CellTemplate>
                        <DataTemplate DataType="{x:Type local:SomeType}">
                            <TextBlock Text="{Binding Path=RandomNumber}" TextWrapping="Wrap"  HorizontalAlignment="Left" VerticalAlignment="Center"/>
                        </DataTemplate>
                    </DataGridTemplateColumn.CellTemplate>
                </DataGridTemplateColumn>
                <DataGridTemplateColumn Header="Date" Width="160">
                    <DataGridTemplateColumn.CellTemplate>
                        <DataTemplate DataType="{x:Type local:SomeType}">
                            <TextBlock Text="{Binding Path=Date}" TextWrapping="Wrap"  HorizontalAlignment="Left" VerticalAlignment="Center"/>
                        </DataTemplate>
                    </DataGridTemplateColumn.CellTemplate>
                </DataGridTemplateColumn>
                <DataGridTemplateColumn Header="Time" Width="50">
                    <DataGridTemplateColumn.CellTemplate>
                        <DataTemplate DataType="{x:Type local:SomeType}">


                                    <TextBlock Text="{Binding Time}" HorizontalAlignment="Left" VerticalAlignment="Center"/>


                        </DataTemplate>
                    </DataGridTemplateColumn.CellTemplate>
                </DataGridTemplateColumn>                    

            </DataGrid.Columns>
        </DataGrid>

Et dans le viewmodel
SomeCollection propriété de liaison est une observablecollection
sometype contient des propriétés comme IsSelected , RandomNumber ,la Date , l'Heure

pour exemple:

    class ViewModel
    {
      public ObservableCollection<SomeType> SomeCollection{get;set;}
    }

    class SomeType
    {
       public string Date {get;set;}
       public string Time {get;set;}
       public string RandomNumber {get;set;}
       public bool IsSelected {get;set;}
    }

OriginalL'auteur srsyogesh