Qt系列文章目錄
前言
最近前端JavaScript想要調(diào)用Qt的圖片處理，圖片都是8k以上的分辨率，前端使用canvas畫布，當(dāng)處理幾張8k高分辨率圖片勉強(qiáng)能用，但是處理到20多張以后，canvas也依然卡頓。使用Qt QGraphicsItem、QGraphicsView、QGraphicsScene處理100張以內(nèi)的8k高清圖片依然游刃有余，所以要用到WebAssembly，以便JS能夠調(diào)用Qt。需要在Qt中使用WebAssembly 。
一、Qt for WebAssembly | Qt 5.15
Qt for WebAssembly | Qt 5.15官網(wǎng)
由于我機(jī)器上安裝的Qt5.12不支持WebAssembly 。Qt適合emsdk的版本， 所以要把升級到Qt5.15
Qt5.15.2的安裝還是比較麻煩的，由于Qt5.15以后，Qt官方只提供了在線安裝版本，不提供離線安裝版本，安裝時(shí)還需要下載。首先需要科學(xué)上網(wǎng)，否則在安裝時(shí)一直提示無法下載，就算是科學(xué)上網(wǎng)了，安裝過程中還是經(jīng)常提示無法下載XXXX組件，必須反復(fù)嘗試手動(dòng)重試下載，把人整瘋。網(wǎng)上大神有發(fā)過離線安裝Qt5.15的文章，沒有試過：離線安裝Qt5.15.2
各位看官老爺可是嘗試下哈， Qt5.15.2的目錄下已經(jīng)包含了wasm編譯所需要的庫和環(huán)境，默認(rèn)路徑在 5.15.2/wasm_32下，但是wasm對應(yīng)的emscripten版本是1.39.7，可以通過輸入命令行（先cd到你的pro工程目錄下）的方式來獲取版本信息，所以你需要下載并安裝emscripten1.39.7版本。Qt5.14.2還有離線安裝包
Qt5.15以后官方已不提供離線安裝包
二、Qt5.15.2配置
1.配置編譯器
2.代碼測試
1 . QGraphicsItem封裝成 MyItem
#ifndef MYITEM_H
#define MYITEM_H
#include <QGraphicsItem>
#include <QPainter>
#include <QStyleOptionGraphicsItem>
#include <QKeyEvent>
#include <QDebug>
#include <QPixmap>
class MyItem : public QGraphicsItem
{
public:
MyItem();
QRectF boundingRect() const;
void paint(QPainter *painter, const QStyleOptionGraphicsItem *option,
QWidget *widget);
void setColor(const QColor &color) { brushColor = color; }
protected:
void keyPressEvent(QKeyEvent *event);
void mousePressEvent(QGraphicsSceneMouseEvent *event);
void mouseReleaseEvent(QGraphicsSceneMouseEvent *event);
void hoverEnterEvent(QGraphicsSceneHoverEvent *event);
void hoverLeaveEvent (QGraphicsSceneHoverEvent * event);
void contextMenuEvent(QGraphicsSceneContextMenuEvent *event);
void mouseMoveEvent(QGraphicsSceneMouseEvent *event);
private:
QColor brushColor;
QPointF m_centerPointF;
bool m_bResizing;
bool m_isMove;
QPixmap m_pix;
};
#endif // MYITEM_H
#include "MyItem.h"
#include <QMenu>
#include <QGraphicsSceneContextMenuEvent>
#include <QAction>
MyItem::MyItem()
{
brushColor = Qt::red;
setFlag(QGraphicsItem::ItemIsFocusable);
setFlag(QGraphicsItem::ItemIsMovable);
//setAcceptHoverEvents(true);
}
QRectF MyItem::boundingRect() const
{
qreal adjust = 0.5;
return QRectF(-10 - adjust, -10 - adjust,
20 + adjust, 20 + adjust);
}
void MyItem::paint(QPainter *painter, const QStyleOptionGraphicsItem *option,
QWidget *widget)
{
// qDebug("************MyItem::paint*****************");
// if(hasFocus()) {
// painter->setPen(QPen(QColor(255,255,255,200)));
// } else {
// painter->setPen(QPen(QColor(100,100,100,100)));
// }
// painter->setBrush(brushColor);
// painter->drawRect(-10, -10, 20, 20);
painter->drawPixmap(-m_pix.width() / 2, -m_pix.height() / 2, m_pix);
}
// 鼠標(biāo)按下事件處理函數(shù)，設(shè)置被點(diǎn)擊的圖形項(xiàng)獲得焦點(diǎn)，并改變光標(biāo)外觀
void MyItem::mousePressEvent(QGraphicsSceneMouseEvent *event)
{
// qDebug("************MyItem::mousePressEvent*****************");
// setFocus();
// setCursor(Qt::ClosedHandCursor);
setFocus();
setCursor(Qt::ClosedHandCursor);
//stackBefore(this);
topLevelItem();
setColor(QColor(255, 0, 0, 255));
setOpacity(0.8);
if (event->button() == Qt::LeftButton) {
if (event->modifiers() == Qt::ShiftModifier) {
qDebug() << "Custom item left clicked with shift key.";
// 選中 item
setSelected(true);
/*this->setZValue(1);*/
}
// else if (event->modifiers() == Qt::AltModifier) {
// qDebug() << "Custom item left clicked with alt key.";
// // 重置 item 大小
// double radius = boundingRect().width() / 2.0;
// QPointF topLeft = boundingRect().topLeft();
// m_centerPointF = QPointF(topLeft.x() + pos().x() + radius, topLeft.y() + pos().y() + radius);
// QPointF pos = event->scenePos();
// qDebug() << boundingRect() << radius << this->pos() << pos << event->pos();
// double dist = sqrt(pow(m_centerPointF.x() - pos.x(), 2) + pow(m_centerPointF.y() - pos.y(), 2));
// if (dist / radius > 0.8) {
// qDebug() << dist << radius << dist / radius;
// m_bResizing = true;
// }
// else {
// m_bResizing = false;
// }
// }
// else {
// qDebug() << "Custom item left clicked.";
// QGraphicsItem::mousePressEvent(event);
// event->accept();
// }
}
else if (event->button() == Qt::RightButton) {
qDebug() << "Custom item right clicked.";
event->ignore();
}
}
void MyItem::mouseReleaseEvent(QGraphicsSceneMouseEvent *event)
{
setOpacity(1);
m_isMove = false;//標(biāo)記鼠標(biāo)左鍵已經(jīng)抬起
if ((event->modifiers() == Qt::AltModifier) && m_bResizing) {
m_bResizing = false;
}
else {
QGraphicsItem::mouseReleaseEvent(event);
}
}
// 鍵盤按下事件處理函數(shù)，判斷是否是向下方向鍵，如果是，則向下移動(dòng)圖形項(xiàng)
void MyItem::keyPressEvent(QKeyEvent *event)
{
qDebug("************MyItem::keyPressEvent*****************");
if(event->key() == Qt::Key_Down)
moveBy(0, 10);
}
// 懸停事件處理函數(shù)，設(shè)置光標(biāo)外觀和提示
void MyItem::hoverEnterEvent(QGraphicsSceneHoverEvent *event)
{
qDebug("************MyItem::hoverEnterEvent*****************");
setCursor(Qt::OpenHandCursor);
setToolTip("I am item");
}
void MyItem::hoverLeaveEvent(QGraphicsSceneHoverEvent *event)
{
// qDebug("************MyItem::hoverLeaveEvent*****************");
// setCursor(Qt::ArrowCursor);
setOpacity(1);
m_isMove = false;//標(biāo)記鼠標(biāo)左鍵已經(jīng)抬起
if ((event->modifiers() == Qt::AltModifier) && m_bResizing) {
m_bResizing = false;
}
else {
QGraphicsItem::hoverLeaveEvent(event);
}
}
// 右鍵菜單事件處理函數(shù)，為圖形項(xiàng)添加一個(gè)右鍵菜單
void MyItem::contextMenuEvent(QGraphicsSceneContextMenuEvent *event)
{
QMenu menu;
QAction *moveAction = menu.addAction("move back");
QAction *actAction = menu.addAction("test");
QAction *selectedAction = menu.exec(event->screenPos());
if(selectedAction == moveAction) {
setPos(0, 0);
}
}
void MyItem::mouseMoveEvent(QGraphicsSceneMouseEvent *event)
{
// qDebug("************MyItem::mouseMoveEvent*****************");
// QGraphicsItem::mouseMoveEvent(event);
this->setZValue(1);
if ((event->modifiers() == Qt::AltModifier) && m_bResizing) {
QPointF pos = event->scenePos();
double dist = sqrt(pow(m_centerPointF.x() - pos.x(), 2) + pow(m_centerPointF.y() - pos.y(), 2));
//setRect(m_centerPointF.x() - this->pos().x() - dist, m_centerPointF.y() - this->pos().y() - dist, dist * 2, dist * 2);
}
else if (event->modifiers() != Qt::AltModifier) {
qDebug() << "Custom item moved.";
QGraphicsItem::mouseMoveEvent(event);
qDebug() << "moved" << pos();
}
}
2.QGraphicsView封裝成MyView
#ifndef MYVIEW_H
#define MYVIEW_H
#include <QGraphicsView>
#include <QKeyEvent>
class MyView : public QGraphicsView
{
Q_OBJECT
public:
explicit MyView(QWidget *parent = 0);
protected:
void keyPressEvent(QKeyEvent *event);
void mousePressEvent(QMouseEvent *event);
void paintEvent(QPaintEvent * event);
void mouseMoveEvent(QMouseEvent *event);
signals:
public slots:
};
#endif // MYVIEW_H
#include "MyView.h"
MyView::MyView(QWidget *parent) :
QGraphicsView(parent)
{
this->setHorizontalScrollBarPolicy(Qt::ScrollBarAlwaysOff);//禁用滾動(dòng)條
this->setVerticalScrollBarPolicy(Qt::ScrollBarAlwaysOff);
this->setDragMode(QGraphicsView::RubberBandDrag); //鼠標(biāo)手型：ScrollHandDrag
// this->setDragMode(QGraphicsView::ScrollHandDrag); //Scene整體拖拽
//m_graphicsView->setFlag(QGraphicsView::ItemSendsGeometryChanges);
}
void MyView::keyPressEvent(QKeyEvent *event)
{
qDebug("*********MyView::keyPressEvent***************");
switch (event->key())
{
case Qt::Key_Left :
scale(1.2, 1.2);
break;
case Qt::Key_Right :
scale(1 / 1.2, 1 / 1.2);
break;
case Qt::Key_Up :
rotate(30);
break;
}
QGraphicsView::keyPressEvent(event);
}
void MyView::mousePressEvent(QMouseEvent *event)
{
qDebug("************MyView::mousePressEvent*****************");
QGraphicsView::mousePressEvent(event);
}
void MyView::paintEvent(QPaintEvent *event)
{
qDebug("************MyView::paintEvent*****************");
QGraphicsView::paintEvent(event);
}
void MyView::mouseMoveEvent(QMouseEvent *event)
{
//qDebug("************MyView::mouseMoveEvent*****************");
QGraphicsView::mouseMoveEvent(event);
}
3. QGraphicsScene封裝成MyScene
#ifndef MYSCENE_H
#define MYSCENE_H
#include <QGraphicsScene>
class MyScene : public QGraphicsScene
{
Q_OBJECT
public:
explicit MyScene(QObject *parent = 0);
protected:
void keyPressEvent(QKeyEvent *event);
void mousePressEvent(QGraphicsSceneMouseEvent *event);
signals:
public slots:
};
#endif // MYSCENE_H
#include "MyScene.h"
MyScene::MyScene(QObject *parent) :
QGraphicsScene(parent)
{
clearFocus();
}
void MyScene::keyPressEvent(QKeyEvent *event)
{
qDebug("*********MyScene::keyPressEvent***************");
return QGraphicsScene::keyPressEvent(event);
}
void MyScene::mousePressEvent(QGraphicsSceneMouseEvent *event)
{
qDebug("*********MyScene::mousePressEvent***************");
QGraphicsScene::mousePressEvent(event);
}
4.main函數(shù)
#include "MainWindow.h"
#include "MyItem.h"
#include "MyView.h"
#include "MyScene.h"
#include <QApplication>
#include <QTime>
int main(int argc, char *argv[])
{
QApplication a(argc, argv);
MainWindow w;
// w.show();
qsrand(QTime(0, 0, 0).secsTo(QTime::currentTime()));
MyScene scene;
scene.setSceneRect(-200, -150, 400, 300);
for(int i = 0; i < 5; ++i) {
MyItem *item = new MyItem;
item->setColor(QColor(qrand() % 256, qrand() % 256, qrand() % 256));
item->setPos(i * 50 - 90, -50);
scene.addItem(item);
}
MyView view;
view.setScene(&scene);
view.setBackgroundBrush(QPixmap("E:/QtExercise/SceneViewItem/girl.png"));
view.show();
return a.exec();
}
運(yùn)行效果
文章來源：http://www.zghlxwxcb.cn/news/detail-405526.html
源碼下載
源碼下載文章來源地址http://www.zghlxwxcb.cn/news/detail-405526.html
到了這里，關(guān)于windows10下Qt5.15配置的文章就介紹完了。如果您還想了解更多內(nèi)容，請?jiān)谟疑辖撬阉鱐OY模板網(wǎng)以前的文章或繼續(xù)瀏覽下面的相關(guān)文章，希望大家以后多多支持TOY模板網(wǎng)！
