本节对应的视频讲解:B_站_视_频
https://www.bilibili.com/video/BV1h24y1D7Gg
本节讲解如何绘制路径
1. 相关的 API
// 直接指定一个 QPainterPath 对象
void drawPath(const QPainterPath &path)
drawPath 需要一个 QPainterPath 对象,其常用方法
// 移动到指定的点,开始指定路径
void moveTo(const QPointF &point);
void moveTo(qreal x, qreal y);
// 以直线的方式,路径到指定的点
void lineTo(const QPointF &endPoint);
void lineTo(qreal x, qreal y);
// 以贝瑟尔曲线的方式,路径到指定的点
// 具体来说:使用控制点c1和c2,在当前点和结束点之间,绘制一条贝瑟尔曲线
void cubicTo(const QPointF &c1, const QPointF &c2, const QPointF &endPoint);
void cubicTo(qreal c1X, qreal c1Y, qreal c2X, qreal c2Y, qreal endPointX, qreal endPointY);
贝瑟尔曲线,常用于速度、动画等的控制,这不是我们的重点
关于贝瑟尔曲线的动态演示,可以查看这里:http://yisibl.github.io/cubic-bezier
2. 具体实现
只需在 PaintWidget.cpp
的 paintEvent
中添加如下代码即可:
#include <QPainterPath>
void PaintWidget::paintEvent(QPaintEvent *event)
{
QPainterPath path;
path.moveTo(20, 80);
path.lineTo(20, 30);
// path.cubicTo(80, 0, 50, 50, 80, 80);
path.cubicTo(QPoint(80, 0), QPoint(50, 50), QPoint(80, 80));
for ( int x = 0; x < width(); x += 100 ) {
for ( int y = 0; y < height(); y += 100 ) {
...
switch ( mShape ) {
// 路径
case _Path:
painter.drawPath(path);
break;
}
...
}
}
}
最终绘制的路径的效果,如下: