Интерфейс пользователя представляет собой набор экранных форм с размещенными на них компонентами, программным кодом, предназначенным для организации взаимодействия пользователя и программного приложения.
Начнем проектирование интерфейса пользователя с переименования свойства «Name» формы Form1 на. Изменим значение свойства «Тext» frmMain на «Персоналии».
Добавим на форму элемент управления Panel. Изменим свойство «Name» на pnlDown. Свойство BorderStyle установим в значение FixedSingle. Выберем предпоследний нижний горизонтальный прямоугольник в свойстве Dock, как показано на рис. 6. После этой операции pnlDown «приклеится» к нижней части экранной формы.
Рис. 6 – Задание свойства Dock pnlDown
Добавим на форму кнопку Button. Зададим значение свойства «Name» кнопки btnClose. Свойство «Тext» btnClose изменить на «Закрыть». Перетащим кнопку btnClose в правую часть pnlDown. В результате нижняя часть экранной формы должна приобрести вид, показанный на рис. 7.
Рис. 7 – Внешний вид нижней части экранной формы frmMain
Двойным щелчком кнопки мыши по элементу btnClose добавим обработчик события, в котором напишем следующий код:
if (MessageBox.Show("Вы действительно хотите выйти?", "Выход", MessageBoxButtons.OKCancel, MessageBoxIcon.Question) == DialogResult.OK)
Close();
После нажатия кнопки btnClose на экран будет выведен вопрос пользователю о том хочет ли он продолжить дальнейшую работу с программным приложением или нет, рис. 8. Если после этого нажать кнопку «ОК», то приложение будет закрыто.
Рис. 8 – Вопрос о завершении работы
Добавим на форму frmMain элемент groupBox и установим его свойство «Name» в gBLeft. Свойство «Text» установим в значение «Персоналии». В свойстве Dock выберем левый крайний прямоугольник.
Добавим на форму элементы Panel и dataGridView. Перетащим добавленные элементы в gBLeft. Изменим их названия на pnlPersonButton и dGVPersons соответственно. В свойстве Dock pnlPersonButton выберем предпоследний нижний прямоугольник. В свойстве Dock dGVPersons выберем прямоугольник расположенный в центре.
Добавим на форму frmMain три кнопки и перетащим на pnlPersonButton. Изменим значения свойства «Name» добавленных кнопок на «AddPerson», «EditPerson», «DeletePerson». Изменим значения свойства «Text» добавленных кнопок на «Добавить», «Редактировать», «Удалить».
Добавим на форму frmMain элемент groupBox и установим его свойство «Name» в gBRight. Свойство «Text» установим в значение «Телефоны». В свойстве Dock выберем средний прямоугольник.
Добавим на форму элементы Panel и dataGridView. Перетащим добавленные элементы в gBRight. Изменим их названия на pnlPhoneButton и dGVPhone соответственно. В свойстве Dock pnlPhoneButton выберем предпоследний нижний прямоугольник. В свойстве Dock dGVPhone выберем прямоугольник расположенный в центре.
Добавим на форму frmMain три кнопки и перетащим на pnlPhoneButton. Изменим значения свойства «Name» добавленных кнопок на «AddPhone», «EditPhone», «DeletePhone». Изменим значения свойства «Text» добавленных кнопок на «Добавить», «Редактировать», «Удалить».
Если все сделано правильно, то внешний вид frmMain должен стать таким как показано на рис. 9.
Рис. 9 – Внешний вид frmMain
Добавим в проект новую форму frmPersons. Для этого необходимо нажать на значке проекта правой кнопкой мыши и выбрать пункт меню «Add» \ «New Item». В появившемся окне выберите пункт «Windows Form».
На форму frmPersons добавьте Panel, две кнопки Button, три элемента ввода текста TextBox, компонент выбора даты DateTimePicker. Для каждого элемента ввода добавьте соответствующий компонент Label. Расположите элементы управления, таким образом как показано на рис. 10.
Рис. 10 – Расположение элементов формы frmPersons
Приведенная на рис. 10 форма frmPersons будет использоваться одновременно для ввода и редактирования данных персоналий. Определение режима добавления, редактирования будет производиться по значению специализированной переменной.
Осуществим присоединение функционала к кнопке «Добавить» (btnAddPerson) главной формы. Двойным щелчком мыши создадим обработчик событий, в который впишем следующий код:
frmPerson frm = new frmPerson();
frm.ShowDialog();
Приведенный код создает объект frm класса frmPerson и выводит с помощью метода ShowDialog() форму добавления персоналии на экран. Указанная форма появляется в левом верхнем углу экрана, что не совсем удобно. Для того чтобы frmPerson выводилась по центру экрана изменим значение ее свойства «StartPosition» на «CenterScreen».
Пока форма frmPerson не осуществляет никакой обработки информации. Изменим это поведение. Добавим обработчик событий кнопке «Сохранить»:
DataBase db = new DataBase();
db.AddPerson(tbFam.Text, tbName.Text, tbOtch.Text, dTPDateBirth.Value.ToShortDateString());
Close();
Как видно процесс взаимодействия с базой данных осуществляется посредством метода AddPerson объекта db класса DataBase.
В настоящий момент невозможно обеспечить корректное добавление данных, т.к. пользователь может ввести пустые значения, и они будут добавлены в базу. Для решения этой проблемы дополним код кнопки, чтобы он стал следующим:
DataBase db = new DataBase();
if ((!string.IsNullOrEmpty(tbFam.Text)) && (!string.IsNullOrEmpty(tbName.Text)) && (!string.IsNullOrEmpty(tbOtch.Text)))
{
db.AddPerson(tbFam.Text, tbName.Text, tbOtch.Text, dTPDateBirth.Value.ToShortDateString());
Close();
}
else MessageBox.Show("Проверьте корректность ввода данных", "Ошибка!", MessageBoxButtons.OK, MessageBoxIcon.Error);
Позже мы немного изменим код кнопки «Сохранить». Добавим обработчик кнопки «Отмена» и впишем в него следующий код:
Сlose();
В настоящий момент данные успешно добавляются в базу, однако их отображение на главной форме не производится. Для решения указанной проблемы необходимо создать специальную функцию в коде главной формы и добавить ее вызов в событие Load:
// Получение данных персоналий
private void DataBindPersons()
{
DataBase db = new DataBase();
dGVPerson.DataSource=db.SelectPerson();
db = null;
}
private void frmPerson_Load(object sender, EventArgs e)
{
DataBindPersons();
}
Если все сделано правильно, то при запуске программы будет осуществляться загрузка данных и главная форма примет вид как показано на рис. 11. Добавим вызов функции DataBindPersons в конец кода функции кнопки «AddPerson».
Рис. 11 – Загрузка данных в элемент DataGridView
При назначении источника данных для DataGridView dGVPerson.DataSource=db.SelectPerson() и их поступлении в процессе работы программы осуществляется процесс автоматического добавления полей: id, Fam, Nam, Otch, DateBirth. Это в некоторой степени облегчает работу проектировщику, однако внешний вид приложения в таком случае остается довольно неприглядным. Изменим поведение и вид dGVPerson.
Сначала отключим автоматическую генерацию полей путем добавления следующей строчки кода в событие Load формы frmPerson:
dGVPerson.AutoGenerateColumns = false;
Добавим статические поля в dGVPerson. Для этого наведем курсор мыши в правый верхний угол dGVPerson и нажмем на появившийся значок, как показано на рис. 12. После этого появится меню, рис. 13.
Рис. 12 – Добавление полей в dGVPerson
Снимем галочки напротив пунктов меню: Enable Adding, Enable Editing, Enable Deleting. Далее нажимаем на кнопку Edit Columns. В появившемся окне представлены поля dGVPerson, колонка слева, и их свойства, колонка справа. Первоначально обе колонки кусты, т.к. никаких данных еще не добавлялось. Нажимаем на кнопку Add и появившееся окне, рис. 14, вводим название поля, его имя и тип. В нашем случае необходимо заполнить данными поля «Name», «Header text», например Col_id, id.
Рис. 13 – Меню dGVPerson
В соответствии со сказанным добавляем каждое из полей таблицы Person базы данных.
После того как все поля dGVPerson добавлены необходимо еще раз вызвать меню добавления полей и настроить для каждого источник данных, а именно установить значение поля DataPropertyName. Значение поля DataPropertyName должно повторять название поля в таблице Person базы данных. На рис. 14 показана установка значения поля DataPropertyName для колонки dGVPerson предназначенного для отображения фамилии.
После добавления полей установим значение поля AutoSizeColumnsMode в значение Fill. После этого ширина полей dGVPerson установится автоматически таким образом, чтобы полностью заполнить пространство DataGridView. Свойство SelectionMode dGVPerson установим в FullRowSelect.
Рис. 14 – Установка значения поля
DataPropertyName dGVPerson
Ранее мы добавили код кнопке «Добавить» и теперь продолжим разработку нашего программного приложения. Реализуем программный код кнопки «Удалить».
При нажатии кнопки «Удалить» необходимо определить ключ (id) удаляемой персоналии и передать его методу DeletePerson класса DataBase. Для того чтобы получить ключ (id) удаляемой записи нужно выполнить следующий код:
Int32 id = Int32.Parse(dGVPerson.SelectedRows[0].Cells[0].Value.ToString());
Выполнение приведенной строчки кода означает, что будет выполнено обращение к ячейке 0 (Cells[0]) строки 0 (SelectedRows[0]) выбранного массива строк.
Код кнопки «Удалить» должен иметь следующий вид:
if (MessageBox.Show("Вы действительно хотите удалить запись?", "Удаление", MessageBoxButtons.OKCancel, MessageBoxIcon.Question) == DialogResult.OK)
{
Int32 id = Int32.Parse(dGVPerson.SelectedRows[0].Cells[0].Value.ToString());
DataBase db = new DataBase();
db.DeletePerson(id);
db = null;
DataBindPersons();
}
Теперь программа может удалять и добавлять персоналии, но не может их редактировать. Рассмотрим особенности процесса редактирования.
Первая особенность заключается в том, что пользователь должен видеть данные, которые он редактирует. Для редактирования данных персоналий будет использоваться форма frmPerson, следовательно, необходимо передавать ей данные персоналии для отображения. Это осуществляется посредством полей public формы frmPerson (поля указанные ниже должны быть созданы в коде формы):
public Int32 id = 0;
public string Fam = string.Empty;
public string Name = string.Empty;
public string Otch = string.Empty;
public string DateBirth = string.Empty;
Добавим следующий код кнопки «Изменить»:
if (dGVPerson.SelectedRows.Count!= 0)
{
frmPerson frm = new frmPerson();
frm.id = Int32.Parse(dGVPerson.SelectedRows[0].Cells[0].Value.ToString());
frm.Fam = dGVPerson.SelectedRows[0].Cells[1].Value.ToString();
frm.Name = dGVPerson.SelectedRows[0].Cells[2].Value.ToString();
frm.Otch = dGVPerson.SelectedRows[0].Cells[3].Value.ToString();
frm.DateBirth= dGVPerson.SelectedRows[0].Cells[4].Value.ToString();
frm.ShowDialog();
}
else
MessageBox.Show("Ошибка!", "Нет персоналии для редактирования", MessageBoxButtons.OK, MessageBoxIcon.Error);
Для того, чтобы данные редактируемой персоналии отображались на форме frmPerson необходимо добавить в событие Load этой формы следующее:
if (this.id!= 0)
{
tbFam.Text = this.Fam;
tbName.Text = this.Name;
tbOtch.Text = this.Otch;
dTPDateBirth.Value = DateTime.Parse(this.DateBirth);
}
Так как кнопка «Сохранить» формы frmPerson одновременно используется для добавления и редактирования данных необходимо изменить ее код на следующий:
if (dGVPerson.SelectedRows.Count!= 0)
{
frmPerson frm = new frmPerson();
frm.id = Int32.Parse(dGVPerson.SelectedRows[0].Cells[0].Value.ToString());
frm.Fam = dGVPerson.SelectedRows[0].Cells[1].Value.ToString();
frm.Name = dGVPerson.SelectedRows[0].Cells[2].Value.ToString();
frm.Otch = dGVPerson.SelectedRows[0].Cells[3].Value.ToString();
frm.DateBirth = dGVPerson.SelectedRows[0].Cells[4].Value.ToString();
frm.ShowDialog();
DataBindPersons();
}
else
MessageBox.Show("Ошибка!", "Нет персоналии для редактирования", MessageBoxButtons.OK, MessageBoxIcon.Error);