Рисование интерфейсов, формирование таблиц баз данных, работа с сетью — это всё хорошо, но иногда хочется просто, что-нибудь нарисовать, например треугольник . А потом конечно же оживить этот объект, чтобы им можно было управлять, и в последствии превратить этот проект в маленькую игру. Ну кто не хочет написать собственную игру, даже самую простую?
Давайте тогда сделаем первый шаг в сторону простенькой игры, а именно разберемся с рисованием объектов в Qt, попробовав нарисовать треугольник .
Программный код был написан в QtCreator 3.3.1 на основе Qt 5.4.1.
Видео:КАК НАРИСОВАТЬ ТРЕУГОЛЬНИК В КОНСОЛИ C# | C# ДОМАШНИЕ ЗАДАНИЯ | #5Скачать
Структура проекта «Треугольник»
Опишем структуру проекта, в котором будем рисовать треугольник:
- Triangle.pro — профайл проекта, создается по умолчанию и в данном проекте не требует корректироваки;
- main.cpp — файл, с которого стартует приложение, в данном файле вызывается widget, в котором будет располагаться графическая сцена с треугольником;
- widget.h — заголовочный файл, вызываемого виджета с графической сценой;
- widget.cpp — файл исходных кодов виджета;
- triangle.h — заголовочный файл класса Треугольника , который наследован от QGraphicsItem;
- triangle.cpp — файл исходных кодов класса Треугольник.
- 1. Структура проекта «Треугольник»
- 2. mainwindow.ui
- 3. widget.h
- 4. widget.cpp
- 5. triangle.h
- 6. triangle.cpp
- 7. Итог
- 8. Видеоурок
Видео:Урок 56 - Базовые принципы рисования QPainterСкачать
mainwindow.ui
В дизайнере интерфейсов просто закидываем QGraphicsView в виджет. Больше ничего не требуется.
Видео:Qt уроки #7. QPainter - знакомство с рисованием в QtСкачать
widget.h
В данном файле всего лишь объявляем графическую сцену и объект треугольника, с которым будем работать.
Видео:КАК НАРИСОВАТЬ ТРЕУГОЛЬНИК В ПРОГРАММЕ ADOBE ILLUSTRATOR.Скачать
widget.cpp
В данном файле настраиваются объекты QGraphicsView , QGraphicsScene, а также создается и устанавливается на графическую сцену объект треугольника.
Видео:Qt C++ Drawing text,line QPainter QPen QTextСкачать
triangle.h
А вот теперь настало время проработать сам класс, в котором создаётся треугольник. В данном случае наследуемся от QGraphicsItem .
Видео:Qt. Знакомимся с классом QPainter.Скачать
triangle.cpp
А теперь рисуем треугольник в нашем классе. Здесь имеется один важный момент. Координатная система объекта QGraphicsItem — это понятие отличное от координатной системы графической сцены. То есть каждый объект QGraphicsItem или унаследованный от данного класса имеет свою собственную систему координат, которая транслируется в систему координат QGraphicsScene . Когда мы задаём позицию, где будет находиться объект на графической сцене, то мы указываем, где будет находится точка графического объекта, которая имеет координаты 0 по оси X и 0 по оси Y, в координатной системе объекта, поэтому важно, чтобы данная точка была в центре графического объекта. Это упростит дальнейшую работу, если конечно вы осознанно не предполагаете иного варианта.
В результате у Вас должно получится приложение, которое выводит на экран красный треугольник в центре графической сцены на пересечении двух линий, как показано на рисунке.
Также рекомендую ознакомиться с видеоуроком, в котором подробнее рассмотрен момент с установкой координат графического объекта.
Видео:Qt. Рисование с помощью QPainter. Часть 1Скачать
Видеоурок
Рекомендуем хостинг TIMEWEB
Рекомендуемые статьи по этой тематике
Видео:Где в иллюстраторе инструмент треугольник | Рисуем треугольник в Adobe illustratorСкачать
Задачи по Python с решениями
Видео:Qt уроки #8. Рисование мышью в QtСкачать
Свежие записи
Видео:Как нарисовать пирамиду?Скачать
Класс QPainter. Рисование линий и фигур
На этом шаге мы перечислим методы, используемые для рисования линий и фигур.
После захвата контекста рисования следует установить перо и кисть. С помощью пера производится рисование точек,
линий и контуров фигур, а с помощью кисти — заполнение фона фигур. Установить перо позволяет метод setPen()
класса QPainter. Форматы метода:
Для установки кисти предназначен метод setBrush(). Форматы метода:
Устанавливать перо или кисть необходимо перед каждой операцией рисования, требующей изменения цвета или стиля.
Если перо или кисть не установлены, будут использоваться объекты с настройками по умолчанию. После установки
пера и кисти можно приступать к рисованию точек, линий, фигур, текста и др.
Для рисования точек, линий и фигур класс QPainter предоставляет следующие наиболее часто употребляемые методы
(полный их список доступен на странице
https://doc.qt.io/qt-5/qpainter.html):
- drawPoint () — рисует точку. Форматы метода:
- drawPoints () — рисует несколько точек. Форматы метода:
- drawLine () — рисует линию. Форматы метода:
- drawLines () — рисует несколько отдельных линий. Форматы метода:
Замечание.
В документации по PyQt5 также заявлена поддержка форматов:
Однако при попытке вызвать метод drawLines() с их использованием выдается сообщение об ошибке.
Возможно, это ошибка в самой библиотеке.
перо со стилем NoPen, а чтобы убрать заливку- кисть со стилем NoBrush. Форматы метода:
fillRect () — рисует прямоугольник с заливкой без границы. Форматы метода:
может быть задана экземплярами классов , , в
виде стиля кисти или атрибута цвета;
drawRoundedRect () — рисует прямоугольник с границей, заливкой и скругленными краями. Форматы метода:
Параметры и задают радиусы
скругления углов по горизонтали и вертикали. Необязательный параметр mode указывает, в каких единицах измеряются радиусы
скругления углов, и задается одним из следующих атрибутов класса Qtcore.Qt:
- AbsoluteSize (или 0) — радиусы указываются в пикселях;
- RelativeSize (или 1) — радиусы указываются в процентах от соответствующего размера рисуемого прямоугольника;
Необязательный параметр fillRule задает алгоритм определения, находится ли какая-либо точка внутри нарисованного
прямоугольника или вне его. В качестве его значения указывается атрибут OddEvenFill (или 0) или
WindingFill (или l) класса QtCore.Qt;
drawEllipse () — рисует эллипс с границей и заливкой. Форматы метода:
В первых трех форматах указываются координаты и размеры прямоугольника, в который необходимо вписать эллипс. В двух
последних форматах первый параметр задает координаты центра, параметр rX — радиус по оси х, а
параметр rY — радиус по оси Y;
drawArc () — рисует дугу. Форматы метода:
Следует учитывать, что значения углов задаются в значениях 1/16°. Полный круг эквивалентен значению
5760 = 16 * 360. Нулевой угол находится в позиции «трех часов». Положительные значения углов отсчитываются против
часовой стрелки, а отрицательные — по часовой стрелке:
drawChord () — рисует замкнутую дугу. Аналогичен методу drawArc(), но соединяет
крайние точки дуги прямой линией. Форматы метода:
drawPie () — рисует замкнутый сектор. Аналогичен методу drawArc(), но соединяет крайние точки дуги
с центром окружности. Форматы метода:
При выводе некоторых фигур (например, эллипса) контур может отображаться в виде «лесенки». Чтобы сгладить контуры фигур,
следует вызвать метод setRenderHint() и передать ему в качестве единственного параметра атрибут Antialiasing класса QPainter. Пример:
В заключение приведем пример программы, выводящей графическую информацию, снабженную небольшими комментариями (программа взята отсюда: https://pythonworld.ru/gui/pyqt5-painting.html).
Как видно из нее, все методы рисования вызываются из метода paintEvent() и располагаются между методами begin() и end() объекта класса QPainter().
Архив с файлом можно взять здесь.
Результат работы приложения изображен на рисунке 1.
Рис.1. Результат работы приложения
На следующем шаге мы рассмотрим вывод текста.
Видео:Фракталы за 2 минуты в PaintСкачать
Урок №12. Рисование в Qt5
Обновл. 16 Сен 2021 |
Сегодня мы немного поупражняемся в рисовании. Для этого в Qt5 есть очень мощный класс QPainter. Он может рисовать всё: от простых линий до сложных геометрических фигур, таких как секторы, дуги окружностей, многоугольники и т.д.
Методика отрисовки объектов средствами Qt5 сводится к следующему:
сначала нужно при помощи публичного наследования создать дочерний класс от класса QWidget;
в созданном классе переопределить метод перерисовки paintEvent(QPaintEvent *) .
Метод paintEvent(QPaintEvent *) всегда вызывается при создании виджета, а также всякий раз, когда нужно перерисовать его внешний вид (например, мы растянули/сжали окно и вместе с этим изменили размеры нашего виджета).
Видео:Qt Widgets - OpenGL. Создаем окно и рисуем треугольник.Скачать
Линии
А начнем мы с простого примера, в котором нарисуем в клиентской области окна шесть линий, которые будут отличаться друг от друга стилем.
Для этого мы создадим дочерний класс Lines, наследуя класс QWidget, и поместим код отрисовки линий внутри переопределенного метода paintEvent().
Заголовочный файл — lines.h:
Файл реализации — lines.cpp:
Т.к. метод paintEvent() вызывается каждый раз при обновлении виджета, то мы будем создавать объект класса QPainter и выполнять операцию рисования внутри данного метода. Поскольку сам объект QPaintEvent *e не используется, то желательно заранее сообщить об этом с помощью макроса Q_UNUSED , иначе компилятор выдаст предупреждение. Фактическая отрисовка линии делегируется методу drawLines():
При помощи класса QPen мы создаем объект pen со следующими параметрами:
толщина 2 пикселя;
Объект pen используется для рисования линий и контуров фигур. Устанавливаем его с помощью метода setPen():
Метод drawLine() рисует линию, его четыре параметра — это координаты двух точек (начала и конца линии):
Метод setStyle() устанавливает стиль Qt::DashLine (пунктирная линия) для объекта pen :
Основной файл программы — main.cpp:
Результат выполнения программы:
Видео:УРОК 3.КАК НАРИСОВАТЬ ПРИЗМУ,ПИРАМИДУ.Обучение рисунку.Урок рисования карандашом.построение поэтапноСкачать
Палитра цветов
Цвет — это объект, представляющий собой комбинацию значений интенсивности красного, зеленого и синего цветов (сокр. «RGB» от англ. «Red, Green, Blue»). Допустимые значения RGB находятся в диапазоне от 0 до 255. В следующем примере мы попробуем нарисовать 9 прямоугольников с серым контуром, заполненных разными цветными заливками.
Заголовочный файл — colours.h:
Файл реализации — colours.cpp:
Класс кисти QBrush определяет шаблон заливки фигур, нарисованных с помощью объекта класса QPainter. Метод drawRect() рисует прямоугольник:
первые два параметра метода — это координаты ( x;y ) верхнего левого угла прямоугольника;
другие два параметра — это значения ширины прямоугольника и его высоты.
Для указания цвета мы будем использовать шестнадцатеричное представление:
Основной файл программы — main.cpp:
Результат выполнения программы:
Видео:КАК НАРИСОВАТЬ ТРЕУГОЛЬНИК. 7 СПОСОБОВ. Corel DRAW. КОРЕЛ. Уроки для начинающихСкачать
Шаблоны узоров
Следующий пример аналогичен предыдущему, но в этот раз мы будем заполнять прямоугольники не сплошным цветом, а с помощью уже готовых шаблонов узоров кисти.
Заголовочный файл — patterns.h:
Файл реализации — patterns.cpp:
Создаем прямоугольник с определенным рисунком. Qt::HorPattern — это константа, используемая для создания шаблона горизонтальных линий:
Внешний вид всех шаблонов узоров кисти приведен в результате выполнения программы.
Основной файл программы — main.cpp:
Результат выполнения программы:
Видео:Как в фотошопе нарисовать треугольник с закругленными краями - Уроки фотошопа для начинающихСкачать
Прозрачные прямоугольники
Прозрачность — это величина, характеризующая возможность объекта пропускать свет. Самый простой способ понять прозрачность — это представить себе кусок стекла или воды. Технически лучи света могут проходить сквозь стекло, и таким образом наблюдатель имеет возможность видеть объекты, находящиеся за ним.
В компьютерной графике мы можем добиться эффекта прозрачности, используя метод альфа-композитинга. Данный метод комбинирует изображение с фоном для создания эффекта частичной прозрачности. При этом в процессе композиции используется так называемый альфа-канал — это дополнительный канал, который может быть добавлен в рисунок, и содержащий информацию о его прозрачности.
В следующем примере мы нарисуем 11 прямоугольников с разными уровнями прозрачности.
💡 Видео
Создание простых геометрических фигур в ФотошопеСкачать
Как начертить ПРИЗМУ ТРЕХГРАННУЮСкачать
ТЕМА 5. ПОСТРОЕНИЕ ШЕСТИГРАННОЙ ПРИЗМЫ, КОНУСА И ЧЕТЫРЕХГРАННОЙ ПИРАМИДЫ.Скачать
Как сделать треугольник в фотошопе - Уроки фотошопа для начинающихСкачать
