【写在前面】
QPainter
例如贝塞尔曲线的 API：
QPainterPath 的 quadTo() 和 cubicTo() 然后使用 QPainter::drawPath()。
然而，美中不足的是，Qt 的贝塞尔曲线只支持二次和三次，对于更高阶的似乎就无能为力了。
quadTo() 或 cubicTo() 连用的效果也非常不理想。
「 N阶贝塞尔曲线绘制 」。
【正文开始】
先来看看效果图：
可以看到，生成的曲线是相当平滑的，我也比较满意。
接下来，讲解其实现：
首先是贝塞尔曲线的生成：
/**
* @brief createNBezierCurve 生成N阶贝塞尔曲线点
* @param src 源贝塞尔控制点
* @param dest 目的贝塞尔曲线点
* @param precision 生成精度
*/
static void createNBezierCurve(const QList<QPointF> &src, QList<QPointF> &dest, qreal precision)
{
if (src.size() <= 0) return;
//清空
QList<QPointF>().swap(dest);
for (qreal t = 0; t < 1.0000; t += precision) {
int size = src.size();
QVector<qreal> coefficient(size, 0);
coefficient[0] = 1.000;
qreal u1 = 1.0 - t;
for (int j = 1; j <= size - 1; j++) {
qreal saved = 0.0;
for (int k = 0; k < j; k++){
qreal temp = coefficient[k];
coefficient[k] = saved + u1 * temp;
saved = t * temp;
}
coefficient[j] = saved;
}
QPointF resultPoint;
for (int i = 0; i < size; i++) {
QPointF point = src.at(i);
resultPoint = resultPoint + point * coefficient[i];
}
dest.append(resultPoint);
}
}关于贝塞尔曲线的公式原理，这里给一篇文章链接： 。
有兴趣的可以看看，也没多大难度。
QList<QPointF> &dest
如前面所说，使用直线直接连接曲线点即可，具体操作如下：
void BezierCurve::paintEvent(QPaintEvent *event)
{
Q_UNUSED(event);
/** 首先绘制控制点 */
QPainter painter(this);
painter.setRenderHints(QPainter::Antialiasing | QPainter::TextAntialiasing);
painter.save();
painter.setBrush(QBrush(Qt::red));
QFontMetrics metrics(painter.font());
for (auto i = 0; i < d->m_controlPoints.size(); i++) {
painter.setPen(Qt::red);
painter.drawEllipse(d->m_controlPoints.at(i), 10.0, 10.0);
painter.setPen(Qt::white);
QString number = QString::number(i);
auto rect = metrics.boundingRect(number);
painter.drawText(d->m_controlPoints.at(i) + QPointF(-rect.width() / 2, rect.height() / 2 - 1.0), number);
}
painter.restore();
/** 然后绘制贝塞尔曲线 */
if (d->m_controlPoints.size() >= 2) {
QPainterPath curve;
curve.moveTo(d->m_bezierCurve.at(0));
for (auto i = 1; i < d->m_bezierCurve.size(); i++) {;
curve.lineTo(d->m_bezierCurve.at(i));
}
auto pen = painter.pen();
pen.setColor(Qt::blue);
pen.setWidth(2.0);
painter.setPen(pen);
painter.drawPath(curve);
}
}QPainterPath：
QPainterPath：
画家路径是由许多图形构造块（例如矩形，椭圆形，直线和曲线）组成的对象。
可以在封闭的子路径中将构建块连接起来，例如以矩形或椭圆形。
封闭的路径具有一致的起点和终点。
或者它们可以作为未封闭的子路径（例如直线和曲线）独立存在。
QPainterPath 对象可用于填充，概述和裁剪。
要为给定的绘制路径生成可填充的轮廓，请使用 QPainterPathStroker 类。
与常规绘图操作相比，画家路径的主要优势在于，复杂的形状只需要创建一次即可。
那么仅使用对 QPainter::drawPath() 函数的调用就可以绘制多次。
QPainterPath 提供了一组函数，这些函数可用于获取有关路径及其元素的信息。
另外，可以使用 toReversed() 函数反转元素的顺序，还有一些函数可以将此绘制器路径对象转换为多边形表示。
QPainterPath::moveTo() 移动到第一个点 ( 移动到起始点，将会开始一个新路径，关闭上一个子路径
QPainterPath::lineTo() 在到下一个点之间添加一条直线 ( 当前位置到给定的端点添加一条直线，绘制直线后，当前位置将更新为直线的终点
QPainter::drawPath() 绘制路径的轮廓。
最后，关于动态调节部分，简单讲解一下思路：
void BezierCurve::mousePressEvent(QMouseEvent *event)
{
if (event->buttons() & Qt::LeftButton && event->pos().y() > 50) {
d->m_mousePressed = true;
if (d->m_completed) {
d->m_currentControlPointIndex = -1;
auto pos = event->pos();
for (auto i = 0; i < d->m_controlPoints.size(); i++) {
auto point = d->m_controlPoints.at(i);
//判断是否在控制点上
if (qAbs(qSqrt(qPow(pos.x() - point.x(), 2) + qPow(pos.y() - point.y(), 2))) < 10.0000) {
d->m_currentControlPointIndex = i;
break;
}
}
} else {
d->m_controlPoints.append(event->pos());
//控制点增加了，需要更新
createNBezierCurve(d->m_controlPoints, d->m_bezierCurve, d->m_precision);
update();
}
} else if (event->buttons() & Qt::RightButton) {
d->m_completed = true;
}
}
void BezierCurve::mouseMoveEvent(QMouseEvent *event)
{
if (event->buttons() & Qt::LeftButton
&& d->m_mousePressed
&& d->m_currentControlPointIndex != -1
&& event->pos().y() > 50) {
if (d->m_currentControlPointIndex < d->m_controlPoints.size()) {
d->m_controlPoints[d->m_currentControlPointIndex] = event->pos();
createNBezierCurve(d->m_controlPoints, d->m_bezierCurve, d->m_precision);
update();
}
}
}
void BezierCurve::mouseReleaseEvent(QMouseEvent *event)
{
d->m_currentControlPointIndex = -1;
if (event->buttons() & Qt::LeftButton) {
d->m_mousePressed = false;
}
}
void BezierCurve::keyPressEvent(QKeyEvent *event)
{
if (event->key() == Qt::Key_Escape) {
d->m_completed = false;
QList<QPointF>().swap(d->m_controlPoints);
QList<QPointF>().swap(d->m_bezierCurve);
update();
}
}通过判断是否在圆内确定
- 如果不在控制点上点击，则添加到控制点中，然后重新生成曲线。
- 通过移动点击的控制点，然后重新生成曲线，即可实现动态调节的效果。
【结语】
这次简单写的例子，需要的可以自己慢慢调整和优化。
如果有其他问题 & 错误，欢迎留言 / 评论 / 私信。
最后，附上项目链接(多多star呀..⭐_⭐)：
