WPFでDataGridにデータ(DataTable,DataView)を表示して絞り込み表示したり数値順ソートしたりその他色々

WPFでリスト的なデータを表示するときに DataGridを使うことがあると思いますが、その使い方について調べたことのメモです。

開発環境

• Windows 10
• Visual Studio 2019
• Prism 7.2

DataGridにデータを表示する

データを ItemsSourceプロパティにバインドします。
データとして今回は DataTableを使います。そして後々フィルタリングをしたいので DataTableから DataViewをつくってバインドします。
列ヘッダの名前とかを指定したいので、AutoGenerateColumns=FalseにしてXAMLに列を定義します。

privateDataTable_data;publicDataViewData{get;privateset;}..._data=newDataTable();_data.Columns.Add("Name");_data.Columns.Add("Price");_data.Rows.Add("商品A",500);_data.Rows.Add("商品B",1200);_data.Rows.Add("商品C",800);_data.Rows.Add("商品D",2000);Data=newDataView(_data);

<DataGridItemsSource="{Binding Data}"AutoGenerateColumns="False"><DataGrid.Columns><DataGridTextColumnHeader="商品名"Binding="{Binding Name}"/><DataGridTextColumnHeader="金額"Binding="{Binding Price}"/></DataGrid.Columns></DataGrid>

絞り込み表示

DataView.RowFilterプロパティに条件式を設定します。

Data.RowFilter="Price > 1000";

列カラムクリック時のソートを数値順にしたい

列カラムをクリックしてソートしたとき、そのままでは辞書順のソートになってしまいます。数値でソートしたい場合は DataColumnCollection.Addに型を指定します。

_data.Columns.Add("Name");_data.Columns.Add("Price",typeof(int));

列カラムクリック時のソートを〇〇にしたい

列カラムをクリックしたときにどうソートするか自分でかくことができます。調べたんですけど結局使いませんでした（私のアプリの場合は上の数値順にする方法で十分だった）。ですがせっかくなのでメモ程度に書き残しておきます。

流れとしては

• ビューでカラムクリック時に発生する Sorting イベントを補足し、ビューモデルにコマンドを送る
• EventArgs にクリックされた列ヘッダの文字列が入っているので、それに一致する列でデータを並び替える (DataView.Sort)
• DataTableを作り直す (DataView.ToTable)
• ビューで、DataGridのソートしたカラムの SortDirectionを設定する（ソートマークを付ける）

という感じだと思います。

参考

• https://oita.oika.me/2014/09/15/sorts-datagrid-on-mvvm/
• https://araramistudio.jimdo.com/2016/10/13/wpf%E3%81%AEdatagrid%E3%81%A7%E3%82%BD%E3%83%BC%E3%83%88%E3%82%92%E3%82%AB%E3%82%B9%E3%82%BF%E3%83%9E%E3%82%A4%E3%82%BA/
• http://final.hateblo.jp/entry/2015/09/22/115137

数値列で空白セルを表示したい

データに DBNullを入れます。

_data.Rows.Add("商品A",500);_data.Rows.Add("商品B",1200);_data.Rows.Add("商品C",DBNull.Value);_data.Rows.Add("商品D",2000);

なお Bindingの TargetNullValueプロパティを設定することで、DBNullなセルに任意の文字列を表示することもできます。

<DataGridTextColumnHeader="金額"Binding="{Binding Price, TargetNullValue='NULLだよ'}"/>

サンプルのソースコード

プロジェクト一式を GitHub に置いときます。

• https://github.com/voidproc/WpfDataGridExample