Размещено на http://allbest.ru

Федеральное государственное автономное образовательное учреждение высшего профессионального образования

Национальный исследовательский университет

«Высшая школа экономики»

Факультет экономических наук

Московский институт электроники и математики им. А.Н. Тихонова

Выпускная квалификационная работа

Разработка программного обеспечения для создания инструментов работы с изображениями

по направлению 09.03.01 Информатика и вычислительная техника

Студент: Солодченков Николай Андреевич

Руководитель А.С. Топоркова

к.т.н‚‚ доцент ДКИ МИЭМ им. А.Н. Тихонова

Москва 2019 г.



Аннотация

В данной работе описывается разработка программного обеспечения для подсвечивания участков изображений и добавления к ним подписей, имеющая возможность работы с базой данных. Целями данной работы являются: сокращение расходов организации, пользующейся данной программой за счет упрощения нахождения выделенных элементов, улучшение навыков работы с базами данных и получение навыков работы c языком программирования Delphi и средой разработки Embarcadero RAD Studio. Необходимое программное обеспечение было разработано, а цели - достигнуты.

В данной работе содержится 14 иллюстраций, 1 таблица и 3 использованных источника.



Abstract

This work depicts development of software for highlighting image areas and adding captions to them, with the capabilities of working with the database. The main goals of this research are reducing the costs for an organization using this program by simplifying the finding of selected elements, improving the skills of working with databases and gaining skills in the Delphi programming language and the Embarcadero RAD Studio development environment. The necessary software was developed, and the goals were achieved.

This work contains 14 illustrations, 1 table and 3 used sources.



Оглавление

Введение

1. Подготовка к разработке

1.1 Обзор аналогов

1.2 База данных

1.3 Язык Delphi и Embarcadero RAD Studio

2. Разработка

2.1 Файлы

2.2 Графический интерфейс

2.2.1 Главное окно

2.2.2 Окно настройки настроек подключения к базе данных

2.2.3 Окно загрузки из базы данных

2.2.4 Окно сохранения проекта в базу данных

2.3 Алгоритмы

2.3.1 Загрузка изображений из файлов на компьютере и из базы данных

2.3.2 Выделение и подсвечивание элементов. Начальная точка

2.3.3 Проблемы загрузки изображений

2.3.4 Изменения размера изображений

2.3.5 Список элементов, создание выделения и точки начального контакта

2.3.6 Загрузка проекта в базу данных

2.3.7 Нахождение элемента на картинке по нажатию

2.3.8 Поиск

2.3.9 Слайд шоу

3. Тестирование

Заключение

Список литературы



Введение

В настоящее время компьютерные технологии распространились повсюду, переплетаясь практически с каждым аспектом жизни людей. Исключением не стала и проектная деятельность.

Сложно представить себе работу над каким бы то ни было проектом без использования программного обеспечения.

Однако, в случаях работы над несколькими и/или большими проектами можно легко забыть, где должна была быть та или иная деталь.

Для примера, элементы на большой печатной плате.

В данном случае может помочь программа, предназначенная для выделения участков изображений с добавлением к ним подписей и занесением их в список выделенных элементов данного изображения или группы изображений.

Такая программа существует и называется АС3_111_хе22, однако её пользователи жалуются из-за двух недостатков: во-первых, данная программа использует для выделения выбранного элемента только бирюзовый прямоугольник, который на большой схеме бывает сложно найти, во-вторых, из-за отсутствия механизма изменения размеров изображения, с которым ведётся работа, работа с большими изображениями также становится осложнена.

В данной работе описывается реализация подобной программы, но с использованием подсвечивания выделенной области в качестве предполагаемого метода решения данной проблемы.

Выделенную с помощью подсвечивания область должно быть лучше видно из-за большего контраста относительно всего остального изображения. Также планируется добавить механизмы изменения размеров изображения для более комфортной работы.

Благодаря данным функциям время на поиск выбранного компонента должно сократиться, что может сократить небольшую часть расходов организации, использующей разработанную программу.

Целями данной работы являются:

· решение обозначенной выше проблемы путём разработки программного обеспечения, имеющего необходимый набор функций;

· улучшение навыков работы с базами данных;

· получение навыков работы с языком программирования Delphi и средой разработки Embarcadero RAD Studio.

Для выполнения поставленных целей требуется выполнить следующие задачи:

· установка и настройка сервера базы данных для проверки работы программы с базами данных;

· получение навыков работы с языком программирования Delphi и средой разработки Embarcadero RAD Studio;

· создание графического интерфейса для разрабатываемой программы;

· реализация функции загрузки изображений необходимых форматов в программу из файла и из базы данных;

· реализация функции выделения и подсвечивания выделенных участков (элементов) на изображении, а также функции выделения точки начального контакта;

· реализация функции изменения размера изображения под размер окна показа изображения;

· реализация функции загрузки координат выделенных областей, их описаний и координат точек начального контакта элементов из базы данных;

· реализация загрузки проекта, состоящего из описания проекта, от нуля до двух изображений и списка элементов, принадлежащих каждому из изображений;

· реализация функции нахождения выделенного элемента при нажатии на изображение;

· реализация функции поиска по названию или описанию элемента;

· реализация функции слайд шоу;

· тестирование системы.



1. Подготовка к разработке

1.1 Обзор аналогов

Из-за необычности набора используемых функций прямых аналогов разработанной программы практически нет, не считая программы АС3_111_хе22, преодоление недостатка которой является одной из целей данной работы.

Сравнение аналогов с разрабатываемой программой будет производиться по следующим критериям:

· возможность выделения и добавления подписи к выделенному участку изображению;

· возможность подсвечивания выделенного участка;

· возможность выделения участков изображений произвольными формами;

· возможность составления интерактивного списка выделенных участков;

· возможность интерактивного выбора элемента на изображении;

· возможность приложения загрузить изображение и координаты выделенных областей в базу данных;

· возможность проведения слайд-шоу.

Ниже представлена сравнительная таблица 1, кратко описывающая содержание последующих абзацев.

Таблица 1

Сравнительная таблица аналогов программ

Критерий	Аналог 1	Аналог 2	Аналог 3	Модернизируемая программа	Разработанная программа
Выделение и добавления подписи	±	+	+	+	+
Подсвечивание выбранного участка	-	±	-	-	+
Выделение произвольными формами	+	+	+	-	-
Составление интерактивного списка	-	±	+	+	+
Работа с базами данных	-	-	-	+	+
Проведение слайд-шоу	-	-	-	+	+

Первый аналог - программа Microsoft Paint и аналогичные ей. Единственный способ в ней выделить участок изображения и подписать его заключается в нанесении выделения и текста на само изображение, что может оказаться неудобно и даже трудно для чтения при большой плотности выделяемых элементов.

Одним из плюсов является возможность использования произвольных форм и разных цветов. Возможностей подсвечивания выбранного участка изображения, составления интерактивного списка, выбора элемента на изображении, работы с базой данных и проведения слайд-шоу нет.

Второй аналог - Adobe Photoshop и аналогичные ему. Здесь присутствует возможность добавления выделения, подсвечивания выделенной области, добавления подписи и составления интерактивного списка выделенных участков изображения, но это всё можно сделать только посредством довольно сложного использования слоёв и средств рисования, тогда как в разрабатываемой программе данные манипуляции выполняются гораздо проще.

Возможностей выбора элемента на изображении, работы с базой данных и проведения слайд-шоу нет.

Третий аналог - программа HTML Map Designer и аналогичные ей. Map - инструмент языка HTML, позволяющий выделять участки изображений и делать из них ссылки и добавлять им подписи, появляющиеся при наведении. Программы вроде HTML Map Designer упрощают работу с map.

Одним из плюсов данного аналога является возможность использования данного изображения с выделяемыми участками на веб-платформе, однако реализация, подходящая под все описанные выше критерии будет слишком трудозатратна.

При работе внутри программы HTML Map Designer составляется список выделенных областей и есть возможность интерактивного выбора элементов на изображении, которые не обязательно делать ссылкой. Возможностей работы с базой данных и проведения слайд-шоу нет.

Четвёртый аналог - программа, создание новой версии которой и производится в данной работе. Это программа по классификации организации называется АС3_111_хе22.

Данная программа обладает всеми необходимыми возможностями, кроме одной, которую и планируется реализовать в данной работе, - подсвечивания выбранных областей.

Ниже соответственно представлены снимок экрана существующей программы с простым выделением выбранной области изображения и отредактированный снимок экрана, иллюстрирующий подсвечивание выбранной области (Рисунок 1, Рисунок 2).

Рисунок 1. Снимок экрана существующей программы с простым выделением выбранной области изображения.



Рисунок 2.Отредактированный снимок экрана, иллюстрирующий подсвечивание выбранной области изображения.

Из приведённых сравнений можно сделать вывод, что программ с необходимым набором функций на данный момент нет, а значит, есть необходимость её создания.

1.2 База данных

Пример структуры базы данных для работы с данным приложением был предоставлен организацией, использующей АС3_111_хе22.

Для работы с данной базой данных был создан локальный сервер на базе Microsoft SQL Server версии 12.2.5207, а также была установлена программа Microsoft SQL Server Management Studio для управления базой данных в случае отладки работы разрабатываемого приложения.

На данном сервере дополнительно была установлена авторизация через учётную запись пользователя Windows.

После установки необходимого программного обеспечения база данных была восстановлена из предоставленного файла резервного копирования, на котором находился один пример сохранённых данных.



Далее было проведено изучение структуры базы данных: имеющихся полей и взаимосвязей между таблицами.

Структура таблиц данной базы данных изображена на рисунке 3.

Рисунок 3. Структура таблиц предоставленной данной базы данных.

В главной таблице MainTable хранятся: идентификатор проекта в столбце ID, два изображения в столбцах FileImageSide1 и FileImageSide2 соответственно «слоям» 1 и 2 проекта, и описание проекта в столбце Comments. Таблица PicturesToElements обеспечивает взаимосвязь между идентификатором проекта в столбце idPicture и идентификатором элемента в столбце idElement для обеспечения связи «один-ко-многим» между проектом и элементами. В таблице ElementsDescription в столбец id записывается идентификатор элемента, а в столбец descr его описание. В таблице Elements в столбце ID также находится идентификатор элемента, в столбце ElementName - название, в столбцах TopX, TopY, BottomX и BottomY находятся соответственно координаты X и Y верхней левой точки и правой нижней точки прямоугольника выделения элемента. В столбцах RedPointX и RedPointY находятся координаты точки начального контакта. В столбце Side находится указание принадлежности элемента к первому или второму «слою» изображения проекта.

Стоит отметить несколько особенностей записываемых в данную базу данных. Все столбцы, кроме тех, в которых содержатся идентификаторы, могут содержать значение Null, то есть соответствовать пустым полям. Идентификаторы создаются с помощью функции языка SQL newid( ) и имеют тип uniqueidentifier, то есть при создании являются уникальными для данной базы данных. Значения столбцов TopX, TopY, BottomX, BottomY, RedPointX и RedPointY являются целочисленными, а столбцов Comments, descr, ElementName и Side - строковыми.

1.3 Язык Delphi и Embarcadero RAD Studio

Для подготовки к работе с языком программирования Delphi и средой разработки Embarcadero RAD Studio были использованы:

· книга «Delphi. Полное руководство» Михаила Сухарева [1];

· Курс менеджера по продукции Delphi Ника Ходжеса (Nick Hodges) «Thirty Camtasia Demos in Thirty Days» [2];

· сайт «Справочник - "Основы Delphi"» deplhibasics.ru [3].

Курс Ника Ходжеса был необходим для быстрого изучения основ работы с Delphi и RAD Studio, книга «Delphi. Полное руководство» и сайт «Справочник - "Основы Delphi"» использовались в качестве справочного материала.



2. Разработка

2.1 Файлы

Исходный код данного проекта содержится в 6 файлах:

· Main.pas, для описания большей части алгоритмов работы главного окна;

· dbimageloadingform.pas, для алгоритмов работы окна загрузки из базы данных;

· imageloading.pas, для алгоритма загрузки изображений разных форматов из базы данных;

· SettingsWingow.pas, содержащий алгоритмы работы окна настроек подключения к базе данных;

· alphadrawing.pas, содержащий алгоритмы рисования выделения элементов на изображениях.

2.2 Графический интерфейс

2.2.1 Главное окно

На рисунке 4 изображено главное окно программы. С помощью элементов TPanel и TSplitter на нём сгруппированы все необходимые элементы управления. На главном окне присутствуют два не визуальных компонента. Первый - объект класса TMainMenu, который необходим для создания и отображения полосы меню, расположенной сверху. Второй - объект класса TOpenPictureDialog для загрузки изображений с компьютера.

В нижнем правом углу находится компонент TabControl, необходимый для переключения «слоёв» изображений, внутри каждого слоя находится компонент TScrollBox, необходимый для отображения полос прокрутки при выводе изображений, превышающих размер TScrollBox.



Рисунок 4. Внешний вид главного окна.

Внутри обоих TScrollBox находятся по три компонента TImage: ImageXMain, скрытый, необходим для хранения исходного изображения «слоя», ImageXOverlay, необходимый для вывода изображения в его текущем состоянии (с выделением элементов или без), и ImageXDrawing, необходимый для отображения процесса выделения элемента, где X - 0 или 1 согласно номерам «слоев» 1 и 2.

Слева находится элемент TStringGrid, отображающий список элементов в виде таблицы, ниже находится строка поиска элементов.

Над таблицей находятся кнопки класса TBitBtn для добавления элемента в список, для удаления выбранного элемента, кнопка удаления выделения элемента, кнопка включения режима рисования точки начального контакта, кнопка удаления точки начального контакта, кнопка включения режима презентации и поле TEdit для ввода продолжительности задержки во время режима презентации на одном компоненте в секундах.

В верхнем левом углу находится панель класса TTrackBar с ползунком изменения силы затемнения при подсвечивании выделенного элемента, флажком TCheckBox для включения затемнения при выделении компонента и кнопкой TButton для снятия выделения.

Правее находится панель с переключателем TComboBox варианта увеличения изображения, флажком TCheckBox для включения автоматической фокусировки окна отображения изображения на выбранном элементе и кнопка TButton для сортировки элементов по названию. Далее находится панель с полем TRichEdit для изменения описания проекта, над которым в скрытом состоянии находится строка отображения состояния сохранения проекта и описание панели, реализованный с помощью компонентов TLabel. программа язык изображение подсвечивание

У перечисленных выше кнопок настроены всплывающие подсказки с описанием выполняемого кнопками действиями.

2.2.2 Окно настройки параметров подключения к базе данных

На рисунке 5 изображено окно настройки подключения к базе данных.

При открытии формы происходит считывание файла настроек соединения с базой данных, и, если этот файл не обнаружен, то он создаётся с настройками по умолчанию.

Рисунок 5. Внешний вид окна настроек подключения к базе данных

На нём находятся три элемента TEdit для изменения имени сервера, к которому будет производиться подключение, для изменения имени базы данных, к которой происходит подключение и размера пакета. При открытии формы возможность изменения параметров выключена, для предотвращения случайного изменения.

Технически, параметров подключения к базе данных больше, но необходимости изменять остальные нет.

Над строками изменения находятся компоненты TLabel для описания изменяемых компонентов. Справа находятся флажки TCheckBox для включения возможности изменения параметров. Ниже находится кнопка TButton для сброса настроек сервера к исходным параметрам, прописанным как отдельные константы в файле SettingsWindow.pas. При нажатии на неё флажки изменения переводятся во включённое состояние, а строки заполняются согласно параметрам по умолчанию.

Правее находится кнопка проверки соединения с параметрами, которые уже установлены и введенными в поля выше, если активирован соответствующий флажок.

Под кнопкой сброса в скрытом состоянии находится компонент TLabel, на который выводится состояние подключения. Пока происходит проверка соединения в строку состояния выводится сообщение «Обработка...», если соединение с текущими параметрами не удалось, выводится «Ошибка соединения» текстом красного цвета, если удалось - «Соединение прошло успешно» зеленого цвета.

В нижнем правом углу окна находится кнопка TButton «Выход», при нажатии на которую пользователю предлагается сохранить изменения настроек соединения с базой данных. Если пользователь соглашается, то при помощи класса TextFile производится запись настроек в файл, находящийся в каталоге с исполнительным файлом. Имя данного файла является отдельно вынесенной константой.



2.2.3 Окно загрузки из базы данных

На рисунке 6 изображено окно загрузки изображений, описаний проектов и элементов, принадлежащих изображениям из базы данных.

Рисунок 6. Внешний вид окна загрузки из базы данных в редакторе

Сверху находится строка состояния соединения с базой данных выполненная как элемент класса TLabel. При показе формы запускается считывание настроек соединения с базой данных из файла и происходит проверка состояния соединения, результат которой будет выведен в данную строку. Если файл настроек не обнаружен, то происходит создание файла с настройками по умолчанию.

Далее по центру формы находится интерактивная таблица, выполненная с помощью компонента DBGrid, содержащая список существующих проектов, отображающая для них поля «ID» и «Comments» из таблицы MainTable базы данных как «Идентификатор» и «Описание» соответственно. При выборе строки проекта в данной таблице изображения в уменьшенном виде выводятся в соответствующие номерам сторон окошки ниже, реализованные с помощью компонентов TImage. Между таблицей и изображениями находится строка для поиска по описанию проекта или по идентификатору.

Под изображениями находятся элементы TCheckBox для подтверждения загрузки элементов, принадлежащих выбираемому изображению, и для подтверждения загрузки описания проекта, для замены текущего.

Внизу расположены кнопки TButton для загрузки изображения 1, 2 или обоих, при нажатии на которые происходит проверка необходимости загружать элементы и описание проекта, после чего идёт загрузка выбранных элементов в проект. Стоит также отметить, что, если в выбранном в таблице проекте отсутствует одно из двух изображений, окно отображения соответствующего изображения ниже очищается, а кнопка загрузки становится неактивной.

Для вывода списка проектов в таблицу с помощью компонентов ADO была настроена работа с базой данных, расположенной на локальном сервере под управлением Microsoft SQL Server. Компоненты ADO - это компоненты, реализующие технологии стандартного обращения к реляционным структурам данных от Microsoft. С помощью компонента ADOConnection1 было настроено подключение к базе данных с аутентификацией по логину пользователя в Windows.

С помощью компонента ADOTable1 была выбрана таблица в базе данных с проектами MainTable. И с помощью компонентов ADODataSet1 и компонента DataSource1 полученные данные были преобразованы для отображения в подходящем для вывода виде. После преобразования данные отображаются в таблице.

Вторая группа компонентов ADO: ADOConnection2, ADODataSet2 и DataSource2 используется для загрузки списка элементов.



2.2.4 Окно сохранения проекта в базу данных

На рисунке 7 отображен внешний вид окна сохранения проекта в базу данных. Сверху находится строка состояния соединения с сервером, работающая так же, как и в окне загрузки из базы данных.

Рисунок 7. Внешний вид окна сохранения в базу данных в редакторе

Ниже находятся три кнопки TButton для загрузки текущего проекта как нового, как проект с идентификатором проекта, записанного у первого изображения, и как проект с идентификатором проекта, записанного у второго изображения. Если идентификаторы у первого и второго изображений совпадают, то третья кнопка скрывается, а название второй меняется на «Проект изображений на слоях 1 и 2». Взаимодействие с базой данных обеспечивается за счёт компонентов ADOConnection3 и ADOQuery3. В нижнем правом углу находится кнопка выхода.

2.3 Алгоритмы

2.3.1 Загрузка изображений из файлов на компьютере и из базы данных

Согласно заданию на выполнение выпускной квалификационной работы, было необходимо организовать работы с тремя форматами файлов: PNG, BMP, JPEG. Для загрузки изображений в главное окно из промежуточного хранилища из базы данных или из файла происходит с помощью специально написанной функции loadimagetomainwindow. Данная функция предназначена для корректной обработки загрузки изображений, для установки соответствующих значений переменных, связанных с проектом и для следования парадигме объектно-ориентированного программирования. Изображения загружаются в ImageXMain, после чего переносятся в ImageXOverlay.

Загрузка изображения из файла на выбранный «слой» проходит по нажатию кнопки в выпадающем меню «Загрузить» -> «Изображение с компьютера» благодаря компоненту TOpenPictureDialog, отредактированному для поддержки только указанных форматов файлов. При выполнении данного компонента запускается стандартное окно операционной системы Windows для загрузки файлов, и, если пользователь выбрал подходящее изображение, запускаются проверки наличия изображения на выбранном «слое». Если изображение есть, то пользователь увидит диалоговое окно с предложением заменить существующую картинку. Если пользователь согласился или если изображения не было, то запускается с соответствующими параметрами функция loadimagetomainwindow.

Загрузка из базы данных происходит с помощью соответствующего окна, запускаемого по нажатию кнопки в выпадающем меню «Загрузить» -> «Из базы данных». В данном окне после установки соединения с базой данных все строки таблицы MainTable в таблицу DBGrid. По нажатию строки с проектом пользователь увидит миниатюры имеющихся изображений в соответствующих окошках. В них изображения загружаются с помощью функции, которая сначала загружает поле абстрактных данных TBlobField в поток памяти TMemoryStream, определяет формат изображения по первым четырем байтам в данном потоке памяти, а затем загружает соответствующим формату способом из потока памяти в класс изображения TGraphic.

По нажатию одной кнопок загрузки одного из изображений оно из окошка показа записывается в переменную - временное хранилище, если был отмечен флажок на загрузку описание, то оно загружается в соответствующую временную переменную для последующей записи в окошко на главном окне, если был отмечен флажок на загрузку элементов, то запускается функция loadElements с параметром, соответствующим выбранной стороне. Данная функция с помощью второй группы элементов ADO загружает список элементов следующим образом. С помощью ADODataSet2 выполняется SQL запрос к базе данных, для получения списка необходимых элементов со всеми необходимыми данными о них. Строка для выполнения запроса имеет следующий вид:

sqlString := 'select idElement, ElementName, TopX, TopY, BottomX, BottomY, RedPointX, RedPointY, Side, descr ' + 'from dbo.PicturesToElements join dbo.Elements on idElement = dbo.Elements.ID ' + 'join dbo.ElementsDescription on idElement = dbo.ElementsDescription.id where idPicture = ''' + DBGrid1.Datasource.DataSet.FieldByName('ID').AsString + ''' and Side = ''' + sideNeeded.ToString + ''' order by ElementName;'

После получения результата данного запроса данные записываются в динамический массив элементов класса TElementsDescription, созданного для хранения данных об элементах и описанного на скриншоте на рисунке 8.

Рисунок 8. Класс TElementsDescription.

При завершении загрузки изображения и опциональных списка элементов и описания проекта окно загрузки из базы данных закрывается, производится проверка наличия изображения на выбранном слое, и, если какое-либо изображение уже было загружено ранее, пользователю предоставится выбор заменить уже имеющееся изображение или нет. При выборе загрузки описания проекта или списка элементов пользователю также предоставляется выбор заменить уже существующие значения или нет. Изображение загружается на главное окно с помощью функции loadimagetomainwindow с соответствующими параметрами.

При нажатии кнопки загрузки обоих изображений происходит примерно та же последовательность, только запуск функции loadimagetomainwindow производится дважды и из текущего окна, а не из главного окна.

2.3.2 Выделение и подсвечивание элементов. Начальная точка

Алгоритмы для выполнения данных функций описаны в файле alphaimage.pas. Для реализации предполагалось использовать один из двух вариантов реализации. Первый - создание полупрозрачного изображения с выделением и расположение этого изображения в отдельной форме поверх формы с исходным изображением. Второй - «смешивание» цветов на изображении, то есть, по сути, рисование на нём с использованием полупрозрачности.

Для реализации первого метода предполагалось использовать цвета с альфа-каналом, однако без сторонних библиотек реализовать это в Delphi не удастся. Следующей попыткой реализовать первый вариант было попиксельное рисование через один закрашенных черным и закрашенных прозрачным пикселей, разумеется внутри рамки выделения предполагалось использовать только прозрачные пиксели. У битовых карт (bitmap), единственного формата изображений, на котором получалось реализовать подобное рисование, есть свойство, позволяющее сделать выбранный цвет полностью прозрачным. Предполагалось, что такая реализация будет выглядеть похоже на затемнение и быстро выполняться. На статичной картинке выглядело не так плохо, однако при попытке сдвинуть изображение в сторону ползунком прокрутки начиналось сильное мерцание изображения. Скорость выполнения тоже оставляла желать лучшего, для изображения 700х400 процедура рисования занимала около больше двух секунд, что, при поставленной цели увеличить скорость работы с приложением, было заметной проблемой.

Для реализации второго метода была использована функция AlphaBlend, позволяющая рисовать прямоугольники с выбранного цвета с выбранным уровнем прозрачности. На выполнение выделения с подсвечиванием и постановкой точки начального контакта с помощью прямоугольников требует девять запусков данной функции, и все девять запусков несмотря на мои предположения, выполнялась практически мгновенно и обработанные изображения выглядели как и требовалось. В результате для реализации был выбран второй метод, были созданы функции drawWithHighlight и drawWithoutHighlight, первая из которых необходима для выделения элемента с подсвечиванием и на вход получает значение ползунка силы затемнения, а вторая необходима только для выделения элемента. Также эти две функции могут рисовать начальные точки. В данных функциях происходит создание отдельной переменной битовой карты типа TBitmap, на который переносится исходное изображение (так как это переменная PicToDrawFrom, TGraphic, может переносится любое, но в используемом алгоритме берется изображение из ImageXMain), затем выполняются функции рисования, заданное конечное изображение (переменная PicToDrawOn, TPicture) стирается и на его место записывается данная битовая карта, после чего переменная битовой карты освобождается. Цвет рамки выделения был выбран бирюзовый (clAqua), цвет затемнения - черный, цвет начальной точки - красный, как в исходной программе. Толщина линий была выбрана 3 пикселя, размер точки - 9 пикселей, такие параметры обеспечивают достаточную видимость и достаточно небольшие размеры, чтобы не перекрывать слишком большую часть изображения. Также стоит отметить, что в данных функция предусмотрена перемена мест координат, если, например, пользователь рисовал справа-налево и/или снизу-вверх.

2.3.3 Проблемы загрузки изображений

Так как используется три разных формата изображения, а рисование возможно только на одном из них, а также два из трех форматов могут быть изображениями с полной и полупрозрачностью одной из проблем было найти способ записи изображений всех трех форматов с минимальными искажениями и напрямую в главное окно и при работе с функцией выделения элементов, которая для работы должна преобразовывать изображения в битовую карту. Для записи в главное окно были использованы варианты:

· с использованием метода TPicture.Assign(ImageXMain.Picture);

· с использованием преобразования исходного изображения в битовую карту с 32-х битным форматом пикселей;

· с использованием преобразования исходного изображения в битовую карту без принудительного преобразования к 32-х битному формату пикселей.

Для изображения, проходящего через функцию рисования выделения элементов были использованы следующие варианты:

· использование метода TBitmap.Assign(ImageXMain.Picture);

· с использованием преобразования битовой карты к формату с 32-х битными пикселями и последующим нанесением на данную битовую карты с помощью функции StretchDraw;

· с использованием только функции StretchDraw.

При использовании различных сочетаний данных вариантов, а также при разных значениях флажка Transparent у ImageXOverlay, возникали различные ошибки, например, бесцветное выделение элементов, проблемы с прозрачностью фона на полупрозрачных изображениях, отсутствие элементов затемнения на прозрачных частях и так далее. В итоге для загрузки в главное окно был выбран первый вариант, а для загрузки в функцию рисования выделения элементов - третий, и значение флажка Transparent равное False, так как при данной комбинации методов проблем с изображениями возникло меньше всего.

2.3.4 Изменения размера изображений

Как одно из требований к данной программе было обеспечение уменьшения размеров изображений под размер окна показа изображений. В данной программе оно выполнено с помощью выбора одного из вариантов из соответствующего меню: полный размер изображений, уместить по ширине, уместить по высоте, уместить по ширине и высоте. Названия, говорящие сами за себя. При изменении размера у компонентов ImageXOverlay, хранящих отображаемое пользователю изображение, включается флажок AutoSize, сбрасывающий размеры до исходного полного размера, для первой опции изменения размера больше никакие действия не предпринимаются, для выполнения остальных опций флажок выключается, для второй далее ширина ставится по ширине окошка отображения изображения, по ширине ScrollBoxX, в который ImageXOverlay записан, высота подгоняется соответственно коэффициенту уменьшения изображения относительно первоначального размера, хотя это и кажется не необходимо, так как у всех изображений установлен флажок Proportional, который, при изменении одного размера пропорционально изменяет другой, но так как он делает это только визуально, что может нарушить некоторые расчеты в программе, необходимость вручную изменять второй размер при изменении первого остается. Для умещения по высоте изменяется высота, а затем пересчитывается ширина, а для умещения по ширине и высоте сначала проводится умещение по ширине, и если высота больше высоты ScrollBoxX, то проводится умещение по высоте.



2.3.5 Список элементов, создание выделения и точки начального контакта

В таблицу слева от окна изображений загружается список элементов, с обозначением наличия выделения не только с помощью отдельного столбца, но и окрашиванием клетки, содержащей название элемента, в зеленый цвет. При нажатии кнопки добавить элемент в списке появляется элемент с названием «Элемент» и описанием «Описание», с принадлежностью к выбранному в данный момент «слою», без выделения и начальной точки. Фокус таблицы будет переведен на него. При нажатии на поле «название», «описание» или «№ слоя» можно изменить записанное там значение, как и для любого элемента в списке.

При записи в первые два поля будет проходить проверка на ввод пустой строки, при попытке сохранить которую пользователю выйдет предупреждение, и проверка на наличие кавычек, при вводе которых будет произведено их автоматическое удаление и выведено предупреждении о недопустимости использования кавычек, для предотвращения sql инъекций. При записи в поле «№ слоя» также проводятся проверки на правильность ввода.

При нажатии на любой элемент из списка слой будет переключён на слой элемента, при наличии выделения и точки начального контакта они будут отображены, при активном флажке «Затемнение выделения» выделение будет произведено с процентом затемнения, установленном на слайдере «Сила затемнения», и при активном флажке «Автофокус на элементе» программа попытается сделать так, чтобы этот элемент оказался посередине окна изображения, если это возможно. Если при активном выделении нажать кнопку «Снять выделение», то отображаемое изображение вернется в исходный вид.

Также, при выделенном в списке станет активной кнопка удаления элемента, при нажатии которой элемент будет удален, а список переписан.

При нажатии на кнопку «Отсортировать элементы» будет произведена их сортировка по названиям, хотя обычно в это нет необходимости, так как обычно при записи элементов в массив элементов они и так отдельно сортируются по названиям.

Если у выбранного элемента нет выделения на изображении, то при нажатии на изображение пользователь начинает выделение. По событию нажатия кнопки мыши на элементе ImageXOverlay (по «опусканию» кнопки мыши), производятся проверки, при успешном прохождении которых активируется переменная Drawing, означающая начало рисования, запоминаются начальные координаты, в отдельном элементе ImageXDrawing, поверх ImageXOverlay, записывается исходное изображение и, согласно установленному режиму размера изображений, записывается коэффициент изменения размера, для последующих расчетов.

Далее, пока пользователь не отпускает кнопку мыши и пока активна переменная Drawing, происходит рисование прямоугольника выделения с помощью функции рисования выделения без подсвечивания и без начальной точки.

Когда пользователь отпускает кнопку мыши, начальные и конечные (на момент отпускания кнопки) переменная Drawing становится неактивной, координаты пересчитываются согласно сохраненному ранее коэффициенту увеличения, далее производится проверка, что пользователь рисовал слева-направо сверху-вниз, и, если это не так, т производится необходимый пересчет координат. Далее координаты записываются в соответствующую переменную элемента, строка с этим элементом перерисовывается в таблице, ImageXDrawing очищается и вызывается соответствующий метод для отображения выделения на ImageXOverlay.

При нажатии на строку элемента, у которого уже есть выделение, кнопки удаления выделения и рисования точки начального контакта станут активными.

При нажатии на последнюю переменная DrawRedDot станет активной, что позволит пользователю одним нажатием на изображении запомнить координаты точки начального контакта. После окончания выделения изменения записываются, кнопка рисования точки начального контакта станет неактивной, а кнопка удаления точки начального контакта наоборот.

2.3.6 Загрузка проекта в базу данных

В отношении данной программы проектом называется совокупность описания проекта, изображений на слоях и элементов, принадлежащих тому или иному слою. Любое из перечисленного может отсутствовать.

Для загрузки в базу данных используется окно сохранения в базу данных, на котором используются компоненты ADOConnection3 и ADOQuery3. Для записи проекта в таблицу MainTable как нового используется SQL-запрос на вставку:

insert into dbo.MainTable(ID, FileImageSide1, FileImageSide2, Comments) ' + 'output inserted.[ID] ' + 'values (NEWID(), :Image1, :Image2, :description)'

В качестве идентификатора используется команда NEWID( ), также идентификатор выводится данным запросом и считывается позднее для дальнейшего использования.

Для записи изображений создается поток памяти TMemoryStream, в который записывается изображение, затем производится проверка на формат, если обнаружен bmp, то путем манипулирования с заголовком изображение переворачивается, это необходимо так как в битовой карте высота записывается отрицательно.

После этого поток памяти записывается в соответствующую переменную, которой заранее присваивается тип ftBlob. Те же операции производятся и для второго изображения, после чего в переменную description записывается описание проекта, после присвоения ей типа ftString, затем запрос выполняется, и новый идентификатор проекта считывается. Затем с использованием цикла и функции WriteElementToDatabase в базу данных поочередно записываются все элементы.

Функция WriteElementToDatabase является универсальной, так как она была реализована мной для работы и с записью нового проекта, и с обновлением уже существующего.

Для данного случая она вызывается, записывая все элементы как новые, поочередно выполняя команды для записи необходимой информации сначала в таблицу Elements, выполнив запрос, отображенный на рисунке 9, предварительно заполнив необходимые переменные.

Рисунок 9. Запрос для добавления нового элемента в таблицу Elements

После этого необходимо получить новый идентификатор элемента, а затем с помощью запроса на рисунке 10 добавить элемент в таблицу ElementsDescription и с помощью запроса на рисунке 11 добавить необходимую информацию в таблицу PicturesToElements.

Рисунок 10. Запрос для добавления нового элемента в таблицу ElementsDescription

Рисунок 11. Запрос для добавления нового элемента в таблицу PicturesToElements



После записи нового элемента в базу данных его новый идентификатор присваивается ему и в программе.

Для записи проекта как существующего сценарий работы похожий. Для записи в таблицу MainTable используется запрос на обновление:

'update dbo.MainTable set FileImageSide1 = :Image1, FileImageSide2 = :Image2, Comments = :description ' + 'where ID =' + QuotedStr(picturesId[0]) +';'

Где picturesId[X] это идентификатор проекта, который был у первого или второго изображения.

Перед добавлением элементов выводится вопрос, хочет ли пользователь добавить элементы как новые. При нажатии «Да» последующий сценарий работы совпадает с описанным ранее. При нажатии «Нет» сначала производится очистка базы данных от элементов, которые принадлежали к проекту с данным идентификатором, но были удалены пользователем, то есть их больше нет в массиве элементов.

Затем созданные в программе и не имеющие на данный момент идентификатора элементы загружаются с помощью описанных ранее процедур, а для элементов, имеющих идентификатор в функции WriteElementToDatabase предусмотрены отдельные запросы, код которых находится на рисунках 12-14.

Рисунок 12. Запрос для обновления информации об элементе в таблице Elements



Рисунок 13. Запрос для обновления информации об элементе в таблице ElementsDescription

Рисунок 14. Запрос для обновления информации об элементе в таблице PicturesToElements

2.3.7 Нахождение элемента на картинке по нажатию

Как и в исходной программе, в данной присутствует возможность узнать, какой элемент изображен, если он уже был отмечен пользователем. Если в таблице элементов выбран элемент, у которого уже имеется выделение, и если режим рисования точки начального контакта не включен, то при нажатии на ImageXOverlay, будет произведен поиск элемента, центр которого ближе всего к координате точки нажатия. Алгоритм нахождения близости к центру должен помочь с имевшимся в исходной программе недостатком, заключавшемся в том, что программа просто выбирала первый по списку элемент, у которого данная точка находится в пределах выделения.

2.3.8 Поиск

Как и в исходной программе, в данной имеется поиск по названию или описанию элемента. При вводе текста в поле поиска, данный текст ищется в соответствующих полях элементов, а затем список найденных элементов выводится вместо общего. При нажатии на элемент из результата поиска таблица снова будет заполнена общим списком элементов, а у пользователя будет выбран элемент, выбранный при поиске. При очистке строки поиска общий список элементов также будет занесен обратно в таблицу.



2.3.9 Слайд шоу

В контексте данной программы под слайд шоу подразумевается последовательное переключение между элементами общего списка элементов. Для выполнения данного действия в главном окне есть описанная ранее кнопка начала/приостановки слайд шоу и поле для ввода продолжительности осмотра одного элемента в секундах. Так как выбор пользователем элемента в списке и переключение слайд шоу работают на одних и тех же алгоритмах работы главного окна, при выборе режима увеличения, силы и необходимости подсвечивания, и автофокуса соответствующие действия будут происходить при переключении на следующий элемент.



3. Тестирование

Все реализованные функции были проверены на компьютерах с ОС Windows 7 и Windows 10. Почти всегда все перечисленные функции работают, однако из-за особенностей работы Delphi некоторые функции могут давать сбой. Например, по непонятному стечению обстоятельств, при изменении размера главного окна некоторые размерные константы панелей могут сбрасываться, однако, после добавления дополнительных разделителей эта проблема происходит все реже.

Подсвечивание элементов и возможность изменения размера изображения действительно помогли увеличить скорость и простоту нахождения элемента на изображении.

В целом, результат тестирования положительный



Заключение

В результате данной работы путем выполнения обозначенных задач поставленная проблема сложности нахождения выделенных участков на изображениях была решена благодаря разработке подходящего программного обеспечения. Были улучшены навыки работы с базами данных не только относительно использования, но и относительно настройки. Также были получены навыки работы с языком программирования Delphi и получены навыки работы со средой разработки Embarcadero RAD Studio.

Дальнейшая работа по улучшению данного программного обеспечения может вестись в сторону:

· добавления функций работы с проектами без баз данных для расширения круга потенциальных пользователей;

· большей оптимизации использования памяти или вычислительной мощности;

· добавления многопоточности для увеличения скорости работы приложения;

· более тонкой настройки интерфейса пользователем, например, улучшение адаптивности дизайна или возможность менять шрифты и цвета приложения.



Список литературы

[1] Delphi. Полное руководство. [Книга] / авт. Сухарев Михаил. - Санкт-Петербург : Наука и техника, 2010.

[2] Thirty Camtasia Demos in Thirty Days [В Интернете] / авт. Hodges Nick // Nick Hodges >> Blog Archive. - Embarcadero, 15 Август 2006 г. (Дата обращения 9 Апрель 2019 г.) - https://web.archive.org/web/20130630143102/http://blogs.embarcadero.com/nickhodges/2006/08/15/26687.

[3] Справочник - "Основы Delphi" [В Интернете] / авт. delphibasics.ru // delphibasics.ru. - http://delphibasics.ru. (Дата обращения 10 Апреля 2019)

Размещено на Allbest.ru