Розробка програми демонстрації роботи елементу управління dataGridView

У Microsoft Visual Studio елемент управління dataGridView розроблений для використання в додатках, створених за шаблоном Windows Forms Application. Даний елемент управління дозволяє організовувати дані у вигляді таблиці. Дані можуть отримуватись з бази даних, колекції, внутрішніх змінних – масивів чи інших об’єктів програми.

У даній темі продемонстровано використання елементу dataGridView для реалізації двовимірної таблиці (матриці), комірки якої можуть редагуватись. Кожна комірка таблиці представлена окремим елементом управління типу TextBox. Як відомо, в Microsoft Visual Studio реалізований елемент управління TextBox, який дозволяє користувачу вводити текст, забезпечує мультирядкове редагування, ввід тексту за заданою маскою.

Зміст

Пошук на інших ресурсах:

Виконання

1. Запустити на виконання Microsoft Visual Studio

⇑

2. Створити додаток за шаблоном Windows Forms Application

Щоб створити новий додаток потрібно викликати команду

File->New->Project...

У результаті відкриється вікно “New Project”. У лівій частині вікна, у вкладці Recent Templates потрібно задати Visual C#. У правій частині вікна вибрати шаблон Windows Forms Application.

Більш детальний приклад створення додатку за шаблоном Windows Forms Application описується в темі:

Створення додатку типу Windows Forms Application

Для новоствореного проекту задається папка (поле Location) та ім’я проекту (за замовчуванням WindowsFormsApplication1). Папка може бути довільною, наприклад

C:\Programs\C_Sharp

Після вибору OK у вікні New Project, буде створено форму додатку та відповідні файли проекту. Ім’я форми залишається Form1.

⇑

3. Проектування форми додатку

3.1. Розміщення елементу управління типу dataGridView на формі

Розмістити на формі елемент управління типу DataGridView (рисунок 1). Даний елемент управління можна знайти на панелі інструментів ToolBox у вкладках “All Windows Forms” або “Data”.

Після розміщення, система створює об’єкт (змінну) з іменем dataGridView1. З допомогою цього імені можна програмно оперувати методами та властивостями цього елементу управління.

Рис. 1. Елемент управління dataGridView1 та вікно Properties з властивостями

⇑

3.2. Налаштування розмірів форми та елементу управління dataGridView1. Властивість Size

З метою коректного відображення, налаштовуються розміри форми Form1 та елементу управління dataGridView1.

Розміри налаштовуються приблизно так, як показано на рисунку 2. Розміри можна налаштувати програмним шляхом або вручну з допомогою “мишки”.

Щоб налаштувати розміри dataGridView1 з допомогою вікна Properties потрібно використати властивість Size (рисунок 2).

Рис. 2. Властивість Size елементу управління dataGridView1

Щоб налаштувати розміри dataGridView1 програмно, можна використати, наприклад, такий програмний код

// задати розміри dataGridView1.
// Висота - 200 пікселів. Ширина - 350 пікселів
dataGridView1.Width = 350;
dataGridView1.Height = 200;

⇑

3.3. Розміщення та налаштування елементів управління типу Button та Label на формі

Розмістити на формі 17 елементів управління типу Button (рисунок 3). Автоматично буде створено 17 об’єктів (змінних) з іменами button1, button2, …, button17.

Рис. 3. Розміщення елементів управління типу Button

Налаштувати властивості Text розміщених кнопок:

– в елементі управління button1 властивість Text = “Додати стовпець”;
в button2 властивість Text = “Видалити стовпець”;
в button3 властивість Text = “Додати рядок”;
в button4 властивість Text = “Видалити рядок”;
в button5 властивість Text = “Текст в заголовку”;
в button6 властивість Text = “Вирівнювання заголовку”;
в button7 властивість Text = “Шрифт заголовку”;
в button8 властивість Text = “Колір шрифту заголовку”;
в button9 властивість Text = “Задати розмір dataGridView1”;
в button10 властивість Text = “Ширина першого стовпця”;
в button11 властивість Text = “Висота рядка”;
в button12 властивість Text = “Вирівнювання у стовпці”;
в button13 властивість Text = “Шрифт у першому стовпці”;
в button14 властивість Text = “Кількість колонок”;
в button15 властивість Text = “Кількість рядків”;
в button16 властивість Text = “Ширина стовпця”;
в button17 властивість Text = “Висота рядка”.

В усіх елементах управління встановити властивість AutoSize в значення true.

Для виведення інформації також потрібно розмістити на формі елемент управління типу Label. Після розміщення, форма додатку прийме вигляд, як показано на рисунку 4.

Рис. 4. Форма додатку після розміщення та налаштування елементів управління

⇑

4. Програмування обробників подій керування роботою елементу управління dataGridView1

Для роботи програми потрібно запрограмувати події кліку на кнопках button1, button2, …, button17. Детальний приклад програмування події Click елементу управління Button описується в темі:

Приклад програмування події в C#. Розробка програми визначення площі поверхні кулі

⇑

4.1. Команда “Додати стовпець”

Види даних, що можуть бути представлені у комірках dataGridView:

dataGridViewButtonColumn. Комірки представлені у вигляді кнопок типу Button;
dataGridViewCheckBoxColumn. Комірки представлені елементами управління типу CheckBox, які дозволяють вибирати декілька варіантів (опцій) з набору запропонованих;
dataGridViewComboBoxColumn. Комірки представлені елементами управління типу ComboBox, що призначені для вибору одного з декількох варіантів;
dataGridViewImageColumn. Комірки таблиці є зображеннями типу Image;
dataGridViewLinkColumn. Комірки таблиці представлені посиланнями;
dataGridViewTextBoxColumn. Цей варіант пропонується за замовчуванням при додаванні (створенні) нової колонки. У цьому випадку комірки таблиці представлені у вигляді полів вводу. Це дозволяє вводити дані в таблицю як в матрицю.

Додати стовпець в dataGridView можна:

з допомогою спеціального майстра;
програмним шляхом.

⇑

4.1.1. Додавання стовпця з допомогою спеціального майстра Microsoft Visual Studio

Щоб додати стовпець в dataGridView з допомогою майстра, потрібно виконати таку послідовність дій:

викликати меню “DataGridView Tasks” (рисунок 5) шляхом кліку на стрілці вправо (права верхня частина прямокутної області dataGridView1);
у меню “DataGridView Tasks” вибрати команду “Add Column…”. У результаті відкриється вікно “Add Column”, в якому можна налаштувати назву колонки, тип даних колонки, назву заголовку тощо.

Рис. 5. Вікно вибору задач “dataGridView Tasks”

Рис. 6. Вікно додавання стовпця з допомогою майстра

⇑

4.1.2. Додавання стовпця програмним шляхом

Стовпці у dataGridView організовані у вигляді колекції Columns типу DataGridViewColumnCollection. Щоб додати стовпець програмним шляхом використовується метод (команда) Add з колекції Columns.

Метод Add має 2 варіанти реалізації:

int DataGridViewColumnCollection.Add(DataGridViewColumn dataGridViewColumn);

int DataGridViewColumnCollection.Add(string ColumnName, string HeaderText);

де

DataGridViewColumn – тип System.Windows.Forms.Column що додається;
ColumnName – назва, за якою буде здійснюватись звертання до стовпця в інших методах;
HeaderText – Текст, що відображатиметься у заголовку колонки.

Текст обробника події додавання двох довільних стовпців наступний:

private void button1_Click(object sender, EventArgs e)
{
    // Додати стовпець з іменем column-1, заголовок стовпця - "Header column - 1"
    dataGridView1.Columns.Add("column-1", "Header column - 1");

    // Додати стовпець з іменем column-2
    dataGridView1.Columns.Add("column-2", "Header column - 2");

    label1.Text = "Стовпці додано";
}

У реальних програмах назва стовпця та його заголовку отримуються з інших елементів управління, наприклад TextBox.

Для вставки стовпця використовується метод Insert, що має таке оголошення

void DataGridViewColumnCollection.Insert(int columnIndex, DataGridViewColumn dataGridViewColumn);

⇑

4.2. Команда “Видалити стовпець”

Щоб видалити стовпець використовується один з двох методів з колекції Columns:

метод RemoveAt() – видаляє стовпець з заданого індексу в колекції;
метод Remove() – видаляє стовпець за його іменем.

Загальний вигляд методу RemoveAt():

void DataGridViewColumnCollection.RemoveAt(int index);

де

index – заданий індекс в колекції. Індекси нумеруються з 0.

void DataGridViewColumnCollection.Remove(string ColumnName);

де

ColumnName – назва стовпця (але не назва заголовку стовпця), яка задається в методі Add() першим параметром. Стовпці в колекції можуть мати однакові значення ColumnName. Якщо при виклику методу Remove() стовпця з іменем ColumnName немає, то генерується виключна ситуація.

Програмний код видалення стовпця з допомогою методу RemoveAt():

private void button2_Click(object sender, EventArgs e)
{
    // видалення стовпця в позиції index
    int index; // номер стовпця, що видаляється
    int n; // поточна кількість стовпців в dataGridView

    // задати номер стовпця, що видаляється
    index = 1;

    // визначити поточну кількість стовпців у dataGridView
    n = dataGridView1.Columns.Count;

    // видалення
    if ((n > 0) && (index >= 0) && (index < n))
    {
        dataGridView1.Columns.RemoveAt(index);
        label1.Text = "Стовпець видалено";
    }
    else
    {
        label1.Text = "Стовпець не видалено";
    }
}

⇑

4.3. Команда “Додати рядок”

Додавати рядок можна двома способами:

шляхом безпосереднього вводу з клавіатури;
програмним шляхом.

Рядки в DataGridView організовані у вигляді колекції Rows типу dataGridViewRowCollection.

Нижче наведено обробник події, що додає 2 довільні рядки в таблицю

private void button3_Click(object sender, EventArgs e)
{
    // Додати рядки в таблицю
    if (dataGridView1.Columns.Count <= 0)
    {
        label1.Text = "Рядки не додано";
        return;
    }

    dataGridView1.Rows.Add("Ivanov I.I.", 25, "New York");
    dataGridView1.Rows.Add("Petrenko P.P.", 38, "London");
    label1.Text = "Рядки додано";
}

⇑

4.4. Команда “Видалити рядок”

Для видалення рядка використовується один з двох методів:

метод RemoveAt() – видаляє рядок за заданим індексом;
метод Remove() – видаляє рядок, що є вхідним параметром типу DataGridViewRow.

Обробник події видалення рядка має вигляд:

private void button4_Click(object sender, EventArgs e)
{
    // Видалити рядок
    int nr, nc;

    nc = dataGridView1.Columns.Count; // кількість стовпців
    nr = dataGridView1.RowCount;

    if ((nc > 0) && (nr > 1))
    {
        dataGridView1.Rows.RemoveAt(0); // видалити перший рядок
        label1.Text = "Рядок видалено";
    }
    else
    {
        label1.Text = "Рядок не видалено";
    }
}

⇑

4.5. Робота з заголовком заданого стовпця

4.5.1. Задати текст заголовку в заданому стовпці (колонці) програмним шляхом

Щоб задати текст заголовку в заданому стовпці використовується властивість HeaderText. Текст обробника події задавання тексту заголовку в стовпці з індексом 0 має вигляд:

private void button5_Click(object sender, EventArgs e)
{
    // задати текст в заголовку
    int nc = dataGridView1.ColumnCount;

    if (nc > 0)
    {
        // задати новий текст заголовку першого стовпця
        dataGridView1.Columns[0].HeaderText = "Header - 1";
        label1.Text = "Текст задано";
    }
    else
    {
        label1.Text = "Текст не задано";
    }
}

⇑

4.5.2. Задати вирівнювання заголовку в заданому стовпці програмним шляхом

Вирівнювання заголовку в стовпці задається з допомогою властивості HeaderCell.Style.Alignment.

Програмний код обробника події задавання вирівнювання в заголовку стовпця з індексом 0:

private void button6_Click(object sender, EventArgs e)
{
    // вирівнювання заголовку
    int nc;
    nc = dataGridView1.ColumnCount;

    if (nc > 0)
    {
        // задати вирівнювання по центру (по горизонталі і по вертикалі)
        dataGridView1.Columns[0].HeaderCell.Style.Alignment = DataGridViewContentAlignment.MiddleCenter;
        label1.Text = "Вирівнювання виконано";
    }
    else
    {
        label1.Text = "Вирівнювання не виконано";
    }
}

⇑

4.5.3. Задати шрифт заголовку в стовпцях програмним шляхом

Для задавання шрифту в заголовках стовпців використовується властивість ColumnHeadersDefaultCellStyle. У цій властивості використовується властивість Font.

В обробнику події створюється шрифт Arial, який має розмір 12 і стиль “курсив”.

private void button7_Click(object sender, EventArgs e)
{
    // задати шрифт в заголовку
    int nc;
    nc = dataGridView1.ColumnCount;

    // створити шрифт "Arial", розмір 12, стиль - "курсив"
    Font F = new Font("Arial", 12, FontStyle.Italic);

    if (nc > 0)
    {
        // встановити шрифт заголовку
        dataGridView1.ColumnHeadersDefaultCellStyle.Font = F;
        label1.Text = "Шрифт задано";
    }
    else
    {
        label1.Text = "Шрифт не задано";
    }
}

⇑

4.5.4. Задати колір шрифту заголовків програмним шляхом

Щоб задати колір шрифту заголовків програмним шляхом потрібно використати властивість ColumnHeaderDefaultCellStyle. У цій властивості є властивості ForeColor та BackColor.

private void button8_Click(object sender, EventArgs e)
{
    //
    int nc;
    nc = dataGridView1.ColumnCount;

    if (nc > 0)
    {
        // створити системний шрифт
        Font F = new Font("Arial", 14);

        // задати колір в заголовках стовпців
        dataGridView1.ColumnHeadersDefaultCellStyle.ForeColor = Color.Purple;

        // задати шрифт
        dataGridView1.Columns[0].DefaultCellStyle.Font = F;
        label1.Text = "Колір заголовку змінено";
    }
    else
    {
        label1.Text = "Колір не змінено";
    }
}

⇑

4.6. Робота з параметрами стовпців, рядків, комірок

4.6.1. Задавання розмірів dataGridView1 програмним шляхом

private void button9_Click(object sender, EventArgs e)
{
    // задати розмір dataGridView1
    dataGridView1.Width = 600;
    dataGridView1.Height = 150;
    label1.Text = "Розмір встановлено";
}

⇑

4.6.2. Задавання ширини заданого стовпця dataGridView1

private void button10_Click(object sender, EventArgs e)
{
    // задати ширину стовпця
    int nc;
    nc = dataGridView1.ColumnCount;

    if (nc > 0)
    {
        // задати ширину стовпця з індексом 0
        dataGridView1.Columns[0].Width = 70;
        label1.Text = "Ширину стовпця задано";
    }
    else
    {
        label1.Text = "Ширину стовпця не задано";
    }
}

⇑

4.6.3. Задавання висоти заданого рядка dataGridView1

private void button11_Click(object sender, EventArgs e)
{
    // задати висоту рядка
    int nc, nr;
    nc = dataGridView1.ColumnCount;
    nr = dataGridView1.RowCount;

    if ((nc > 0) && (nr > 1))
    {
        dataGridView1.Rows[0].Height = 50;
        label1.Text = "Висоту рядка задано";
    }
    else
    {
        label1.Text = "Висоту рядка не задано";
    }
}

⇑

4.6.4. Задавання вирівнювання в заданому стовпці та рядку

private void button12_Click(object sender, EventArgs e)
{
    // вирівнювання у рядках
    int nc, nr;
    nc = dataGridView1.ColumnCount;
    nr = dataGridView1.RowCount;

    if ((nc > 0)&&(nr>1))
    {
        // вирівнювання для усіх рядків
        dataGridView1.RowsDefaultCellStyle.Alignment = DataGridViewContentAlignment.BottomRight;

        // вирівнювання для рядка з індексом 0
        dataGridView1.Rows[0].DefaultCellStyle.Alignment = DataGridViewContentAlignment.MiddleCenter;

        // вирівнювання для стовпця з індексом 0
        dataGridView1.Columns[0].DefaultCellStyle.Alignment = DataGridViewContentAlignment.BottomLeft;
    }
}

⇑

4.6.5. Задавання шрифту, кольору символів і фону в першому стовпці

Щоб задати шрифт, колір символів і фону у першому стовпці, використовується властивість DefaultCellStyle стовпця з індексом 0. У цій властивості є властивості Font, BackColor, ForeColor.

Нижче наведено обробник події, що задає колір шрифту, символів і фону в dataGridView1.

private void button13_Click(object sender, EventArgs e)
{
    // шрифт і колір у першому стовпці
    int nc, nr;
    nc = dataGridView1.ColumnCount;
    nr = dataGridView1.RowCount;

    if ((nc > 0) && (nr > 1))
    {
        // створити шрифт
        Font F = new Font("Times New Roman", 10, FontStyle.Bold);

        // колір символів і фону у першому стовпці
        dataGridView1.Columns[0].DefaultCellStyle.BackColor = Color.Red;
        dataGridView1.Columns[0].DefaultCellStyle.ForeColor = Color.Blue;

        // шрифт у першому стовпці
        dataGridView1.Columns[0].DefaultCellStyle.Font = F;
        label1.Text = "Шрифт і колір у 1-му стовпці змінено";
    }
    else
    {
        label1.Text = "Шрифт не змінено";
    }
}

⇑

4.7. Отримання інформації про стовпці, рядки dataGridView1

4.7.1. Визначити кількість стовпців

private void button14_Click(object sender, EventArgs e)
{
    // визначити кількість стовпців
    int n;
    n = dataGridView1.Columns.Count;
    label1.Text = n.ToString();
}

⇑

4.7.2. Визначити кількість рядків

private void button15_Click(object sender, EventArgs e)
{
    // визначити кількість рядків без рядка заголовку
    int n;
    n = dataGridView1.Rows.Count;
    label1.Text = (n - 1).ToString();
}

⇑

4.7.3. Визначити ширину заданого стовпця в пікселях

private void button16_Click(object sender, EventArgs e)
{
    // ширина стовпця в пікселях
    int w;
    int nc;

    nc = dataGridView1.Columns.Count;

    if (nc > 0)
    {
        w = dataGridView1.Columns[0].Width;
        label1.Text = w.ToString();
    }
}

⇑

4.7.4. Визначити висоту заданого рядка в пікселях

private void button17_Click(object sender, EventArgs e)
{
    // визначити висоту рядка в пікселях
    int h;
    int nr, nc;

    nc = dataGridView1.Columns.Count;
    nr = dataGridView1.RowCount;

    if ((nr>1)&&(nc>0))
    {
        h = dataGridView1.Rows[0].Height;
        label1.Text = h.ToString();
    }
}