DataGridViewでカスタムデータを利用する

提供:MochiuWiki - SUSE, Electronic Circuit, PCB
ナビゲーションに移動 検索に移動

概要

Windowsフォームアプリケーションで使用するDataGridViewにおいて、独自作成したクラスを表示させようとすると手間が掛かる。
この場合、BindingSourceを挟むだけで表示・追加・変更・削除が簡単にできるようになる。
ここでは、上記の実装方法を説明する。

カスタムデータを設定する

作成するコードは"モデルとなるクラス"と"フォームクラス"の2種類だけである。
以下にファイル一覧を記載する。ここで、"モデルとなるクラス"が上記のカスタムデータに相当する。

  • UserModel.cs
  • Form1.cs
UserModel.cs
public class UserModel
{
   public string Id { get; set; }
   public string FirstName { get; set; }
   public string LastName { get; set; }
   public string Email { get; set; }
   public string Password { get; set; }
}
Form1.cs
using System.Collections.Generic;
using System.Windows.Forms;

public partial class Form1 : Form
{
   private BindingSource wrapper;

   private List<UserModel> original;

   public Form1()
   {
       this.InitializeComponent();

       this.original = new List<usermodel>()
       {
           new UserModel()
           {
               Id = "0010",
               FirstName = "Kurihara",
               LastName = "Yuki",
               Email = "yuki.kurihara@gmail.com",
               Password = "*****"
           },
           new UserModel()
           {
               Id = "0020",
               FirstName = "Momotsuki",
               LastName = "Shinya",
               Email = "shinya.momotsuki@gmail.com",
               Password = "*****"
           }
       };
       // DataGridView.DataSourceへ直接List<T>を代入しても表示できないが
       // BindingSourceを挟むことで表示できる
       this.wrapper = new BindingSource()
       {
           DataSource = this.original
       };

       this.dataGridView1.DataSource = this.wrapper;
   }
}
</usermodel>


ソースコードによる変更を画面へ反映させる

DataGridView.DataSouceに設定したBindingSourceに対して操作することで、項目の追加・変更・削除を画面に反映させる。
具体的なソースコードは以下に記載する。

  • 追加
BindingSource.Add(object)を利用して項目を追加する。
private void button1_Click(object sender, System.EventArgs e)
{
   this.wrapper.Add(new UserModel()
   {
       Id = System.DateTime.Now.ToString(),
       FirstName = "Kurihara",
       LastName = "Yuki",
       Email = "yuki.kurihara@gmail.com",
       Password = "*****"
   });
}
  • 変更
元のデータに対して操作した後、BindngSouce.ResetItem(index)を利用して画面の反映を行う。
private void button2_Click(object sender, System.EventArgs e)
{
   var index = 0;
   this.original[index].Id = System.DateTime.Now.ToString();
   this.wrapper.ResetItem(index);
}
  • 削除
BindingSource.RemoveAt(index)で行う。
private void button3_Click(object sender, System.EventArgs e)
{
   this.wrapper.RemoveAt(0);
}


列タイトルをカスタマイズする

自動生成される列タイトルにおいて、カスタムクラスのプロパティ名を日本語で表示させる。
以下ではその方法について記載する。

  • 列タイトルを自動生成させない
以下のソースコードのように、DataGridView.AutoGenerateColumnsを設定することで制御できる。
このプロパティは、デザイナでDataGridViewを選択した時に表示されるプロパティ画面のリストに含まれていないので、
別途、ソースコードを記述する必要がある。
記述箇所はコンストラクタであるInitializeComponentの実行が終わった直後とする。
this.dataGridView1.AutoGenerateColumns = false;


  • 列タイトルに任意の項目を設定する
任意項目の追加はデザイナから行う。
デザイナで列タイトルを作成して、それぞれにどのプロパティを割り当てるか設定することで、日本語名の列タイトルが作成できる。
以下に具体的な手順を記載する。


1. DataGridViewの右上のオプションを選択する。
Datagridview-01.png
2. 展開されたメニューから[列を編集...]を選択する。
Datagridview-02.png
3. [列の編集]ダイアログの[追加]ボタンを押下する。
Datagridview-03.png
4. [列の追加]ダイアログで[名前][ヘッダーテキスト]を入力して[追加]ボタンを押下する。
Datagridview-04.png
5. 追加された列項目を選択し、DataPropertyNameにバインドしたいプロパティ名を設定する。
Datagridview-05.png
6. 設定が終わったら、[OK]ボタンを押下する。
Datagridview-06.png
7. 設定完了
Datagridview-07.png