[.Net] WinForm UI 컨트롤 데이터 바인딩(Data Binding) 파헤치기(예제 포함)

데이터 바인딩(Data Binding)이란?

혹시 WinForm UI 컨트롤 중 DataGridView나 ListBox에서 DataBinding 항목을 본 적이 있나요? 데이터 바인딩은 UI 컨트롤과 데이터를 연결하는 것을 의미합니다. 데이터와 UI 컨트롤이 연결되어 있으면, 데이터가 변경될 때 UI 컨트롤이 자동으로 갱신되게 됩니다. 즉, 데이터가 변경됐을 때 사용자가 일일이 UI 컨트롤을 수정할 필요가 없는 것이죠.

DataGridView 속성 화면

데이터 바인딩을 사용할 때 또 하나의 장점이 있습니다. 대량의 데이터를 UI 컨트롤에 반영할 때 반응 속도가 빠르다는 것이죠.

본문에서 데이터 바인딩을 사용하지 않았을 때 문제점, 데이터 바인딩을 적용하면 어떤 효과를 볼 수 있는지 자세히 다뤄보도록 하겠습니다.

DataGridView 컨트롤

DataGridView는 흔히 엑셀에서 셀을 표시하는 것과 유사합니다. 제일 첫 번째 행에는 헤더 행(Header row)이 있고, 그 아래로는 데이터 행(Data row)이 추가됩니다. 그리고 제일 마지막 행에는 데이터 입력이 가능합니다.

DataGridView 컨트롤의 동작 화면

일반적인 데이터 추가 방법

아래 코드는 버튼을 클릭하면 '이름'과 '나이' 헤더에 두 개의 데이터를 추가하는 동작입니다.

private void btnCreateData_Click(object sender, EventArgs e)
{
    dataGridView1.Columns.Add("Column1", "이름");
    dataGridView1.Columns.Add("Column2", "나이");

    dataGridView1.Rows.Add("짱구", "22");
    dataGridView1.Rows.Add("철수", "33");
}

동작은 아래 그림과 같습니다. 아주 간단하죠?

코드 동작 결과

그럼 이번에는 훨씬 더 많은 5천 개의 데이터 행(Row)을 추가해 보겠습니다. 데이터 행을 추가하는 함수로 Add()가 사용됐습니다.

private void btnCreateData_Click(object sender, EventArgs e)
{
    dataGridView1.Columns.Add("Column1", "이름");
    dataGridView1.Columns.Add("Column2", "나이");

    for (int i = 0; i < 5000; i++)
    {
        dataGridView1.Rows.Add($"Name{i}", $"Age{i}");
    }
}

그리고 동작 결과는 아래와 같습니다. 버튼을 클릭하고 약 1~2초 정도의 지연 후 컨트롤에 5천 개의 데이터가 추가됐습니다.

Add 함수로 데이터 추가한 결과

데이터 바인딩 사용 방법

이번에는 데이터 바인딩을 사용하여 데이터를 연결해 보겠습니다. DataTable을 사용하여 Column을 추가하고, 이후 Rows에 데이터를 추가하면 됩니다.

private void btnDataBinding_Click(object sender, EventArgs e)
{
    DataTable dt = new DataTable();

    dt.Columns.Add("Column1");
    dt.Columns.Add("Column2");

    for (int i = 0; i < 5000; i++)
    {
        dt.Rows.Add($"Name{i}", $"Age{i}");
    }

    dataGridView1.DataSource = dt;
}

결과를 보면, 버튼을 클릭하자마자 데이터가 바로 보입니다. Add() 함수를 사용할 때 와는 다른 속도입니다.

데이터 바인딩으로 추가한 결과

이처럼, 데이터 바인딩을 사용하여 대량의 데이터를 컨트롤과 연결할 때 속도를 개선할 수 있습니다.

또한, 데이터 바인딩을 사용하면 데이터를 추가하고 삭제할 때 자동으로 컨트롤이 갱신됩니다. 아래 코드는 맨 마지막 행에 데이터를 추가하고, 맨 처음 행의 데이터를 삭제하는 동작입니다.

private void btnAdd_Click(object sender, EventArgs e)
{
    DataTable dt = (DataTable)dataGridView1.DataSource;
    dt.Rows.Add($"Name{dt.Rows.Count}", $"Age{dt.Rows.Count}");
}

private void btnDelete_Click(object sender, EventArgs e)
{
    DataTable dt = (DataTable)dataGridView1.DataSource;
    dt.Rows.RemoveAt(0);
}

데이터 추가, 삭제 동작

주의 사항

데이터 행을 추가하는 Add() 그리고 제거하는 Remove()를 사용하는 일반적인 방식과 데이터 바인딩 방식은 같이 사용될 수 없습니다. 만약, 데이터 바인딩 이후 Add()나 Remove()를 호출하게 되면 다음의 메시지가 발생합니다.

private void btnMixed_Click(object sender, EventArgs e)
{
    try
    {
        DataTable dt = new DataTable();
        dataGridView1.DataSource = dt;

        dataGridView1.Rows.Add($"Name", $"Age");
    }
    catch(Exception exc)
    {
        MessageBox.Show(exc.Message);
    }
}

오류

컨트롤이 데이터 바인딩된 경우에는 DataGridView의 행 컬렉션에 프로그래밍 방식으로 행을 추가할 수 없습니다.

따라서, 처음부터 데이터 바인딩을 사용할 것인지 아니면 프로그래밍 방식을 사용할 것인지 미리 선택한 후 개발해야 합니다.

TestDataBinding.zip

0.02MB