├── PlotView.qml ├── README.md ├── main.cpp ├── main.qml ├── qcustomplot.cpp ├── qcustomplot.h ├── qml.qrc ├── qmlplot.cpp ├── qmlplot.h ├── qmlplot.pro ├── qmlplot.pro.user └── qtquickcontrols2.conf /PlotView.qml: -------------------------------------------------------------------------------- 1 | import QtQuick 2.0 2 | import CustomPlot 1.0 3 | 4 | Item { 5 | id: plotForm 6 | 7 | Text { 8 | id: text 9 | text: qsTr("Plot form") 10 | } 11 | 12 | CustomPlotItem { 13 | id: customPlot 14 | anchors.fill: parent 15 | 16 | Component.onCompleted: initCustomPlot() 17 | } 18 | } 19 | -------------------------------------------------------------------------------- /README.md: -------------------------------------------------------------------------------- 1 | # qmlplot 2 | 3 | This is a wrapper to QCustomPlot to render by QtQuick2. 4 | Implemented [solution from QCustomPlot forum](http://www.qcustomplot.com/index.php/support/forum/172). 5 | -------------------------------------------------------------------------------- /main.cpp: -------------------------------------------------------------------------------- 1 | #include 2 | //#include 3 | #include 4 | #include 5 | 6 | #include "qmlplot.h" 7 | 8 | int main(int argc, char *argv[]) 9 | { 10 | QApplication a(argc, argv); 11 | // QCoreApplication::setAttribute(Qt::AA_EnableHighDpiScaling); 12 | // QGuiApplication app(argc, argv); 13 | 14 | qmlRegisterType("CustomPlot", 1, 0, "CustomPlotItem"); 15 | 16 | QQmlApplicationEngine engine; 17 | engine.load(QUrl(QLatin1String("qrc:/main.qml"))); 18 | 19 | return a.exec(); 20 | } 21 | -------------------------------------------------------------------------------- /main.qml: -------------------------------------------------------------------------------- 1 | import QtQuick 2.7 2 | import QtQuick.Controls 2.0 3 | import QtQuick.Layouts 1.0 4 | 5 | ApplicationWindow { 6 | visible: true 7 | width: 640 8 | height: 480 9 | title: qsTr("Hello QCustomPlot in QML") 10 | 11 | // Item { 12 | // id: mainView 13 | // anchors.fill: parent 14 | // PlotView { 15 | // } 16 | // } 17 | SwipeView { 18 | id: swipeView 19 | anchors.fill: parent 20 | currentIndex: tabBar.currentIndex 21 | interactive: false 22 | 23 | PlotView { 24 | } 25 | 26 | Page { 27 | Label { 28 | text: qsTr("This is implementation of http://www.qcustomplot.com/index.php/support/forum/172\n" + 29 | "Adding random data on 500 ms tick to plot") 30 | anchors.centerIn: parent 31 | } 32 | } 33 | } 34 | 35 | footer: TabBar { 36 | id: tabBar 37 | currentIndex: swipeView.currentIndex 38 | TabButton { 39 | text: qsTr("Plot") 40 | } 41 | TabButton { 42 | text: qsTr("Info") 43 | } 44 | } 45 | } 46 | -------------------------------------------------------------------------------- /qml.qrc: -------------------------------------------------------------------------------- 1 | 2 | 3 | main.qml 4 | qtquickcontrols2.conf 5 | PlotView.qml 6 | 7 | 8 | -------------------------------------------------------------------------------- /qmlplot.cpp: -------------------------------------------------------------------------------- 1 | #include "qmlplot.h" 2 | #include "qcustomplot.h" 3 | #include 4 | 5 | CustomPlotItem::CustomPlotItem( QQuickItem* parent ) : QQuickPaintedItem( parent ) 6 | , m_CustomPlot( nullptr ), m_timerId( 0 ) 7 | { 8 | setFlag( QQuickItem::ItemHasContents, true ); 9 | setAcceptedMouseButtons( Qt::AllButtons ); 10 | 11 | connect( this, &QQuickPaintedItem::widthChanged, this, &CustomPlotItem::updateCustomPlotSize ); 12 | connect( this, &QQuickPaintedItem::heightChanged, this, &CustomPlotItem::updateCustomPlotSize ); 13 | } 14 | 15 | CustomPlotItem::~CustomPlotItem() 16 | { 17 | delete m_CustomPlot; 18 | m_CustomPlot = nullptr; 19 | 20 | if(m_timerId != 0) { 21 | killTimer(m_timerId); 22 | } 23 | } 24 | 25 | void CustomPlotItem::initCustomPlot() 26 | { 27 | m_CustomPlot = new QCustomPlot(); 28 | 29 | updateCustomPlotSize(); 30 | m_CustomPlot->addGraph(); 31 | m_CustomPlot->graph( 0 )->setPen( QPen( Qt::red ) ); 32 | m_CustomPlot->xAxis->setLabel( "t" ); 33 | m_CustomPlot->yAxis->setLabel( "S" ); 34 | m_CustomPlot->xAxis->setRange( 0, 10 ); 35 | m_CustomPlot->yAxis->setRange( 0, 5 ); 36 | m_CustomPlot ->setInteractions( QCP::iRangeDrag | QCP::iRangeZoom ); 37 | 38 | startTimer(500); 39 | 40 | connect( m_CustomPlot, &QCustomPlot::afterReplot, this, &CustomPlotItem::onCustomReplot ); 41 | 42 | m_CustomPlot->replot(); 43 | } 44 | 45 | 46 | void CustomPlotItem::paint( QPainter* painter ) 47 | { 48 | if (m_CustomPlot) 49 | { 50 | QPixmap picture( boundingRect().size().toSize() ); 51 | QCPPainter qcpPainter( &picture ); 52 | 53 | m_CustomPlot->toPainter( &qcpPainter ); 54 | setRenderTarget(QQuickPaintedItem::FramebufferObject); 55 | 56 | painter->drawPixmap( QPoint(), picture ); 57 | } 58 | } 59 | 60 | void CustomPlotItem::mousePressEvent( QMouseEvent* event ) 61 | { 62 | qDebug() << Q_FUNC_INFO; 63 | routeMouseEvents( event ); 64 | } 65 | 66 | void CustomPlotItem::mouseReleaseEvent( QMouseEvent* event ) 67 | { 68 | qDebug() << Q_FUNC_INFO; 69 | routeMouseEvents( event ); 70 | } 71 | 72 | void CustomPlotItem::mouseMoveEvent( QMouseEvent* event ) 73 | { 74 | routeMouseEvents( event ); 75 | } 76 | 77 | void CustomPlotItem::mouseDoubleClickEvent( QMouseEvent* event ) 78 | { 79 | qDebug() << Q_FUNC_INFO; 80 | routeMouseEvents( event ); 81 | } 82 | 83 | void CustomPlotItem::wheelEvent( QWheelEvent *event ) 84 | { 85 | routeWheelEvents( event ); 86 | } 87 | 88 | void CustomPlotItem::timerEvent(QTimerEvent *event) 89 | { 90 | static double t, U; 91 | U = ((double)rand() / RAND_MAX) * 5; 92 | m_CustomPlot->graph(0)->addData(t, U); 93 | qDebug() << Q_FUNC_INFO << QString("Adding dot t = %1, S = %2").arg(t).arg(U); 94 | t++; 95 | m_CustomPlot->replot(); 96 | } 97 | 98 | void CustomPlotItem::graphClicked( QCPAbstractPlottable* plottable ) 99 | { 100 | qDebug() << Q_FUNC_INFO << QString( "Clicked on graph '%1 " ).arg( plottable->name() ); 101 | } 102 | 103 | void CustomPlotItem::routeMouseEvents( QMouseEvent* event ) 104 | { 105 | if (m_CustomPlot) 106 | { 107 | QMouseEvent* newEvent = new QMouseEvent( event->type(), event->localPos(), event->button(), event->buttons(), event->modifiers() ); 108 | QCoreApplication::postEvent( m_CustomPlot, newEvent ); 109 | } 110 | } 111 | 112 | void CustomPlotItem::routeWheelEvents( QWheelEvent* event ) 113 | { 114 | if (m_CustomPlot) 115 | { 116 | QWheelEvent* newEvent = new QWheelEvent( event->pos(), event->delta(), event->buttons(), event->modifiers(), event->orientation() ); 117 | QCoreApplication::postEvent( m_CustomPlot, newEvent ); 118 | } 119 | } 120 | 121 | void CustomPlotItem::updateCustomPlotSize() 122 | { 123 | if (m_CustomPlot) 124 | { 125 | m_CustomPlot->setGeometry(0, 0, (int)width(), (int)height()); 126 | m_CustomPlot->setViewport(QRect(0, 0, (int)width(), (int)height())); 127 | } 128 | } 129 | 130 | void CustomPlotItem::onCustomReplot() 131 | { 132 | qDebug() << Q_FUNC_INFO; 133 | update(); 134 | } 135 | -------------------------------------------------------------------------------- /qmlplot.h: -------------------------------------------------------------------------------- 1 | #ifndef QMLPLOT_H 2 | #define QMLPLOT_H 3 | 4 | #include 5 | class QCustomPlot; 6 | class QCPAbstractPlottable; 7 | 8 | class CustomPlotItem : public QQuickPaintedItem 9 | { 10 | Q_OBJECT 11 | 12 | public: 13 | CustomPlotItem( QQuickItem* parent = 0 ); 14 | virtual ~CustomPlotItem(); 15 | 16 | void paint( QPainter* painter ); 17 | 18 | Q_INVOKABLE void initCustomPlot(); 19 | 20 | protected: 21 | void routeMouseEvents( QMouseEvent* event ); 22 | void routeWheelEvents( QWheelEvent* event ); 23 | 24 | virtual void mousePressEvent( QMouseEvent* event ); 25 | virtual void mouseReleaseEvent( QMouseEvent* event ); 26 | virtual void mouseMoveEvent( QMouseEvent* event ); 27 | virtual void mouseDoubleClickEvent( QMouseEvent* event ); 28 | virtual void wheelEvent( QWheelEvent *event ); 29 | 30 | virtual void timerEvent(QTimerEvent *event); 31 | 32 | private: 33 | QCustomPlot* m_CustomPlot; 34 | int m_timerId; 35 | 36 | private slots: 37 | void graphClicked( QCPAbstractPlottable* plottable ); 38 | void onCustomReplot(); 39 | void updateCustomPlotSize(); 40 | 41 | }; 42 | 43 | #endif // QMLPLOT_H 44 | -------------------------------------------------------------------------------- /qmlplot.pro: -------------------------------------------------------------------------------- 1 | QT += qml quick core gui printsupport 2 | 3 | greaterThan(QT_MAJOR_VERSION, 4): QT += widgets 4 | 5 | CONFIG += c++11 6 | 7 | SOURCES += main.cpp \ 8 | qcustomplot.cpp \ 9 | qmlplot.cpp 10 | 11 | RESOURCES += qml.qrc 12 | 13 | # Additional import path used to resolve QML modules in Qt Creator's code model 14 | QML_IMPORT_PATH = 15 | 16 | # Additional import path used to resolve QML modules just for Qt Quick Designer 17 | QML_DESIGNER_IMPORT_PATH = 18 | 19 | # The following define makes your compiler emit warnings if you use 20 | # any feature of Qt which as been marked deprecated (the exact warnings 21 | # depend on your compiler). Please consult the documentation of the 22 | # deprecated API in order to know how to port your code away from it. 23 | DEFINES += QT_DEPRECATED_WARNINGS 24 | 25 | # You can also make your code fail to compile if you use deprecated APIs. 26 | # In order to do so, uncomment the following line. 27 | # You can also select to disable deprecated APIs only up to a certain version of Qt. 28 | #DEFINES += QT_DISABLE_DEPRECATED_BEFORE=0x060000 # disables all the APIs deprecated before Qt 6.0.0 29 | 30 | # Default rules for deployment. 31 | qnx: target.path = /tmp/$${TARGET}/bin 32 | else: unix:!android: target.path = /opt/$${TARGET}/bin 33 | !isEmpty(target.path): INSTALLS += target 34 | 35 | HEADERS += \ 36 | qcustomplot.h \ 37 | qmlplot.h 38 | -------------------------------------------------------------------------------- /qmlplot.pro.user: -------------------------------------------------------------------------------- 1 | 2 | 3 | 4 | 5 | 6 | EnvironmentId 7 | {2e2c2948-5056-44a0-80e5-a17de9da572f} 8 | 9 | 10 | ProjectExplorer.Project.ActiveTarget 11 | 0 12 | 13 | 14 | ProjectExplorer.Project.EditorSettings 15 | 16 | true 17 | false 18 | true 19 | 20 | Cpp 21 | 22 | CppGlobal 23 | 24 | 25 | 26 | QmlJS 27 | 28 | QmlJSGlobal 29 | 30 | 31 | 2 32 | UTF-8 33 | false 34 | 4 35 | false 36 | 80 37 | true 38 | true 39 | 1 40 | true 41 | false 42 | 0 43 | true 44 | true 45 | 0 46 | 8 47 | true 48 | 1 49 | true 50 | true 51 | true 52 | false 53 | 54 | 55 | 56 | ProjectExplorer.Project.PluginSettings 57 | 58 | 59 | 60 | ProjectExplorer.Project.Target.0 61 | 62 | Desktop Qt 5.7.0 MinGW 32bit 63 | Desktop Qt 5.7.0 MinGW 32bit 64 | qt.57.win32_mingw53_kit 65 | 0 66 | 0 67 | 0 68 | 69 | D:/qt project/build/build-qmlplot-Desktop_Qt_5_7_0_MinGW_32bit-Debug 70 | 71 | 72 | true 73 | qmake 74 | 75 | QtProjectManager.QMakeBuildStep 76 | true 77 | 78 | false 79 | false 80 | false 81 | 82 | 83 | true 84 | Make 85 | 86 | Qt4ProjectManager.MakeStep 87 | 88 | false 89 | 90 | 91 | 92 | 2 93 | 构建 94 | 95 | ProjectExplorer.BuildSteps.Build 96 | 97 | 98 | 99 | true 100 | Make 101 | 102 | Qt4ProjectManager.MakeStep 103 | 104 | true 105 | clean 106 | 107 | 108 | 1 109 | 清理 110 | 111 | ProjectExplorer.BuildSteps.Clean 112 | 113 | 2 114 | false 115 | 116 | Debug 117 | 118 | Qt4ProjectManager.Qt4BuildConfiguration 119 | 2 120 | true 121 | 122 | 123 | D:/qt project/build/build-qmlplot-Desktop_Qt_5_7_0_MinGW_32bit-Release 124 | 125 | 126 | true 127 | qmake 128 | 129 | QtProjectManager.QMakeBuildStep 130 | false 131 | 132 | false 133 | false 134 | false 135 | 136 | 137 | true 138 | Make 139 | 140 | Qt4ProjectManager.MakeStep 141 | 142 | false 143 | 144 | 145 | 146 | 2 147 | 构建 148 | 149 | ProjectExplorer.BuildSteps.Build 150 | 151 | 152 | 153 | true 154 | Make 155 | 156 | Qt4ProjectManager.MakeStep 157 | 158 | true 159 | clean 160 | 161 | 162 | 1 163 | 清理 164 | 165 | ProjectExplorer.BuildSteps.Clean 166 | 167 | 2 168 | false 169 | 170 | Release 171 | 172 | Qt4ProjectManager.Qt4BuildConfiguration 173 | 0 174 | true 175 | 176 | 177 | D:/qt project/build/build-qmlplot-Desktop_Qt_5_7_0_MinGW_32bit-Profile 178 | 179 | 180 | true 181 | qmake 182 | 183 | QtProjectManager.QMakeBuildStep 184 | true 185 | 186 | false 187 | true 188 | false 189 | 190 | 191 | true 192 | Make 193 | 194 | Qt4ProjectManager.MakeStep 195 | 196 | false 197 | 198 | 199 | 200 | 2 201 | 构建 202 | 203 | ProjectExplorer.BuildSteps.Build 204 | 205 | 206 | 207 | true 208 | Make 209 | 210 | Qt4ProjectManager.MakeStep 211 | 212 | true 213 | clean 214 | 215 | 216 | 1 217 | 清理 218 | 219 | ProjectExplorer.BuildSteps.Clean 220 | 221 | 2 222 | false 223 | 224 | Profile 225 | 226 | Qt4ProjectManager.Qt4BuildConfiguration 227 | 0 228 | true 229 | 230 | 3 231 | 232 | 233 | 0 234 | 部署 235 | 236 | ProjectExplorer.BuildSteps.Deploy 237 | 238 | 1 239 | 在本地部署 240 | 241 | ProjectExplorer.DefaultDeployConfiguration 242 | 243 | 1 244 | 245 | 246 | false 247 | false 248 | 1000 249 | 250 | true 251 | 252 | false 253 | false 254 | false 255 | false 256 | true 257 | 0.01 258 | 10 259 | true 260 | 1 261 | 25 262 | 263 | 1 264 | true 265 | false 266 | true 267 | valgrind 268 | 269 | 0 270 | 1 271 | 2 272 | 3 273 | 4 274 | 5 275 | 6 276 | 7 277 | 8 278 | 9 279 | 10 280 | 11 281 | 12 282 | 13 283 | 14 284 | 285 | 2 286 | 287 | qmlplot 288 | 289 | Qt4ProjectManager.Qt4RunConfiguration:D:/qt project/qmlplot/qmlplot.pro 290 | true 291 | 292 | qmlplot.pro 293 | false 294 | 295 | D:/qt project/build/build-qmlplot-Desktop_Qt_5_7_0_MinGW_32bit-Debug 296 | 3768 297 | false 298 | true 299 | false 300 | false 301 | true 302 | 303 | 1 304 | 305 | 306 | 307 | ProjectExplorer.Project.TargetCount 308 | 1 309 | 310 | 311 | ProjectExplorer.Project.Updater.FileVersion 312 | 18 313 | 314 | 315 | Version 316 | 18 317 | 318 | 319 | -------------------------------------------------------------------------------- /qtquickcontrols2.conf: -------------------------------------------------------------------------------- 1 | ; This file can be edited to change the style of the application 2 | ; See Styling Qt Quick Controls 2 in the documentation for details: 3 | ; http://doc.qt.io/qt-5/qtquickcontrols2-styles.html 4 | 5 | [Controls] 6 | Style=Material 7 | 8 | [Universal] 9 | Theme=Light 10 | ;Accent=Steel 11 | 12 | [Material] 13 | Theme=Light 14 | Accent=BlueGrey 15 | Primary=BlueGray 16 | --------------------------------------------------------------------------------