【C#】C#のdatagridviewにCSVファイルのデータとテキストボックスを表示させるには

この記事では、C#のdatagridviewにCSVファイルのデータとテキストボックスを表示させる方法についてご説明します。

【動画】C#のdatagridviewにCSVファイルのデータとテキストボックスを表示させる実際の動き

本題に入る前に、まずは次の動画をご覧ください。

CSVファイルを開いてStreamReaderインスタンスを生成します。

StreamReaderインスタンスが生成されたら、CSVファイルのデータを取得してdatagridviewに出力しています。

datagridviewにデータを表示したら、テキストボックスを表示する列を追加します。

コードの流れ

CSVファイルのデータの例

今回は次のCSVファイルのデータを用意しました。

3件のデータが存在しています。

今回はこのCSVファイルのデータとテキストボックスををDatagridviewに出力します。出力結果は下のとおりです。(datagridviewの下にあるテキストボックスをクリックするとCSVのデータがDatagridviewに表示される)

今回出力されているテキストボックスは一番左の列です。

C#のコード(例)

App.configのコード

<?xml version="1.0" encoding="utf-8" ?>
<configuration>
    <startup> 
        <supportedRuntime version="v4.0" sku=".NETFramework,Version=v4.7.2" />
    </startup>

    <appSettings>
        <!-- CSVファイルのパス -->
        <add key="CSVPath" value="C:\work\10_勉強\21_C#\0038\data.csv" />

    </appSettings>
</configuration>

注目すべきコード

見て頂きたいのは9行目です。

        <!-- CSVファイルのパス -->
        <add key="CSVPath" value="C:\work\10_勉強\21_C#\0038\data.csv" />

コードの説明

以上のコードは、CSVファイルのフルパスを「CSVPath」というキーに設定しているコードです。

「CSVPath」のキーの値をフォーム側のコードが参照して使います。

フォームのコード

using System;
using System.Configuration;
using System.IO;
using System.Windows.Forms;

namespace wfcs_0038
{
    public partial class Form1 : Form
    {
        public Form1()
        {
            InitializeComponent();
        }

        private void button1_Click(object sender, EventArgs e)
        {
            // DataGridViewの既存の行をクリアする
            dataGridView1.Rows.Clear();

            // DataGridViewの既存の列をクリアする
            dataGridView1.Columns.Clear();

            // CSVファイルから読み込む各行を格納する変数
            string line;

            // App.configのappSettingsタグ内に記述した「CSVPath」のキーの値を取得して変数「CSVFilePath」に格納する
            string CSVFilePath = ConfigurationManager.AppSettings["CSVPath"];

            // DataGridViewのヘッダーに表示する文言を配列「valAry」に格納する
            string[] valArt = { "名前", "値段" };

            // CSVファイルを開いてStreamReaderインスタンスを生成する
            using (StreamReader rdr = new StreamReader(File.OpenRead(CSVFilePath)))
            {
                if (dataGridView1.Columns.Count == 0)
                {
                    // 列がまだ作成されていない場合

                    // valArtの要素数分処理を繰り返すループ
                    for (int i = 0; i < valArt.Length; i++)
                    {
                        // 列を作成する
                        dataGridView1.Columns.Add(valArt[i], valArt[i]);
                    }
                }

                // CSVファイルの行数分処理を繰り返すループ
                // (CSVファイルの最終行までデータを確認したらループを抜ける)
                while ((line = rdr.ReadLine()) != null)
                {
                    // 行データをカンマで分割し、配列に分割した値を格納する
                    var values = line.Split(',');

                    // DataGridViewに行を追加する
                    dataGridView1.Rows.Add(values);
                }
            }

            // DataGridViewTextBoxColumnのインスタンスを生成する
            DataGridViewTextBoxColumn column = new DataGridViewTextBoxColumn();

            // 列のヘッダ用文字列を取得する
            string colName = "テキスト";

            // 列のヘッダの名前に変数colNameの値を設定する
            column.Name = colName;

            // dataGridViewにテキストボックスの列を追加する
            dataGridView1.Columns.Add(column);

            // テキストボックスの列の表示位置を列の1列目(インデックスが0)に設定する
            dataGridView1.Columns[colName].DisplayIndex = 0;
        }
    }
}

注目すべきコード①

最初に見て頂きたいのは18行目から21行目です。

            // DataGridViewの既存の行をクリアする
            dataGridView1.Rows.Clear();
            
            // DataGridViewの既存の列をクリアする
            dataGridView1.Columns.Clear();

コードの説明

以上のコードは、すでにdatagridviewに表示されているデータをクリアする処理です。

一度datagridviewにCSVファイルのデータを表示し、再度CSVファイルのデータをdatagridviewする場合に表示データが重複表示されてしまうので、以上のコードの処理を行うことでdatagridviewのデータ表示をクリアします。

注目すべきコード②

次に見て頂きたいのは27行目です。

            // App.configのappSettingsタグ内に記述した「CSVPath」のキーの値を取得して変数「CSVFilePath」に格納する
            string CSVFilePath = ConfigurationManager.AppSettings["CSVPath"];

コードの説明

以上のコードは、App.configのappSettingsタグ内に記述した「CSVPath」のキーの値を取得して変数「CSVFilePath」に格納する処理のコードです。

ConfigurationManager.AppSettingsプロパティに、App.configのappSettingsタグ内に記述した「CSVPath」を設定することで、「CSVPath」のキーの値を取得することができます。

今回は「CSVPath」のキーに「C:\work\10_勉強\21_C#\0038\data.csv」を設定しているので、ConfigurationManager.AppSettingsプロパティから返された「C:\work\10_勉強\21_C#\0038\data.csv」が変数CSVFilePathに格納されます。

注目すべきコード③

次に見て頂きたいのは30行目です。

            // DataGridViewのヘッダーに表示する文言を配列「valAry」に格納する
            string[] valArt = { "名前", "値段" };

コードの説明

以上のコードは、Datagridviewのヘッダの文言用の文字列を格納しておく配列のコードです。

今回は「名前」と「値段」の文字列をDatagridviewのヘッダに表示させます。

注目すべきコード④

次に見て頂きたいのは33行目です。

            // CSVファイルを開いてStreamReaderインスタンスを生成する
            using (StreamReader rdr = new StreamReader(File.OpenRead(CSVFilePath)))

コードの説明

以上のコードは、

以上のコードは、CSVファイルを開いてStreamReaderインスタンスを生成する処理のコードです。

File.OpenReadメソッドにCSVファイルのフルパスが格納された変数CSVFilePathを指定して実行することで、StreamReaderインスタンスが生成されます。

以上のコードを実行することで、CSVファイルのデータを取得する準備ができました。

注目すべきコード⑤

次に見て頂きたいのは35行目から45行目です。

                if (dataGridView1.Columns.Count == 0)
                {
                    // 列がまだ作成されていない場合

                    // valArtの要素数分処理を繰り返すループ
                    for (int i = 0; i < valArt.Length; i++)
                    {
                        // 列を作成する
                        dataGridView1.Columns.Add(valArt[i], valArt[i]);
                    }
                }

コードの説明

以上のコードは、列がまだ作成されていない場合に列を追加する処理のコードです。

コードの詳細

35行目では、datagridviewに列が作成されているか判定し、作成されていない場合は43行目で列を作成します。

なお列の作成は、配列valArtの要素数分行います。

今回はvalArtに「名前」と「値段」の2つの値が格納されているので、列の作成処理を2回繰り返します。

注目すべきコード⑥

次に見て頂きたいのは49行目から56行目です。

                // CSVファイルの行数分処理を繰り返すループ
                // (CSVファイルの最終行までデータを確認したらループを抜ける)
                while ((line = rdr.ReadLine()) != null)
                {
                    // 行データをカンマで分割し、配列に分割した値を格納する
                    var values = line.Split(',');

                    // DataGridViewに行を追加する
                    dataGridView1.Rows.Add(values);
                }

コードの説明

以上のコードは、CSVファイルからデータを読み込み取得してDatagridviewに出力する処理のコードです。

CSVファイルの最終行までデータを確認して、最終行まで確認したらwhileのループを抜けます。

コードの詳細

49行目のコードは、CSVファイルの行数分処理を繰り返すループで、CSVファイルの最終行までデータを確認したらループを抜けます。

CSVファイルのデータを参照する行が最終行ではない場合は、CSVファイルから1行データを取得して変数lineに格納します。

52行目のコードでは、変数lineに格納されたデータをカンマで分割して配列valuesに格納します。

今回はカンマで分割するようコードに記述していますが、お使いのデータに合わせてどの文字で区切るか指定してください。

55行目では、配列valuesに格納された値をdatagridviewに出力します。

datagridviewにデータを出力したら次の行を参照しに行きます。(52行目の処理に戻ります)

注目すべきコード⑦

次に見て頂きたいのは60行目から72行目です。

            // DataGridViewTextBoxColumnのインスタンスを生成する
            DataGridViewTextBoxColumn column = new DataGridViewTextBoxColumn();

            // 列のヘッダ用文字列を取得する
            string colName = "テキスト";

            // 列のヘッダの名前に変数colNameの値を設定する
            column.Name = colName;

            // dataGridViewにテキストボックスの列を追加する
            dataGridView1.Columns.Add(column);

            // テキストボックスの列の表示位置を列の1列目(インデックスが0)に設定する
            dataGridView1.Columns[colName].DisplayIndex = 0;

コードの説明

以上のコードは、テキストボックスを表示する列を追加する処理のコードです。

コードの詳細

60行目のコードは、DataGridViewにテキストボックス型のカラムを追加するためDataGridViewTextBoxColumnのインスタンスの生成を行います。

DataGridViewTextBoxColumnのインスタンスを生成することで、特定のセルにテキストボックスを持つ列をDataGridViewに追加することができます。

63行目のコードでは列のヘッダ用文字列を取得し、66行目で列のヘッダの名前に変数colNameの値を設定します。

69行目のコードは、datagridviewにテキストボックス列を追加するコードです。

ここまで説明した60行目から66行目の設定を元に、datagridviewにテキストボックス列を追加します。

72行目のコードでは、テキストボックス列を左から何番目に表示させるかを設定します。

DisplayIndexプロパティに0を設定すると、テキストボックス列はdatagridviewの1番左の列に表示されます。

DisplayIndexプロパティに1を設定した場合は2列目に表示されます。

動作確認

「CSVファイルのデータの例」をご覧ください。

最後に

この記事では、C#のdatagridviewにCSVファイルのデータとテキストボックスを表示させる方法についてご説明しました。

C#のdatagridviewにCSVファイルのデータとテキストボックスを表示させたいときは本記事を参考にしてみてくださいね。

プログラミングのスキルを習得するなら

プログラミングのスキルを習得したい、今のスキルをもっと高めたい、そう考えているなら「プログラミングスクール」がおすすめです。

プログラミングのスキルの基礎を身につけるなら「TechAcademy」で1週間の無料体験があるので、これで「プログラミングの基礎」を学ぶのにおすすめですよ。

→　TechAcademyの「1週間 無料体験」はこちら