【C# WPF】DataGridでCombokBoxを使う方法

C#とWPFを利用して、DataGridでComboBoxを使う方法をまとめてみました。

対象は、Visual Studio 2022, .NET 7.0, Windows 7以上です。
MVVMは使いません。Windows Formsではありません。

こちらの記事「【C# WPF】DataGridの使い方の基礎」で作ったDataGridにComboBoxを加えてみます。
データを表示するためにボタンもひとつ加えます。

コードを単純にして分かりやすくするため余分な機能は入れないことにしましょう。そこで、表示するのは最初の行に限定します。
行番号を指定してDataGridの値を表示するケースの参考にもなります。

次のような画面になります。

XAMLの記入
ComboBoxの準備
行の追加
行番号を指定してDataGridの値を表示する
まとめ

XAMLの記入

DataGridComboBoxColumn というタグが用意されていますが、使い勝手が微妙なので、代わりに、DataGridTemplateColumn を使います。

MainWindow.xaml

<DataGridTemplateColumn Header="コンボ・ボックス1">
    <DataGridTemplateColumn.CellTemplate>
        <DataTemplate>
            <ComboBox ItemsSource="{Binding ComboBox1List}" SelectedItem="{Binding ComboBox1Selected, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged}"/>
        </DataTemplate>
    </DataGridTemplateColumn.CellTemplate>
</DataGridTemplateColumn>

最初に、ComboBoxを配置する列の全体をタグで囲みます。
その中に、、続いてを書き、その中にを書きます。
２つBindingします。「選択用のリスト」と「選択された値」の２つです。
「ItemsSource=～～」と「SelectedItem=～～」の部分です。

ComboBoxの準備

まず、DataGridのカラムに対応させたクラスに、コンボボックスのプロパティを追加します。
「選択用のリスト」と「選択された値」の２つが必要になります。

MainWindow.xaml.cs

public class DataGrid1Row
{
    public string Item1 { get; set; } = "";
    public List<string> ComboBox1List { get; set; } = new List<string>(){ "なし", "Tokyo", "New York", "London" };
    public string? ComboBox1Selected { get; set; }
}

プロパティ名は、XAMLのマークアップ拡張、Bindingに書いた名前（バインディングソース）と同じにします。ここでは「ComboBox1List」と「ComboBox1Selected」ですね。

「選択用のリスト」は初期値となるリストを定義しておきます。

行の追加

そして、データ追加の処理にComboBox用の値を追加します。「選択された値」の初期値ですね。初期値を何も選択していない状態にしたければ必要はありません。

MainWindow.xaml.cs

private int testCounter = 0;
private void Button1_Click(object sender, RoutedEventArgs e)
{
    DataGrid1Rows.Add(new DataGrid1Row { Item1 = $"追加データ{testCounter}", ComboBox1Selected = "Tokyo" });
    testCounter++;
}

行番号を指定してDataGridの値を表示する

「データ表示」用に４番目のボタンを追加したので、対応するイベントの処理を追記します。

MainWindow.xaml.cs

private void Button4_Click(object sender, RoutedEventArgs e)
{
    if (DataGrid1Rows.Count > 0)
    {
        MessageBox.Show($"最初の行のコンボボックスの値は{DataGrid1Rows[0].ComboBox1Selected}です。");
    }
    else
    {
        MessageBox.Show("行がないので表示できません");
    }
}

最初の行を表示することにしたので DataGrid1Rows[0] とコーディングしています。
行が存在しないとエラー（Exception）が発生してしまうので、件数チェックを入れておきます。

まとめ

つぎの２点に気をつければ、DataGridの中でComboBoxを使えるようになります。

XAMLでは、DataGridComboBoxColumn を使うより、DataGridTemplateColumn の中にComboBoxを書く方が便利
ComboBoxを扱う時は、「選択用のリスト」と「選択された値」の２つをバインドする