Qt绘图详解.docx

上传人:b****5 文档编号:7874846 上传时间:2023-01-26 格式:DOCX 页数:20 大小:2.26MB
下载 相关 举报
Qt绘图详解.docx_第1页
第1页 / 共20页
Qt绘图详解.docx_第2页
第2页 / 共20页
Qt绘图详解.docx_第3页
第3页 / 共20页
Qt绘图详解.docx_第4页
第4页 / 共20页
Qt绘图详解.docx_第5页
第5页 / 共20页
点击查看更多>>
下载资源
资源描述

Qt绘图详解.docx

《Qt绘图详解.docx》由会员分享,可在线阅读,更多相关《Qt绘图详解.docx(20页珍藏版)》请在冰豆网上搜索。

Qt绘图详解.docx

Qt绘图详解

要在一张画布上画图形步骤:

1、先要建立一个图片视图的主窗口如工程名为BeautyView建好之后应该是这样的

包括工程文件,源文件,和界面文件。

2、自己定义一个自己的画布类如类名为Mycanvas它继承于QObject类,它的基类是QGraphicsScene(绘图场景)类。

创建如下图:

填好之后下面就直接下一步就行了。

创建好了应该是这样的

3、改变中央窗口的类,

打开之后在这个位置改成这样,则centralWidget是QSplitter类的对象。

QSplitter控件经常做为布局管理器使用,给用户提供更多的界面控制。

自己试试就知道它的好处了。

4、现在有了自己的画布,下面在画布上添加视角按钮控件,直接点开界面文件可以看到:

在右边选择这个绘图视角按钮拖3个放到放到窗口里面

成功是这样的:

分别点击每个视角更改名字,

名字改为后其中第一个为normalView正常视角第二个为scaleView放大视角

第三个为rotationView倒置视角。

设置完后保存就行了。

5、在主窗口中加上自己定义的画布:

在私有数据成员中定义一个画布类的对象

private:

Ui:

:

MainWindow*ui;

Mycanvascanvas;

这种就叫组合。

接着就要设置每个视角的属性:

下面写上

//每个视图以“独立的”视角观察"同一个"画布

ui->normalView->setScene(&canvas);//正常视图

ui->scaleView->setScene(&canvas);//放大视图

ui->scaleView->scale(1.5,1.5);//放大1.5倍可以改

ui->rotationView->setScene(&canvas);//旋转视图

ui->rotationView->rotate(90.0);//旋转90度可以改

6、先画一个椭圆

现在在mycanvas.h添加定义椭圆的类,QGraphicsEllipseItem。

protected:

QGraphicsEllipseItemellipseItem;//定义一个圆非抽象的子类

然后在mycanvas.cpp里面去实现这以后基本上就是这种模式:

//通过绘图项的setxxx()设置绘图属性

ellipseItem.setRect(80,50,100,80);//圆点坐标后面两个不相等为椭圆

ellipseItem.setBrush(QBrush(Qt:

:

green));

addItem(&ellipseItem);//将椭圆添加到数据结构里面去

7、上面对在画布上画一个椭圆的工作已经完成,下面就编译运行看一下效果:

这样一个椭圆就会出来了。

8、下面实现在这个椭圆里面实现画一串字符:

方法一样:

现在在mycanvas.h添加定义椭圆的类,QGraphicsTextItem

然后定义自己的对象QGraphicsTextItemTextItem;

在mycanvas.cpp里面在加上:

TextItem.setPlainText(

QString:

:

fromLocal8Bit("捣蛋猪"));

TextItem.setX(ellipseItem.x()+90);//显示的位置

TextItem.setY(ellipseItem.y()+90);

addItem(&ellipseItem);//将椭圆添加到数据结构里面去

addItem(&TextItem);//将字符串添加到数据结构里面去

9、然后编译看运行结果:

这样一串字符也画上去了。

下面可以做一个美女图片查看器:

要在画布上显示一张图片不能像上面显示简单图形那么简单了,本身图片是存放在文件夹中的,不是调用几个成员函数就能画出来的。

Qt提供了一种放法,就是将图片作为一种资源办法添加到模块中去(Beautyviewer)模块独立存在,这个资源里其实存的是图片文件的路径。

下面具体看程序怎么操作:

1、添加资源:

点选择进入下一步:

下一步:

完成后就出现:

2、找两张图片放到工程文件夹中:

打开资源文件点添加文件将这两个图片添加进去:

先要添加前缀,可以改的,如我将

改为

然后再添加图片:

2、下面开始写程序:

首先还要知道的一个东西,这个模块是没法直接去访问图片的,必须通过QPixmap类的对象去访问,QPixmap它是个位图文件(bmp)能够将不同格式的图片文件转换成统一像素的映射。

首先在mycanvas.h文件中添加图片类#include

>

在成员中定义:

protected:

QGraphicsEllipseItemellipseItem;//定义一个圆非抽象的子类

QGraphicsTextItemTextItem;

QGraphicsPixmapItemimageItem;

QPixmapbeauty0;//定义QPixmap类的对象去访问图片文件

};

3、根据上面所说的在.h文件定义的对象就要拿到.cpp里去实现

mycanvas.cpp里面:

#include"mycanvas.h"

Mycanvas:

:

Mycanvas(QObject*parent):

QGraphicsScene(parent),

beauty0(":

/image/tu1.jpg")//把路径写上注意此处‘:

’千万不能少新增加的

{

//通过会图项setxxx()设置绘图属性

ellipseItem.setRect(50,80,100,80);//圆点坐标后面两个不相等为椭圆

ellipseItem.setBrush(QBrush(Qt:

:

green));

TextItem.setPlainText(

QString:

:

fromLocal8Bit("捣蛋猪"));

TextItem.setX(ellipseItem.x()+90);//显示的位置

TextItem.setY(ellipseItem.y()+90);

imageItem.setPixmap(beauty0);//将图片文件添加进去新增加的

imageItem.setPos(120,120);//设置坐标点新增加的

addItem(&ellipseItem);//将椭圆添加到数据结构里面去

addItem(&TextItem);//将字符串添加到数据结构里面去

addItem(&imageItem);//将图片添加到数据结构里面去新增加的

}

4、编译看效果:

此时美丽的兽兽展现我们面前。

在画布上先也就这么简单。

接下来要在这个的基础上继续完成一些功能。

一、实现点下鼠标完成换图片的功能

1、先将程序改装一下,把处理图片对象单独放在一个类中,因为后面要对图片进行很多操作。

如定义类名为BeautyItem它继承自QGraphicsPixmapItem类。

示意图为:

有了它就好办了,

添加类:

这里要说明一下这些绘图项的类都不继承Qobject.

记着就点下一步完成就行了。

2、创建好了开始写程序:

在beautyItem.h先定义Qpixmap的两个对象分别用来去访问2张图片的。

public:

BeautyItem();

QPixmapbeauty0;

QPixmapbeauty1;

};

在BeautyItem的构造函数里对QPixmap类的对象进行初始化:

BeautyItem:

:

BeautyItem():

beauty0(":

/image/tu1.jpg"),//初始化

beauty1(":

/image/tu2.jpg")

{

setPixmap(beauty0);//将对象添加进去

setPos(140,140);//设置坐标点

}

下一步我们在

中增加BeautyItem类的数据成员这种叫组合为了调用BeautyItem:

:

BeautyItem();这个函数:

#ifndefMYCANVAS_H

#defineMYCANVAS_H

#include

#include

#include

#include

#include//要增加BeautyItem类的数据成员当然要包含头文件

classMycanvas:

publicQGraphicsScene

{

Q_OBJECT

public:

explicitMycanvas(QObject*parent=0);

signals:

publicslots:

protected:

QGraphicsEllipseItemellipseItem;//定义一个圆非抽象的子类

QGraphicsTextItemTextItem;

//QGraphicsPixmapItemimageItem;

BeautyItemimageItem;//定义BeautyItem的对象这种都是组合的运用

/*

当定义BeautyItem的对象的是时候默认会调用BeautyItem的构造函数

BeautyItem:

:

BeautyItem():

beauty0(":

/image/tu1.jpg"),//初始化

beauty1(":

/image/tu2.jpg")

{

setPixmap(beauty0);//将图片文件添加进去

setPos(140,140);//设置坐标点

}

这样应该清楚了用派生的方法来实现

*/

QPixmapbeauty0;//定义QPixmap类的对象去访问图片文件

};

#endif//MYCANVAS_H

中:

#include"mycanvas.h"

Mycanvas:

:

Mycanvas(QObject*parent):

QGraphicsScene(parent)

//beauty0(":

/image/tu1.jpg")//已注释

{

//通过会图项setxxx()设置绘图属性

ellipseItem.setRect(50,80,100,80);//圆点坐标后面两个不相等为椭圆

ellipseItem.setBrush(QBrush(Qt:

:

green));

TextItem.setPlainText(

QString:

:

fromLocal8Bit("捣蛋猪"));

TextItem.setX(ellipseItem.x()+90);//显示的位置

TextItem.setY(ellipseItem.y()+90);

//imageItem.setPixmap(beauty0);//将图片文件添加进去已注释

//imageItem.setPos(140,140);//设置坐标点已注释

addItem(&ellipseItem);//将椭圆添加到数据结构里面去

addItem(&TextItem);//将字符串添加到数据结构里面去

addItem(&imageItem);//将图片添加到数据结构里面去

}

做了这么多工作下面看运行结果:

一样的可以打印出美丽的图片,这样改的目的是为了后面要多这个图片进行很多的操作,这样只需在处理图片BeautyItem类中改动就行了。

下面开始写点击鼠标切换图片的功能:

首先要知道这个鼠标事件我们怎么样来捕捉到它,Qt里面一般的是通过派生一个子类然后去覆写它的虚函数来实现。

下面具体看这种方法:

先要找到这个画布场景类QGraphicsScene的鼠标事件,因为我们现在是点击的是画布,所以是找它的鼠标事件:

先选中

然后按F1进入:

点击Event事件:

再点mousePressEvent()进入:

就找到这个虚函数了,把它复制到

中去:

#ifndefBEAUTYITEM_H

#defineBEAUTYITEM_H

#include

classBeautyItem:

publicQGraphicsPixmapItem

{

public:

/*通过派生一个子类覆写它的虚函数来捕捉它的它的事件

*/

//捕捉它的鼠标事件

virtualvoidmousePressEvent(QGraphicsSceneMouseEvent*mouseEvent);

BeautyItem();

QPixmapbeauty0;

QPixmapbeauty1;

boolduity;//用来切换图片的变量

};

#endif//BEAUTYITEM_H

然后在

去实现:

#include"beautyitem.h"

BeautyItem:

:

BeautyItem():

beauty0(":

/image/tu1.jpg"),//初始化

beauty1(":

/image/tu2.jpg"),

duity(false)//初始值为假

{

setPixmap(beauty0);//将对象添加进去

setPos(140,140);//设置坐标点

}

//点击鼠标切换图片

voidBeautyItem:

:

mousePressEvent(QGraphicsSceneMouseEvent*mouseEvent)

{

duity=!

duity;

setPixmap((duity?

beauty0:

beauty1));

setPos(140,140);//设置坐标点

}

只需改动一点点就行了,加了一个鼠标事件函数,和一个bool变量用来切换图片。

编译看运行结果:

点击鼠标,注意要点在图片内:

这样就实现了切换,看着是否很简单,真正能够理解才行。

 

持续更新。

展开阅读全文
相关资源
猜你喜欢
相关搜索

当前位置:首页 > PPT模板 > 商务科技

copyright@ 2008-2022 冰豆网网站版权所有

经营许可证编号:鄂ICP备2022015515号-1