Qt：玩转QPainter后转之太极图

本文主要是介绍Qt：玩转QPainter后转之太极图，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

前言

简单了解了QPainter之后还是要做两个小例子练一练，不实际去做，只看看函数是没啥太大提升的，这里就简单画一个太极图。

正文

在这里插入图片描述

我们都知道太极分为阴阳鱼两部分，阴鱼(黑色)有个白色鱼眼，阳鱼(白色)有个黑色鱼眼；所以我们在画图的时候也可以分成阴阳两部分来画
单看阳鱼
在这里插入图片描述
不算鱼眼的话可以分成三部分，我们可以先画一个大半圆，用大半圆减去上面一个小半圆，再加上下面一个小半圆即可
阴鱼正好相反先画一个大半圆，用大半圆减去下面一个小半圆，再加上上面一个小半圆即可
关键代码

void BGPainter::drawTaiJi(QPainter& painter)
{// 先保存绘图设置painter.save();// 通过旋转坐标系统实现太极图的旋转painter.rotate(m_angle);// 白鱼QPainterPath circle, temp;// <<左移乘2circle.arcTo(-m_radius, -m_radius, m_radius << 1, m_radius << 1, 270, 180);// >>右移除2temp.addEllipse(QPointF(0, -m_radius >> 1), m_radius >> 1, m_radius >> 1);// 上面减一个小半圆circle -= temp;temp.clear();temp.addEllipse(QPointF(0, m_radius >> 1), m_radius >> 1, m_radius >> 1);// 下面加上一个小半圆circle += temp;painter.fillPath(circle, Qt::white);// 黑鱼circle.clear();circle.arcTo(-m_radius, -m_radius, m_radius << 1, m_radius << 1, 90, 180);temp.clear();temp.addEllipse(QPointF(0, m_radius >> 1), m_radius >> 1, m_radius >> 1);// 下面减一个小半圆circle -= temp;temp.clear();temp.addEllipse(QPointF(0, -m_radius >> 1), m_radius >> 1, m_radius >> 1);// 上面加上一个小半圆circle += temp;painter.fillPath(circle, Qt::black);painter.restore();
}

效果如下
在这里插入图片描述
现在再把鱼眼添加上，再加一个定时器来实现旋转即可
完整代码

#ifndef BGPAINTER_H
#define BGPAINTER_H#include <QWidget>QT_BEGIN_NAMESPACE
namespace Ui { class BGPainter; }
QT_END_NAMESPACE
enum Speed {VERYFAST = 5,FAST = 10,MEDIUM = 50,LOW = 100,LOWLOW = 200
};class BGPainter : public QWidget
{Q_OBJECTpublic:BGPainter(QWidget *parent = nullptr);void updateInterval(int speed);void initcboSpeed();~BGPainter();
protected:void paintEvent(QPaintEvent* event) override;void drawTaiJi(QPainter& painter);private slots:void on_btnBeignRotate_clicked();void on_btnEndRotate_clicked();private:Ui::BGPainter *ui;// 太极图半径int m_radius;// 设置个定时器使得太极图旋转QTimer* m_timer;// 定时器的时间间隔int m_interval;// 旋转的角度int m_angle;
};
#endif // BGPAINTER_H//cpp文件
#include "bgpainter.h"
#include <QPointF>
#include "qpainter.h"
#include "qpainterpath.h"
#include "qtimer.h"
#include "qpen.h"
#include "qbrush.h"
#include "ui_bgpainter.h"BGPainter::BGPainter(QWidget* parent): QWidget(parent), ui(new Ui::BGPainter), m_radius(100), m_angle(0), m_interval(200)
{ui->setupUi(this);m_timer = new QTimer(0);// 默认时间间隔为2msm_timer->setInterval(m_interval);connect(m_timer, &QTimer::timeout, [=](){// 触发72次定时器才算完整一圈m_angle += 5;m_angle %= 360;update(); });initcboSpeed();
}void BGPainter::updateInterval(int speed)
{m_interval = speed;m_timer->setInterval(m_interval);
}void BGPainter::initcboSpeed()
{ui->cboSpeed->addItem("LOWLOW",static_cast<int>(Speed::LOWLOW));ui->cboSpeed->addItem("LOW",static_cast<int>(Speed::LOW));ui->cboSpeed->addItem("MEDIUM",static_cast<int>(Speed::MEDIUM));ui->cboSpeed->addItem("FAST",static_cast<int>(Speed::FAST));ui->cboSpeed->addItem("VERYFAST",static_cast<int>(Speed::VERYFAST));connect(ui->cboSpeed,QOverload<int>::of(&QComboBox::currentIndexChanged),this,[=](){int index = ui->cboSpeed->currentIndex();Speed speed = (Speed)ui->cboSpeed->itemData(index).toInt();updateInterval(speed);});
}BGPainter::~BGPainter()
{delete ui;if (m_timer){if (m_timer->isActive())m_timer->stop();delete m_timer;m_timer = nullptr;};
}void BGPainter::paintEvent(QPaintEvent* event)
{QPainter painter(this);// 图形和文本抗锯齿painter.setRenderHints(QPainter::Antialiasing | QPainter::TextAntialiasing);// 将绘图起点移动到窗口中心painter.translate(width() / 2, height() / 2);// 画太极drawTaiJi(painter);}void BGPainter::drawTaiJi(QPainter& painter)
{// 先保存绘图设置painter.save();// 通过旋转坐标系统实现太极图的旋转painter.rotate(m_angle);// 白鱼QPainterPath circle, temp;// <<左移乘2circle.arcTo(-m_radius, -m_radius, m_radius << 1, m_radius << 1, 270, 180);// >>右移除2temp.addEllipse(QPointF(0, -m_radius >> 1), m_radius >> 1, m_radius >> 1);// 上面减一个小半圆circle -= temp;temp.clear();temp.addEllipse(QPointF(0, m_radius >> 1), m_radius >> 1, m_radius >> 1);// 下面加上一个小半圆circle += temp;painter.fillPath(circle, Qt::white);// 黑鱼眼temp.clear();temp.addEllipse(QPointF(0, m_radius >> 1), m_radius >> 3, m_radius >> 3);painter.fillPath(temp, Qt::black);// 黑鱼circle.clear();circle.arcTo(-m_radius, -m_radius, m_radius << 1, m_radius << 1, 90, 180);temp.clear();temp.addEllipse(QPointF(0, m_radius >> 1), m_radius >> 1, m_radius >> 1);// 下面减一个小半圆circle -= temp;temp.clear();temp.addEllipse(QPointF(0, -m_radius >> 1), m_radius >> 1, m_radius >> 1);// 上面加上一个小半圆circle += temp;painter.fillPath(circle, Qt::black);// 白鱼眼temp.clear();temp.addEllipse(QPointF(0, -m_radius >> 1), m_radius >> 3, m_radius >> 3);painter.fillPath(temp, Qt::white);painter.restore();
}void BGPainter::on_btnBeignRotate_clicked()
{m_timer->start();
}void BGPainter::on_btnEndRotate_clicked()
{if (m_timer->isActive()) {m_timer->stop();}
}

最后效果

taijiYanshi

这篇关于Qt：玩转QPainter后转之太极图的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！