Продолжаем закреплять полученные знания о таблицах и кнопках и дорабатываем проект “Библиотека” v.2.1
Требования заказчика
Доработать проект Библиотека v.2.1:
- увеличить размер шрифта в таблицах
- сделать формы редактирования для справочников
Проектирование
В нашем случае требования заказчика очень простые и конкретные, они касаются только внешнего вида приложения и не затрагивают структуры данных. По функциональности проект переводится с непосредственного редактирования в таблицах на редактирование через формы. И эти затраты вполне себя оправдают в случае, если справочники будут постоянно дорабатываться, а в нашем учебном проекте это будет происходить всё время.
В проекте добавляются ещё две формы: форма редактирования справочника авторов и форма редактирования справочника жанров. А на формах самих справочников необходимо разместить кнопки для вызова этих форм в режиме вставки и удаления данных, а также для удаления записей.
🔨 Внесите данную информацию в проектную документацию.
Новые формы
Добавьте в проект две формы, установите для них свойства согласно таблице 1.
🔨 Добавьте в проект две формы. Задайте значения ключевым свойствам форм:
| Свойство | Форма_1 | Форма_2 | Примечание |
|---|---|---|---|
| Name | efmAuthor | efmGenre | efm – аббревиатура от edit form (форма редактирования). |
| Caption | Автор | Жанр | Заголовок формы редактирования обычно совпадает с заголовком справочника, но с названием в единственном числе |
| Width | 240 | 240 | |
| Height | 95 | 95 | |
| BorderIcons.Minimize | False | False | Убираем кнопку минимизации из заголовка формы. |
| ShowOnTaskbar | False | False | При отображении формы на панели приложений не будет появляться отдельная иконка для формы, будет только иконка приложения (основной формы). |
📝 Базовую информацию о форме и её свойствах можно найти в первом проекте.
На каждую форму добавьте компоненты: поле ввода текста и две кнопки. Рассмотрим подробней создание формы редактирования автора.
Нажмите кнопку добавления новой формы (1) и укажите название формы (efmAuthor). Затем разместите на форме поле ввода текста (2), и добавьте две кнопки (3).
🔨 Настройте свойства поля ввода текста для формы edtAuthor:
| Свойство | efmAuthor | efmGenre | Примечание |
|---|---|---|---|
| Name | edtName | edtName | |
| TableName | author | genre | |
| FieldName | name | name | |
| Font.Size | 11 | 11 | Увеличим размер отображения данных с 9 до 11 пунктов |
| Top | 16 | 16 | |
| Left | 8 | 8 | |
| Width | 225 | 225 | |
| Height | 28 | 28 | Высота компонента устанавливается автоматически при редактировании свойства Font.Size |
| TextHint | Фамилия и инициалы | Название жанра |
📝 Базовую информацию о поле ввода и его свойствах можно найти в разделе “Ввод чисел и текста“
🔨 Настройте свойства у кнопок формы edtAuthor.
| Свойство | Кнопка_1 | Кнопка_2 | Примечание |
|---|---|---|---|
| Name | btnSave | btnCancel | |
| Caption | Сохранить | Отменить | |
| Action | [Сохранить запись] | [Закрыть форму] | |
| Icon | Save | Cancel | |
| Top | 61 | 61 | |
| Left | 32 | 136 | |
| Width | 97 | 97 | |
| Height | 25 | 25 | |
| Anchors | [Right,Bottom] | [Right,Bottom] | Привязка кнопок к нижнему правому углу в дальнейшем позволит увеличить форму редактирования с сохранением правильного положения кнопок. |
📝 Базовую информацию о кнопке и её свойствах можно найти в разделе “Волшебная кнопка MVDB“
При настойке свойства Action кнопки btnSave в окне мастера настройки укажите те элементы редактирования, данные из которых должны быть сохранены (в нашем случае это единственный компонент edtName), а также таблицу, в которую нужно записать результат (author). Для формы edtAuthor это будет выглядеть так:
☝ Внимательно следите за тем, чтобы имя таблицы для сохранения совпадало со свойствами TableName элементов редактирования, которые вы включили в список.
🔨 Аналогичным образом создайте и настройте компоненты на форме efmGenre.
☝ Для формы frmGenre выберите таблицу genre.
📝 Чтобы не редактировать все свойства для компонентов на форме edtGenre, после завершения создания формы edtAuthor скопируйте компоненты в буфер обмена а затем вставьте на форму edtGenre.
Формы справочников
На форме справочников необходимо отредактировать свойства компонента табличного представления данных: отменить редактирование в таблице и сместить саму таблицу чуть ниже. Также нужно увеличить размер шрифта и размер сетки.
🔨 Задайте новые значения свойствам таблицы frmAuthor.tgrAuthor и frmGenre.tgrGenre:
| Свойство | Значение | Примечание |
|---|---|---|
| Top | 25 | 25 пикселей выделим для кнопок… |
| Height | 275 | …и уменьшим высоту таблицы на 25 пикселей |
| Font.Size | 11 | Размер шрифта увеличим на 2 пункта |
| DefaultRowHeight | 22 | А размер сетки – на 4 пикселя |
| HeaderSize | 22 | Увеличим размер заголовка |
| FooterSize | 22 | Размер подвала тоже увеличим. Он сейчас не нужен, но если он понадобится, размер будет соответствовать размеру шрифта |
| Editable.AllowCreate | false | Отключаем редактирование внутри таблицы |
| Editable.AllowEdit | false | |
| Editable.AllowDelete | false |
📝 Базовую информацию о таблице и её свойствах можно найти в разделе “Отображение табличных данных“
Для таблицы на главной форме мы тоже увеличим размер шрифта, но соответствующую форму редактирования сделаем в следующий раз.
🔨 Задайте новые значения свойствам Font.Size, DefaultRowHeight, HeaderSize и FooterSize для таблицы frmMain.tgrBook
Кнопки
На форме справочников нам понадобятся три кнопки: для добавления, редактирования и удаления записей.
🔨 Добавьте на форму frmAuthor три кнопки. Задайте значения свойствам кнопок:
| Свойство | Кнопка_1 | Кнопка_2 | Кнопка_3 | Примечание |
|---|---|---|---|---|
| Name | btnNew | btnEdit | btnDelete | |
| Caption | Надпись на кнопке не понадобится, будем использовать картинки и подсказки | |||
| icon | New | Edit | Delete | |
| imageAlignment | iaCenter | iaCenter | iaCenter | |
| Hint | Добавить | Редактировать | Удалить | |
| ShowHint | true | true | true | |
| Width | 25 | 25 | 25 | |
| Height | 25 | 25 | 25 | |
| Top | 0 | 0 | 0 | |
| Left | 0 | 25 | 50 | |
| Actions | [НОВАЯ ЗАПИСЬ] | [ПОКАЗАТЬ ЗАПИСЬ] | [УДАЛИТЬ ЗАПИСЬ] |
Новая запись
При настройке Action = [НОВАЯ ЗАПИСЬ] необходимо указать форму редактирования:
🔨 Для кнопки frmAuthor.btnNew укажите форму efmAuthor, а для кнопки frmGenre.btnNew укажите форму efmGenre.
Редактирование записи
При настройке Action = [ПОКАЗАТЬ ЗАПИСЬ] необходимо указать форму редактирования, а также таблицу, к которой будет привязываться кнопка редактирования:
☝ Если вы привязали кнопку редактирования к таблице, то при двойном клике по таблице будет открываться указанная в настройках кнопки форма редактирования.
🔨 Для кнопки frmAuthor.btnEdit укажите форму efmAuthor и компонент таблицы tgrAuthor, а для кнопки frmGenre.btnEdit укажите форму efmGenre и компонент таблицы tgrGenre.
Удаление записи
При настройке Action = [УДАЛИТЬ ЗАПИСЬ] необходимо указать таблицу, к которой будет привязываться кнопка удаления:
☝ Отключение подтверждения перед удалением может понадобиться, если такой запрос вы делаете самостоятельно с помощью скриптов. В других случаях отключать подтверждение не рекомендуется, так как восстановить удаленные по ошибке данные невозможно.
🔨 Для кнопки frmAuthor.btnDelete укажите компонент таблицы tgrAuthor, а для кнопки frmGenre.btnDelete укажите компонент таблицы tgrGenre.
Подведение итогов
За несколько минут вы модифицировали проект, добавив несколько форм редактирования и настроив кнопки для их правильного функционирования.
Приложение теперь выглядит лучше, но перед тем как создать форму редактирования книги, нам потребуется изучить новые компоненты.