web-dev-qa-db-ja.com

MVVM WPFプロジェクトのDataGridから複数のアイテムを選択する

MVVM WPFプロジェクトのDataGridから複数のアイテムを選択するにはどうすればよいですか？

c#wpfxamlmvvmdatagrid
56
MegaMind

これを行うには、単にカスタム依存関係プロパティを追加します。

public class CustomDataGrid : DataGrid
{
    public CustomDataGrid ()
    {
        this.SelectionChanged += CustomDataGrid_SelectionChanged;
    }

    void CustomDataGrid_SelectionChanged (object sender, SelectionChangedEventArgs e)
    {
        this.SelectedItemsList = this.SelectedItems;
    }
    #region SelectedItemsList

    public IList SelectedItemsList
    {
        get { return (IList)GetValue (SelectedItemsListProperty); }
        set { SetValue (SelectedItemsListProperty, value); }
    }

    public static readonly DependencyProperty SelectedItemsListProperty =
            DependencyProperty.Register ("SelectedItemsList", typeof (IList), typeof (CustomDataGrid), new PropertyMetadata (null));

    #endregion
}

これで、XAMLでこのdataGridを使用できます。

<Window x:Class="DataGridTesting.MainWindow"
    xmlns="http://schemas.Microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.Microsoft.com/winfx/2006/xaml"
    xmlns:i="http://schemas.Microsoft.com/expression/2010/interactivity"
    xmlns:local="clr-namespace:DataGridTesting.CustomDatagrid"
    Title="MainWindow"
    Height="350"
    Width="525">
  <DockPanel>
    <local:CustomDataGrid ItemsSource="{Binding Model}"
        SelectionMode="Extended"
        AlternatingRowBackground="Aquamarine"
        SelectionUnit="FullRow"
        IsReadOnly="True"
        SnapsToDevicePixels="True"
        SelectedItemsList="{Binding TestSelected, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"/>
  </DockPanel>
</Window>

私のViewModel：

public class MyViewModel : INotifyPropertyChanged
{
    private static object _lock = new object ();
    private List<MyModel> _myModel;

    public IEnumerable<MyModel> Model { get { return _myModel; } }

    private IList _selectedModels = new ArrayList ();

    public IList TestSelected
    {
        get { return _selectedModels; }
        set
        {
            _selectedModels = value;
            RaisePropertyChanged ("TestSelected");
        }
    }

    public MyViewModel ()
    {
        _myModel = new List<MyModel> ();
        BindingOperations.EnableCollectionSynchronization (_myModel, _lock);

        for (int i = 0; i < 10; i++)
        {
            _myModel.Add (new MyModel
            {
                Name = "Test " + i,
                Age = i * 22
            });
        }
        RaisePropertyChanged ("Model");
    }

    public event PropertyChangedEventHandler PropertyChanged;

    public void RaisePropertyChanged (string propertyName)
    {
        var pc = PropertyChanged;
        if (pc != null)
            pc (this, new PropertyChangedEventArgs (propertyName));
    }
}

私のモデル：

public class MyModel
{
    public string Name { get; set; }
    public int Age { get; set; }
}

最後に、MainWindowの背後にあるコードを次に示します。

public partial class MainWindow : Window
{
    public MainWindow ()
    {
        InitializeComponent ();
        this.DataContext = new MyViewModel ();
    }
}

このクリーンなMVVMデザインが役立つことを願っています。

99
Sandesh

私がすることは、System.Windows.Interactivityを使用してBehaviorsを作成することです。プロジェクトで手動で参照する必要があります。

SelectedItemsを公開しないコントロールがある場合（例：（ListBox、DataGrid）

次のような動作クラスを作成できます

public class ListBoxSelectedItemsBehavior : Behavior<ListBox>
{
    protected override void OnAttached()
    {
        AssociatedObject.SelectionChanged += AssociatedObjectSelectionChanged;
    }

    protected override void OnDetaching()
    {
        AssociatedObject.SelectionChanged -= AssociatedObjectSelectionChanged;
    }

    void AssociatedObjectSelectionChanged(object sender, SelectionChangedEventArgs e)
    {
        var array = new object[AssociatedObject.SelectedItems.Count];
        AssociatedObject.SelectedItems.CopyTo(array, 0);
        SelectedItems = array;
    }

    public static readonly DependencyProperty SelectedItemsProperty =
        DependencyProperty.Register("SelectedItems", typeof(IEnumerable), typeof(ListBoxSelectedItemsBehavior), 
        new FrameworkPropertyMetadata(null, FrameworkPropertyMetadataOptions.BindsTwoWayByDefault));

    public IEnumerable SelectedItems
    {
        get { return (IEnumerable)GetValue(SelectedItemsProperty); }
        set { SetValue(SelectedItemsProperty, value); }
    }
}

そして、あなたのXAMLで私はBindingを行いますiはxmlns:i="http://schemas.Microsoft.com/expression/2010/interactivity"で、behaviorsはBehaviorクラスの名前空間です

<ListBox>
 <i:Interaction.Behaviors>
    <behaviors:ListBoxSelectedItemsBehavior SelectedItems="{Binding SelectedItems, Mode=OneWayToSource}" />
 </i:Interaction.Behaviors>

DataContextのListBoxがSelectedItemsにViewModelプロパティを持っていると仮定すると、SelectedItemsが自動的に更新されます。 eventからサブスクライブするViewをカプセル化しました。つまり、

<ListBox SelectionChanged="ListBox_SelectionChanged"/>

必要に応じて、BehaviorクラスをDataGridタイプに変更できます。

27
123 456 789 0

私は自分のアプリでこのソリューションを使用します：

XAML：

<i:Interaction.Triggers>
     <i:EventTrigger EventName="SelectionChanged">
         <i:InvokeCommandAction Command="{Binding SelectItemsCommand}" CommandParameter="{Binding Path=SelectedItems,ElementName=TestListView}"/>
     </i:EventTrigger>
</i:Interaction.Triggers>

xamlファイルの先頭に、次のコード行を追加します。

xmlns:i="http://schemas.Microsoft.com/expression/2010/interactivity"

SelectedItemsCommandは、ビューモデルに記述されているICommand型です。

使用されたDLL：

System.Windows.Interactivity.dll

18
Allen4Tech

WPFのデフォルトのDataGridでは、SelectedItem- Propertyで可能なため、Bindingを使用できません。これは、SelectedItems- PropertyがDependencyPropertyではないためです。

希望する方法の1つは、DataGridのSelectionChanged- Eventを登録して、選択したアイテムを格納するViewModelのプロパティを更新することです。

DataGridのプロパティ SelectedItems はIList型であるため、リスト内のアイテムを特定の型にキャストする必要があります。

C＃

public MyViewModel {
  get{
    return this.DataContext as MyViewModel;
  }
}

private void DataGrid_SelectionChanged(object sender, SelectionChangedEventArgs e) {
  // ... Get SelectedItems from DataGrid.
  var grid = sender as DataGrid;
  var selected = grid.SelectedItems;

  List<MyObject> selectedObjects = selected.OfType<MyObject>().ToList();

  MyViewModel.SelectedMyObjects = selectedObjects;
}

XAML

<Window x:Class="WpfApplication1.MainWindow"
    xmlns="http://schemas.Microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.Microsoft.com/winfx/2006/xaml"
    Title="MainWindow" Height="350" Width="525">
    <Grid>
    <DataGrid
        SelectionChanged="DataGrid_SelectionChanged"
        />
    </Grid>
</Window>
9
Jehof

再利用可能な汎用基本クラスをマカできます。この方法で行を選択できますコードとUIの両方から。

これは私の選択可能なクラスです

public class MyClass
{
    public string MyString {get; set;}   
}

選択可能なクラスの一般的な基本クラスを作成します。 INotifyPropertyChangedは、IsSelectedを設定するとUIを更新します。

public class SelectableItem<T> : System.ComponentModel.INotifyPropertyChanged
{
    public SelectableItem(T item)
    {
        Item = item;
    }

    public T Item { get; set; }

    bool _isSelected;

    public bool IsSelected {
        get {
            return _isSelected;
        }
        set {
            if (value == _isSelected)
            {
                return;
            }

            _isSelected = value;

            if (PropertyChanged != null)
            { 
                PropertyChanged(this, new System.ComponentModel.PropertyChangedEventArgs("IsSelected"));
            }
        }
    }

    public event System.ComponentModel.PropertyChangedEventHandler PropertyChanged;
}

選択可能なクラスを作成する

public class MySelectableItem: SelectableItem<MyClass>
{
    public MySelectableItem(MyClass item)
       :base(item)
    {
    }
}

バインドするプロパティを作成する

ObservableCollection<MySelectableItem> MyObservableCollection ...

プロパティを設定する

MyObservableCollection = myItems.Select(x => new MySelectableItem(x));

データグリッドにバインドし、MySelectedItemのIsSelectedプロパティにバインドするDataGridRowにスタイルを追加します

<DataGrid  
    ItemsSource="{Binding MyObservableCollection}"
    SelectionMode="Extended">
    <DataGrid.Resources>
        <Style TargetType="DataGridRow">
            <Setter Property="IsSelected" Value="{Binding IsSelected}" />
        </Style>
    </DataGrid.Resources>
</DataGrid>

選択した行/アイテムを取得するには

var selectedItems = MyObservableCollection.Where(x=>x.IsSelected).Select(y=>y.Item);

行/アイテムを選択するには

MyObservableCollection[0].IsSelected = true;

編集———> EnableRowVirtualizationがtrueの場合、機能しないようです

2
AxdorphCoder

モデルに「IsSelected」プロパティを追加し、行にcheckBoxを追加できます。

2
Learner

WPF DataGridはこれを可能にします。 DataGrid.Rows.SelectionModeおよびDataGrid.Rows.SelectionUnitをそれぞれ「Extended」および「CellOrRowHeader」に設定するだけです。これは、私が含めた画像に示すように、Blendで実行できます。これにより、ユーザーは各セル、行全体などを好きなだけ選択でき、ShiftキーまたはCtrlキーを使用して選択を続行できます。 enter image description here

0
dylansweb

私が取り組んでいるプロジェクトは MVVM Light を使用しており、 このブログ投稿 が最も簡単なソリューションであることがわかりました。ここで解決策を繰り返します。

モデルを表示：

using GalaSoft.MvvmLight;
using GalaSoft.MvvmLight.Command;
...

public class SomeVm : ViewModelBase {

    public SomeVm() {
        SelectItemsCommand = new RelayCommand<IList>((items) => {
            Selected.Clear();
            foreach (var item in items) Selected.Add((SomeClass)item);
        });

        ViewCommand = new RelayCommand(() => {
            foreach (var selected in Selected) {
                // todo do something with selected items
            }
        });
    }

    public List<SomeClass> Selected { get; set; }
    public RelayCommand<IList> SelectionChangedCommand { get; set; }
    public RelayCommand ViewCommand { get; set; }
}

XAML：

<Window
    ...
    xmlns:i="http://schemas.Microsoft.com/expression/2010/interactivity"
    xmlns:command="http://www.galasoft.ch/mvvmlight"
    ...
    <DataGrid
        Name="SomeGrid"
        ...
        <i:Interaction.Triggers>
            <i:EventTrigger EventName="SelectionChanged">
                <command:EventToCommand
                    Command="{Binding SelectionChangedCommand}"
                    CommandParameter="{Binding SelectedItems, ElementName=SomeGrid}" />
            </i:EventTrigger>
        </i:Interaction.Triggers>
        ...
        <DataGrid.ContextMenu>
            <ContextMenu>
                <MenuItem Header="View" Command="{Binding ViewCommand}" />
            </ContextMenu>
        </DataGrid.ContextMenu>
        ...
0
Seth Reno