找回密码
 立即注册
收起左侧

第14篇 2D绘图(四)绘制路径

6
回复
23229
查看
[复制链接]
累计签到:1568 天
连续签到:1 天
来源: 2013-4-27 12:40:52 显示全部楼层 |阅读模式
绘制路径

版权声明

该文章原创于Qter开源社区(www.qter.org),作者yafeilinux,转载请注明出处!



导语

如果要绘制一个复杂的图形,尤其是要重复绘制这样的图形,那么可以使用QPainterPath类,然后使用QPainter::drawPath()来进行绘制。QPainterPath类为绘制操作提供了一个容器,可以用来创建图形并且重复使用。一个绘图路径就是由多个矩形、椭圆、线条或者曲线等组成的对象,一个路径可以是封闭的,例如矩形和椭圆;也可以是非封闭的,例如线条和曲线。



环境:Windows Xp + Qt 4.8.4+QtCreator 2.6.2



目录

一、简单的使用路径
二、复制图形
三、绘制图形时的当前位置




正文


一、简单的使用路径

       依然在前面的项目中进行讲解。更改paintEvent()函数如下:
void MainWindow::paintEvent(QPaintEvent *)
{
    QPainterPath path;
    path.addEllipse(100, 100, 50, 50);
    path.lineTo(200, 200);
    QPainter painter(this);
    painter.setPen(Qt::blue);
    painter.setBrush(Qt::red);
    painter.drawPath(path);
}

       当创建一个QPainterPath对象后,可以使用lineTo()arcTo()cubicTo()quadTo()等函数将直线或者曲线添加到路径中。运行程序,效果如下图所示。



二、复制图形

       如果只是简单的将几个图形拼接在一起,其实完全没有必要用路径,之所以要引入路径,就是因为它的一个非常有用的功能:复制图形路径。我们在painEvent()函数中继续添加下面几行代码:
QPainterPath path2;
path2.addPath(path);
path2.translate(100,0);
painter.drawPath(path2);
    现在运行程序,效果如下图所示。


       可以看到,对于已经绘制好的路径,可以非常简单的进行重复绘制。



三、绘制图形时的当前位置

1.我们先来看个例子,将paintEvent()函数更改如下:

void MainWindow::paintEvent(QPaintEvent *)
{
    QPainterPath path;
    path.lineTo(100,100);
    path.lineTo(200,100);
    QPainter painter(this);
    painter.drawPath(path);
}
       程序运行效果如下图所示。

       可以看到,创建路径后,默认是从(0, 0)点开始绘制的,当绘制完第一条直线后当前位置是(100, 100)点,从这里开始绘制第二条直线。绘制完第二条直线后,当前位置是(200,100)


2.再来看一个例子。将paintEvent()函数的内容更改如下:
void MainWindow::paintEvent(QPaintEvent *)
{
    QPainterPath path;
    path.addRect(50, 50, 40, 40);
    path.lineTo(200, 200);
    QPainter painter(this);
    painter.drawPath(path);
}
       运行程序,效果如下图所示。

       可以发现,当绘制完矩形后,当前位置在矩形的左上角顶点,然后从这里开始绘制后面的直线。


4.我们也可以使用moveTo()函数来改变当前点的位置。例如将上面的代码更改为:

void MainWindow::paintEvent(QPaintEvent *)
{
    QPainterPath path;
    path.addRect(50, 50, 40, 40);
    //移动到(100, 100)点
    path.moveTo(100, 100);
    path.lineTo(200, 200);
    QPainter painter(this);
    painter.drawPath(path);
}

       这样当绘制完矩形以后,就会移动到(100, 100)点进行后面的绘制。程序运行效果如下图所示。



结语

       这里只讲解了QPainterPath最基本的应用,使用好这个类可以绘制出很多特效图形。如果绘制的两个图形有交集,那么还要涉及到相交部分的填充规则问题,这部分内容可以参考《Qt Creator快速入门》10章的相关内容。






涉及到的源码下载:



上一篇: 第13篇 2D绘图(三)绘制文字

下一篇: 第15篇 2D绘图(五)绘制图片

返回:系列教程目录   




本帖子中包含更多资源

您需要 登录 才可以下载或查看,没有帐号?立即注册

x
回复

使用道具 举报

累计签到:27 天
连续签到:1 天
2016-7-13 15:17:30 显示全部楼层
为什么往后就没人回复了。。。
回复 支持 反对

使用道具 举报

累计签到:4 天
连续签到:1 天
2016-7-18 16:36:12 显示全部楼层
版本低了吗?

本帖子中包含更多资源

您需要 登录 才可以下载或查看,没有帐号?立即注册

x
回复 支持 反对

使用道具 举报

累计签到:6 天
连续签到:1 天
2017-2-25 15:28:36 显示全部楼层
绘图和windows的gdi绘图很像
回复 支持 反对

使用道具 举报

累计签到:6 天
连续签到:1 天
2018-1-16 17:35:51 显示全部楼层
你好,请问下,我第一次调用绘画事件成功绘画,但是使用update()更新后,第二次绘画 就没反应。函数能进 都能一步一步的执行,,,但就是画不出来,,,请问可能是什么问题
回复 支持 反对

使用道具 举报

累计签到:1568 天
连续签到:1 天
2018-1-17 22:55:16 显示全部楼层
洛神殇 发表于 2018-1-16 17:35
你好,请问下,我第一次调用绘画事件成功绘画,但是使用update()更新后,第二次绘画 就没反应。函数能进 都 ...

那得看在哪里调用的update
回复 支持 反对

使用道具 举报

累计签到:6 天
连续签到:1 天
2018-1-18 16:25:38 显示全部楼层
这个问题解决了,我是在绘画事件里面调用的,后来解决了,用的repaint。。。然后现在有个新问题,你又没有用过QWT,,,如果更改QDial类的圆盘与背景的比例大小,,那个英文文档太恶心了,完全看不懂
回复 支持 反对

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

公告
可以关注我们的微信公众号yafeilinux_friends获取最新动态,或者加入QQ会员群进行交流:190741849、186601429(已满) 我知道了