[WPF]コンボボックスにデータバインド

コンボボックスとのデータバインディングを試してみる

• コンボボックスとバインドする

• コンボ表示項目の設定

• 選択値に曜日Enum(Key部)がセットされるようにする

コンボボックスとバインドする

コンボボックスを追加する

データをバインドするためのクラスを作成する。

曜日の列挙型定義する。

曜日Enumと文字列を持つディクショナリを作成し、初期値を設定しておく。

    
class MyDataBind
{
    public enum Week
    {
        Sunday,
        Monday,
        Tuesday,
        Wednesday,
        Thursday,
        Friday,
        Saturday
    }

    public Dictionary WeekList { get; set; } 
        = new Dictionary
    {
        [Week.Sunday] = "日曜日",
        [Week.Monday] = "月曜日",
        [Week.Tuesday] = "火曜日",
        [Week.Wednesday] = "水曜日",
        [Week.Thursday] = "木曜日",
        [Week.Friday] = "金曜日",
        [Week.Saturday] = "土曜日"

    };
}

    

DataContextとバインド用クラスを紐付ける

「新規作成」ボタンをクリックする前に、一度ビルドしておく。先に追加したバインド用クラスをデザイン画面から選択できるようにしたいため。

バインド用クラスを選択する。

自分で追加したクラスを見やすくするため「すべてのアセンブリの表示」はOFFにしておく。

バインドされた。次に、バインド用クラスのディクショナリとコンボボックスを紐付ける

ItemSourceの赤枠クリック

「データバインディングの作成」クリック

バインド用クラスに作成したWeekListディクショナリを選択する。

追加された。一度動かしてみる。

コンボボックスのリストに表示されたが、KeyとValueがまとめて表示されている。

コンボ表示項目の設定

選択される値はディクショナリのKey、リストに表示される値はディクショナリのValueになるようにしてみる。

DisplayMemberPathに「Value」、SelectedValuePathに「Key」と入力する

動かしてみる。

曜日の日本語名（Value部）のみになった。

選択値に曜日Enum(Key部)がセットされるようにする

バインド用クラスにプロパティを追加

SelectedVal　コンボボックスの選択値とバインドさせるためのプロパティ

    
public string SelectedVal { get; set; }        
    

コンボボックスのSelectedValueプロパティとバインドさせる。

赤枠クリック（クリック前にビルドを忘れずに）

データバインディングの作成クリック

先ほど追加したSelectedValを選択

確認のため、コンボボックスのイベントハンドラ追加

コンボの選択が変わったときに、その選択値をメッセージボックスで表示する。

    
private void ComboBox_SelectionChanged(object sender, SelectionChangedEventArgs e)
{
    MessageBox.Show((this.DataContext as MyDataBind).SelectedVal);
}
    

動かしてみる

月曜日を選択

OK

木曜日を選択

これもOK。