Рис1. Создание нового проекта

Для работы необходимо создать новый проект, мы будем создавать приложение с графическим пользовательским интерфейсом (Graphical user interface GUI) на основе
QT Wigget, см рис.1

Рис 2. Указание размещение проекта

Требуется указать размещение проекта. Запрещается размещать проекты на рабочем столе, чтобы не допускать захламления рабочего стола. Кроме того, рекомендуется сохранять в такой папке, чтобы совокупная длина названий файлов не превышала 256 знаков.

Рис 3. Указание под какие операционные системы и с помощью каких компиляторов будет производиться сборка.

Требуется указать для каких целевых платформ будет происходить компиляция, а также используемые компилляторы. Для некоторых платформ, вам может потребоваться коммерческая лицензия на компиляцию, либо более современная версия средства разработчика (QT SDK)

Рис 4. Указание файлов и название класса главного окна.

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

Рис 5. Переход к визуальному редактору экранных форм.

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

Проделав это, и убедившись, что наше приложение успешно компилируется и запускается, мы можем переходить к дальнейшим действиям — к настройке элементов при помощи редактора экранных форм. Для этого надо дважды щелкнуть мышкой(см рис 5) на файл mainwindow.ui.

Рис 6. Размещение элемента Widget

В окне редактора экранных форм, на главной форме требуется разместить элемент Widget из доступного списка экранных форм. Также стоит задать его размер, не менее 200 на 200 точек. После этого, стоит задать ему имя например MyDrawArea. Это имя впоследствии сделает доступным по указателю сам объект, через переменную ui, в случае необходимости.

Рис 7. Контекстное меню элемента Widget

Разместив элемент и зная, что нам придется использовать унаследованный от него класс, мы должны указать редактору экранных форм о том, что он должен будет использовать унаследованный класс для поведения в работающем приложении, а при настройке свойств элемента, в редакторе проектов может продолжать считать его Widget. (рис 7)

Рис 8. Указание использовать унаследованный класс.

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

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

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

Рис 9. Добавление нового файла.

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

Для этого мы переключаемся обратно к тестовому редактору, выбираем папку «заголовки» и вызвав контекстное меню, выбираем пункт «добавить новый». (см рис 9)

Рис 10. Создание заголовочного файла.

Нам требуется добавить заголовочный файл С++

Рис 11. Указание размещения нового файла.

В качестве имени заголовочного файла надо указать mydrawobject.h – аккурат такое, которое было указано при создании ассоциации «базовый класса — унаследованный класс — файл с заголовочным файлом, содержащий унаследованный класс». (См рис 8, рис 11)

Будут создан заголовочный файл с автоматическими включениями #ifndef - #define - #endif

Эти команды препроцессора говорят о том, что текст внутри #define - #endif должен быть использован при компиляции только один раз.

Рис 12. Создание текстового описания унаследованного класса.

Создав файл нам необходимо скопировать текст описания класса из ниже приведенного приложения А в текстовое окно. Затем можно запускать на исполнение. (кнопки 2 на рис 12)

Должно получиться следующее изображение:

Рис 13. Результат работы программы.

Для осуществления рисования, внутри события paintEvent, используется стандартный класс для осуществления рисования QPainter.

При рисовании, внутри QPainter сохраняется последний использованный карандаш, кисть, и прочие атрибуты. Чтобы создать фигуру из линий мы используем класс QPainterPath. Онсодержит функции и механизм для описания произвольных фигур.

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

Для задания кисти, при помощи которой будет происходить заливка региона внутри фигуры описанной QPainterPath, испольлзуется класс для задания плавного перетекания цвета — линейного градиента QLinearGradient. При этом мы указываем две двумерные точки (A, B) между которыми будет происходить интерполирование цвета(в нашем случае — сверху вниз), считая что на прямой перпендикулярной отрезку с этими двумя точками цвет одинаковый(в нашем случае цвет одинаковый для горизонтальной примой). При помощи функции setColorAt, мы задаем значение цвета на отрезке [0..1] считая за 0 первую точку (А), а за 1 — вторую (B).

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