电子商务网站建设作业,淄博网站文章优化,网站建设资金,短网址源码wordpress目录 一、简介
二、流程编辑器-视图实现
三、参考资料 一、简介
前期文章#xff1a;
流程图拖拽视觉编程--概述_Jason~shen的博客-CSDN博客
本期内容#xff1a;
本期将介绍流程编辑器模块的实现方法#xff0c;效果图如下所示。该模块基于QT Graphics/View实现…目录 一、简介
二、流程编辑器-视图实现
三、参考资料 一、简介
前期文章
流程图拖拽视觉编程--概述_Jason~shen的博客-CSDN博客
本期内容
本期将介绍流程编辑器模块的实现方法效果图如下所示。该模块基于QT Graphics/View实现由视图、自定义图元、图元管理器组成。 二、流程编辑器-视图实现
视图的功能是提供一个节点显示窗口支持缩放、平移和网格线背景。
该部分继承QGraphicsView实现定义接口如下
class GRAPHICSLIBSHARED_EXPORT BaseGraphicsView: public QGraphicsView
{Q_OBJECT
public:explicit BaseGraphicsView(QWidget *parent nullptr);~BaseGraphicsView();void setFactorMax(double val); //最大缩放因子void setFactorMin(double val); //最小缩放因子void setShowGrid(bool b); //是否显示网格线void setMoveSceneEnabled(bool b); //是否平移使能public slots:void zoomIn();void zoomOut();protected:void wheelEvent(QWheelEvent *event) Q_DECL_OVERRIDE;void drawBackground(QPainter *painter, const QRectF rect) Q_DECL_OVERRIDE;void mousePressEvent(QMouseEvent *event) Q_DECL_OVERRIDE;void mouseMoveEvent(QMouseEvent *event) Q_DECL_OVERRIDE;void mouseReleaseEvent(QMouseEvent *event) Q_DECL_OVERRIDE;private:void drawGrid(QPainter *painter, double gridStep);private:double m_factorMax;double m_factorMin;QPointF m_scenePos;QPointF m_pressPos;bool m_moveScene;bool m_showGrid;bool m_moveSceneEnabled;
};
缩放的实现核心函数scale(), 配合鼠标事件操作重写鼠标滚动事件函数wheelEvent限制视图过大或者过小。
void BaseGraphicsView::zoomIn()
{setTransformationAnchor(QGraphicsView::AnchorUnderMouse);scale(1.2, 1.2);
}void BaseGraphicsView::zoomOut()
{setTransformationAnchor(QGraphicsView::AnchorUnderMouse);scale(1 / 1.2, 1 / 1.2);
}void BaseGraphicsView::wheelEvent(QWheelEvent *event)
{qreal factor_out transform().scale(1.2, 1.2).mapRect(QRectF(0, 0, 1, 1)).width();qreal factor_in transform().scale(1 / 1.2, 1 / 1.2).mapRect(QRectF(0, 0, 1, 1)).width();if (event-delta() 0){if(factor_out m_factorMax){return; /* 防止视图过大 */}zoomIn();}else{if(factor_in m_factorMin){return; /* 防止视图过小 */}zoomOut();}update();
}
平移的实现 核心函数setSceneRect()配合鼠标事件操作重写鼠标按下mousePressEvent、移动mouseMoveEvent、释放mouseReleaseEvent事件函数。
void BaseGraphicsView::mousePressEvent(QMouseEvent *event)
{if(m_moveSceneEnabled){QMouseEvent fake(event-type(), event-pos(), Qt::LeftButton, Qt::LeftButton, event-modifiers());m_scenePos mapToScene(event-pos());m_pressPos m_scenePos;setDragMode(QGraphicsView::NoDrag);if (QApplication::keyboardModifiers() Qt::ControlModifier event-button() Qt::LeftButton){setDragMode(QGraphicsView::RubberBandDrag);}if (event-button() Qt::MiddleButton){setDragMode(QGraphicsView::ScrollHandDrag);setInteractive(false);event fake;m_moveScene true;}update();}QGraphicsView::mousePressEvent(event);
}void BaseGraphicsView::mouseMoveEvent(QMouseEvent *event)
{if(m_moveSceneEnabled){m_scenePos mapToScene(event-pos());if (m_moveScene){QPointF difference m_pressPos - m_scenePos;setSceneRect(sceneRect().translated(difference.x(), difference.y()));}update();}QGraphicsView::mouseMoveEvent(event);
}void BaseGraphicsView::mouseReleaseEvent(QMouseEvent *event)
{if(m_moveSceneEnabled){QMouseEvent fake(event-type(), event-pos(), Qt::LeftButton, Qt::LeftButton, event-modifiers());if (event-button() Qt::MiddleButton){setDragMode(QGraphicsView::NoDrag);setInteractive(true);event fake;}m_moveScene false;update();}QGraphicsView::mouseReleaseEvent(event);
}
网格线背景通过绘图类QPainter画线重写绘制背景函数drawBackground
void BaseGraphicsView::drawBackground(QPainter *painter, const QRectF rect)
{QGraphicsView::drawBackground(painter, rect);if(m_showGrid){QPen pfine(QColor::fromRgb(50, 50, 50), 0.6);painter-setPen(pfine);drawGrid(painter, 15);QPen p(QColor::fromRgb(50, 50, 50), 2.0);painter-setPen(p);drawGrid(painter, 150);}
}void BaseGraphicsView::drawGrid(QPainter *painter, double gridStep)
{QRect windowRect rect();QPointF tl mapToScene(windowRect.topLeft());QPointF br mapToScene(windowRect.bottomRight());double left qFloor(tl.x() / gridStep - 0.5);double right qFloor(br.x() / gridStep 1.0);double bottom qFloor(tl.y() / gridStep - 0.5);double top qFloor(br.y() / gridStep 1.0);for (int xi int(left); xi int(right); xi){QLineF line(xi * gridStep, bottom * gridStep,xi * gridStep, top * gridStep );painter-drawLine(line);}for (int yi int(bottom); yi int(top); yi){QLineF line(left * gridStep, yi * gridStep,right * gridStep, yi * gridStep );painter-drawLine(line);}
}
三、参考资料
文章
GitHub开源推荐 | 节点编辑器-技术圈
python版本
Pavel Křupala / pyqt-node-editor · GitLab
https://blog.csdn.net/mahuatengmmp/category_9948511.html
Release v0.3.1 · beyse/NodeEditor · GitHub
qt4/qt5版本
GitHub - Buanderie/qnodeseditor: Originally from http://algoholic.eu/qnodeseditor-qt-nodesports-based-data-processing-flow-editor/
GitHub - hzt1234hf/FlowChartTools: 使用QT开发的跨平台Windows、Linux流程图绘制工具
