基于Qt實(shí)現(xiàn)SVG圖片瀏覽器
介紹
SVG的英文全稱是Scalable Vector Graphics,即可縮放的矢量圖形。它是由萬(wàn)維網(wǎng)聯(lián)盟(W3C)在2000年8月制定的一種新的二維矢量圖形格式,也是規(guī)范中的網(wǎng)格適量圖形標(biāo)準(zhǔn),是一個(gè)開放的圖形標(biāo)準(zhǔn)。
SVG格式的特點(diǎn)如下:
(1)基于XML
(2)采用文本來(lái)描述對(duì)象
(3)具有交互性和動(dòng)態(tài)性
(4)完全支持DOM
SVG相對(duì)于GIF、JPEG格式的優(yōu)勢(shì)是,SVG是一種矢量圖形格式,比GIF、JPEG等柵格格式具有眾多優(yōu)勢(shì),如文件小、可任意縮放而不破壞圖像的清晰度和細(xì)節(jié)等。
Qt為SVG格式圖片的顯示與生成提供了專門的QtSvg模塊,此模塊中包含了與SVG圖片相關(guān)的所有類,主要有QSvgWidget、QSvgRender和QGraphicsSvgItem。
一、項(xiàng)目介紹
利用QtSvg實(shí)現(xiàn)SVG圖片瀏覽器,可以顯示SVG結(jié)尾的文件圖片。
二、項(xiàng)目基本配置
新建一個(gè)Qt案例,項(xiàng)目名稱為“SVGTest”,基類選擇“QMainWindow”,取消創(chuàng)建UI界面復(fù)選框的選中狀態(tài),完成項(xiàng)目創(chuàng)建。
三、UI界面設(shè)計(jì)
無(wú)UI界面
四、主程序?qū)崿F(xiàn)
4.1 .pro文件
如果是QT5版本,需要在pro工程文件中加入一行代碼:
QT+=svg
如果是QT6版本,需要在pro工程文件中加入一行代碼:
QT+=svgwidgets
【不同Qt版本,添加的qmake不相同,這里建議參考幫助文檔:】
4.2 添加SvgWindow類
項(xiàng)目名——>鼠標(biāo)右鍵——>Add New——>C++ Class——>添加如下內(nèi)容
創(chuàng)建完成后,項(xiàng)目中會(huì)出現(xiàn)svgwindow.h和svgwindow.cpp。
4.3 添加SvgWidget類
項(xiàng)目名——>鼠標(biāo)右鍵——>Add New——>C++ Class——>添加如下內(nèi)容
創(chuàng)建完成后,項(xiàng)目中會(huì)出現(xiàn)svgwidget.h和svgwidget.cpp,如下所示:
4.4 svgwidget.h頭文件
SvgWidget類繼承自QSvgWidget類,主要顯示SVG圖片。
在public中聲明一下響應(yīng)鼠標(biāo)的滾動(dòng)事件,使SVG圖片可以通過(guò)鼠標(biāo)滾動(dòng)進(jìn)行縮放,然后聲明render變量,用于圖片顯示尺寸的確定:
#include <QSvgWidget> #include<QtSvg> #include<QSvgRenderer> public: void wheelEvent(QWheelEvent *);//響應(yīng)鼠標(biāo)的滾動(dòng)事件,使SVG圖片可以通過(guò)鼠標(biāo)滾動(dòng)進(jìn)行縮放 private: QSvgRenderer *render;//用于圖片顯示尺寸的確定
4.5 svgwidget.cpp源文件
SvgWidget函數(shù)獲得本窗體的QSvgRenderer對(duì)象,代碼如下:
SvgWidget::SvgWidget() { render=renderer(); }
然后定義鼠標(biāo)滾輪的響應(yīng)事件,使SVG圖片可以通過(guò)鼠標(biāo)滾動(dòng)進(jìn)行縮放:
void SvgWidget::wheelEvent(QWheelEvent *e) { const double diff=0.1;//diff的值表示每次滾輪滾動(dòng)一定的值,圖片大小改變的比例 //用于獲取圖片顯示區(qū)的尺寸 QSize size=render->defaultSize(); int width=size.width(); int height=size.height(); //利用QWheelEvent的相關(guān)函數(shù)獲得滾輪滾動(dòng)的距離值,通過(guò)此值判斷滾輪滾動(dòng)的方向 //若此值大于0,則表示滾輪向前(遠(yuǎn)離用戶方向)滾動(dòng); //若此值小于0,則表示滾輪向后(靠近用戶方向)滾動(dòng); //Qt6使用e->angleDelta().y() //Qt5請(qǐng)使用e->delta() if(e->angleDelta().y()>0){ //對(duì)圖片的長(zhǎng)、寬值進(jìn)行放大 width=int(this->width()+this->width()*diff); height=int(this->height()+this->height()*diff); }else{ //對(duì)圖片的長(zhǎng)、寬值進(jìn)行縮小 width=int(this->width()-this->width()*diff); height=int(this->height()-this->height()*diff); } resize(width,height);//重新調(diào)整大小 }
4.6 svgwindow.h頭文件
SvgWindow類繼承自QScrollArea,是一個(gè)帶滾動(dòng)條的顯示區(qū)域。在SvgWindow類實(shí)現(xiàn)包含"svgwidget.h"的頭文件,該類使圖片在放大到超過(guò)主窗口大小時(shí),能夠通過(guò)拖拽滾動(dòng)條的方式進(jìn)行查看。
添加代碼如下:
#include"svgwidget.h" public: void setFile(QString); void mousePressEvent(QMouseEvent *); void mouseMoveEvent(QMouseEvent *); private: SvgWidget *svgWidget; QPoint mousePressPos; QPoint scrollBarValuesMousePress;
4.7 svgwindow.cpp源文件
主函數(shù)內(nèi)進(jìn)行設(shè)置滾動(dòng)區(qū)的窗體,使svgWidget成為SvgWindow的子窗口:
svgWidget=new SvgWidget; setWidget(svgWidget);
當(dāng)主窗口中對(duì)文件進(jìn)行了選擇或修改時(shí),調(diào)用setFile()函數(shù)設(shè)置新的文件:
//設(shè)置新的文件 void SvgWindow::setFile(QString filename){ svgWidget->load(filename);//將新的SVG文件加載到svgWidget中進(jìn)行顯示 QSvgRenderer *render=svgWidget->renderer(); svgWidget->resize(render->defaultSize());//按照SVG文件的默認(rèn)尺寸進(jìn)行顯示 }
鼠標(biāo)按下時(shí),獲取水平滾動(dòng)條和垂直滾動(dòng)條的值:
//鼠標(biāo)按下響應(yīng)函數(shù) void SvgWindow::mousePressEvent(QMouseEvent *e) { mousePressPos=e->pos(); scrollBarValuesMousePress.rx()=horizontalScrollBar()->value(); scrollBarValuesMousePress.ry()=verticalScrollBar()->value(); e->accept(); }
當(dāng)鼠標(biāo)鍵按下并且拖拽鼠標(biāo)時(shí)觸發(fā)mouseMoveEvent()函數(shù),通過(guò)滾動(dòng)條的位置設(shè)置實(shí)現(xiàn)圖片拖拽效果:
//鼠標(biāo)按下且拖拽響應(yīng)函數(shù) void SvgWindow::mouseMoveEvent(QMouseEvent *e) { horizontalScrollBar()->setValue(scrollBarValuesMousePress.x()- e->pos().x()+mousePressPos.x());//對(duì)水平滾動(dòng)條的新位置進(jìn)行設(shè)置 verticalScrollBar()->setValue(scrollBarValuesMousePress.y()- e->pos().y()+mousePressPos.y());//對(duì)垂直滾動(dòng)條的新位置進(jìn)行設(shè)置 horizontalScrollBar()->update(); verticalScrollBar()->update(); e->accept(); }
4.8 mainwindow.h頭文件
頭文件中包含"svgwindow.h"頭文件,并且聲明打開文件菜單的槽函數(shù)和svgwindow用于調(diào)用相關(guān)函數(shù)傳遞選擇的文件名:
#include"svgwindow.h" public slots: void slotOpenFile();//打開文件槽函數(shù) private: SvgWindow *svgwindow; //用于調(diào)用相關(guān)函數(shù)傳遞選擇的文件名
4.9 mainwindow.cpp源文件
主窗口MainWindow包含一個(gè)菜單欄,其中有一個(gè)“文件”子菜單,包含一個(gè)“打開”菜單項(xiàng),代碼如下:
setWindowTitle("SVG Viewer");//設(shè)置窗口標(biāo)題 QMenu *fileMenu=menuBar()->addMenu("文件");//菜單欄添加"文件" QAction *openAct=new QAction("打開",this);//"文件"中添加"打開"子菜單 connect(openAct,SIGNAL(triggered()),this,SLOT(slotOpenFile()));//點(diǎn)擊打開觸發(fā)slotOpenFile()槽函數(shù) fileMenu->addAction(openAct); svgwindow=new SvgWindow; setCentralWidget(svgwindow); resize(800,600);//初始大小
定義打開菜單的槽函數(shù):
//打開菜單的槽函數(shù) void MainWindow::slotOpenFile() { QString name=QFileDialog::getOpenFileName(this,"打開","/","svg files(*.svg)"); svgwindow->setFile(name); }
五、效果演示
以上就是基于Qt實(shí)現(xiàn)SVG圖片瀏覽器的詳細(xì)內(nèi)容,更多關(guān)于Qt SVG圖片瀏覽器的資料請(qǐng)關(guān)注腳本之家其它相關(guān)文章!
相關(guān)文章
基于C語(yǔ)言實(shí)現(xiàn)個(gè)人通訊錄管理系統(tǒng)
這篇文章主要為大家詳細(xì)介紹了基于C語(yǔ)言實(shí)現(xiàn)個(gè)人通訊錄管理系統(tǒng),文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2020-06-06關(guān)于C++中定義比較函數(shù)的三種方法小結(jié)
下面小編就為大家?guī)?lái)一篇關(guān)于C++中定義比較函數(shù)的三種方法小結(jié)。小編覺(jué)得挺不錯(cuò)的,現(xiàn)在就分享給大家,也給大家做個(gè)參考。一起跟隨小編過(guò)來(lái)看看吧2016-10-10C語(yǔ)言實(shí)現(xiàn)個(gè)人通訊錄管理系統(tǒng)
這篇文章主要為大家詳細(xì)介紹了C語(yǔ)言實(shí)現(xiàn)個(gè)人通訊錄管理系統(tǒng),文中示例代碼介紹的非常詳細(xì),具有一定的參考價(jià)值,感興趣的小伙伴們可以參考一下2019-12-12簡(jiǎn)要對(duì)比C語(yǔ)言中的truncate()函數(shù)與ftruncate()函數(shù)
這篇文章主要介紹了C語(yǔ)言中的truncate()函數(shù)與ftruncate()函數(shù)的簡(jiǎn)要對(duì)比,注意其之間的區(qū)別,需要的朋友可以參考下2015-09-09C語(yǔ)言中帶頭雙向循環(huán)鏈表基本操作的實(shí)現(xiàn)詳解
無(wú)頭單向非循環(huán)鏈表結(jié)構(gòu)簡(jiǎn)單,一般不會(huì)單獨(dú)用來(lái)存數(shù)據(jù)。而帶頭雙向循環(huán)鏈表的結(jié)構(gòu)較為復(fù)雜,一般用在單獨(dú)存儲(chǔ)數(shù)據(jù)。本文將介紹帶頭雙向循環(huán)鏈表的基本操作,需要的可以參考一下2022-11-11