From 862dda3a12d09cab737a263fd1a6515b6e477c05 Mon Sep 17 00:00:00 2001 From: Gunnar Roth Date: Sun, 3 Jan 2016 01:03:56 +0100 Subject: [PATCH 01/23] piechart demo --- examples/piechart/FpsItem.qml | 56 +++ examples/piechart/deployment.pri | 27 ++ examples/piechart/images/spinner.png | Bin 0 -> 5222 bytes examples/piechart/main.cpp | 16 + examples/piechart/main.qml | 665 +++++++++++++++++++++++++++ examples/piechart/piechart.cpp | 79 ++++ examples/piechart/piechart.h | 89 ++++ examples/piechart/piechart.pro | 20 + examples/piechart/qml.qrc | 7 + qnanopainter.pro | 3 +- 10 files changed, 961 insertions(+), 1 deletion(-) create mode 100644 examples/piechart/FpsItem.qml create mode 100644 examples/piechart/deployment.pri create mode 100644 examples/piechart/images/spinner.png create mode 100644 examples/piechart/main.cpp create mode 100644 examples/piechart/main.qml create mode 100644 examples/piechart/piechart.cpp create mode 100644 examples/piechart/piechart.h create mode 100644 examples/piechart/piechart.pro create mode 100644 examples/piechart/qml.qrc diff --git a/examples/piechart/FpsItem.qml b/examples/piechart/FpsItem.qml new file mode 100644 index 0000000..bc5018b --- /dev/null +++ b/examples/piechart/FpsItem.qml @@ -0,0 +1,56 @@ +import QtQuick 2.0 + +Item { + id: root + property int frameCounter: 0 + property int frameCounterAvg: 0 + property int counter: 0 + property int fps: 0 + property int fpsAvg: 0 + width: 140 * dp + height: Math.floor(48 * dp) + + Image { + id: spinnerImage + anchors.verticalCenter: parent.verticalCenter + x: 4 * dp + width: 36 * dp + height: width + source: "images/spinner.png" + NumberAnimation on rotation { + from:0 + to: 360 + duration: 800 + loops: Animation.Infinite + } + onRotationChanged: frameCounter++; + } + + Text { + anchors.left: spinnerImage.right + anchors.leftMargin: 8 * dp + anchors.verticalCenter: spinnerImage.verticalCenter + color: "#c0c0c0" + //style: Text.Outline + //styleColor: "#606060" + font.pixelSize: 18 * dp + text: "Ø " + root.fpsAvg + " | " + root.fps + " fps" + } + + Timer { + interval: 2000 + repeat: true + running: true + onTriggered: { + frameCounterAvg += frameCounter; + root.fps = frameCounter/2; + counter++; + frameCounter = 0; + if (counter >= 3) { + root.fpsAvg = frameCounterAvg/(2*counter) + frameCounterAvg = 0; + counter = 0; + } + } + } +} diff --git a/examples/piechart/deployment.pri b/examples/piechart/deployment.pri new file mode 100644 index 0000000..5441b63 --- /dev/null +++ b/examples/piechart/deployment.pri @@ -0,0 +1,27 @@ +android-no-sdk { + target.path = /data/user/qt + export(target.path) + INSTALLS += target +} else:android { + x86 { + target.path = /libs/x86 + } else: armeabi-v7a { + target.path = /libs/armeabi-v7a + } else { + target.path = /libs/armeabi + } + export(target.path) + INSTALLS += target +} else:unix { + isEmpty(target.path) { + qnx { + target.path = /tmp/$${TARGET}/bin + } else { + target.path = /opt/$${TARGET}/bin + } + export(target.path) + } + INSTALLS += target +} + +export(INSTALLS) diff --git a/examples/piechart/images/spinner.png b/examples/piechart/images/spinner.png new file mode 100644 index 0000000000000000000000000000000000000000..5c6eefd8c39d3aa5c74f0ef70ea2004949be11b2 GIT binary patch literal 5222 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 literal 0 HcmV?d00001 diff --git a/examples/piechart/main.cpp b/examples/piechart/main.cpp new file mode 100644 index 0000000..a9427a7 --- /dev/null +++ b/examples/piechart/main.cpp @@ -0,0 +1,16 @@ +#include +#include +#include "piechart.h" + +int main(int argc, char *argv[]) +{ + QCoreApplication::setAttribute(Qt::AA_UseOpenGLES); + + QGuiApplication app(argc, argv); + + QQmlApplicationEngine engine; + qmlRegisterType("PieChart", 1, 0, "PieChart"); + engine.load(QUrl(QStringLiteral("qrc:/main.qml"))); + + return app.exec(); +} diff --git a/examples/piechart/main.qml b/examples/piechart/main.qml new file mode 100644 index 0000000..a22fb83 --- /dev/null +++ b/examples/piechart/main.qml @@ -0,0 +1,665 @@ +import QtQuick 2.4 +import QtQuick.Window 2.2 +import PieChart 1.0 +import "." +Window { + property real dp: Screen.pixelDensity * 25.4/160 + // This will be 1 on most platforms, 2 on iOS double retina, 3 on iPhone6 plus + property int dPRatio: Screen.devicePixelRatio + + visible: true + width: 800 + height: 480 + color: "#404040" + + Text { + id: textItem + anchors.horizontalCenter: parent.horizontalCenter + y: parent.height * 0.02 + font.pixelSize: parent.width * 0.04 + color: "lightgray" + text: "Here are some piecharts" + } + + Grid { + anchors.top: textItem.bottom + anchors.left: parent.left + anchors.right: parent.right + anchors.bottom: parent.bottom + + columns: 7 + spacing: 2 + + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + segmentStrokeWidth: 4 + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 1200 + easing.type: Easing.Linear + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + easing.type: Easing.Linear + duration: 1200 + to: 0 + } + } + } + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 750 + easing.type: Easing.OutBounce + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: false + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 3000 + easing.type: Easing.Linear + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 550 + easing.type: Easing.OutBounce + to: 100 + } + PauseAnimation { + duration: 500 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 250 + easing.type: Easing.InSine + to: 100 + } + PauseAnimation { + duration: 100 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 750 + easing.type: Easing.OutBounce + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 750 + easing.type: Easing.OutBounce + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: false + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 3000 + easing.type: Easing.Linear + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + duration: 1750 + to: 0 + } + } + } + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 1500 + easing.type: Easing.OutElastic + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + segmentStrokeColor: "lightgray" + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 750 + easing.type: Easing.OutBounce + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: false + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 1500 + easing.type: Easing.OutElastic + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: false + animateScale: true + segmentShowStroke:false + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 1500 + easing.type: Easing.OutSine + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + segmentStrokeWidth:3 + segmentStrokeColor: "black" + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 250 + easing.type: Easing.InSine + to: 100 + } + PauseAnimation { + duration: 100 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 750 + easing.type: Easing.OutBounce + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 750 + easing.type: Easing.OutBounce + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: false + segmentShowStroke:false + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 3000 + easing.type: Easing.Linear + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + duration: 1750 + to: 0 + } + } + } + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 1500 + easing.type: Easing.OutElastic + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + segmentStrokeColor:"darkblue" + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 750 + easing.type: Easing.OutBounce + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: false + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 1500 + easing.type: Easing.OutElastic + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: false + animateScale: true + segmentShowStroke:false + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 1500 + easing.type: Easing.OutSine + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 250 + easing.type: Easing.InSine + to: 100 + } + PauseAnimation { + duration: 100 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 750 + easing.type: Easing.OutBounce + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 750 + easing.type: Easing.OutBounce + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: false + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 3000 + easing.type: Easing.Linear + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + duration: 1750 + to: 0 + } + } + } + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 1500 + easing.type: Easing.OutElastic + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 750 + easing.type: Easing.OutBounce + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: false + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 1500 + easing.type: Easing.OutElastic + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: false + animateScale: true + + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 1500 + easing.type: Easing.OutSine + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + } + FpsItem { + id: fpsItem + } + +} diff --git a/examples/piechart/piechart.cpp b/examples/piechart/piechart.cpp new file mode 100644 index 0000000..5f50c74 --- /dev/null +++ b/examples/piechart/piechart.cpp @@ -0,0 +1,79 @@ +#include "piechart.h" +#include +void PieChartPainter::synchronize(QNanoQuickItem *item) +{ + // Setting values here synchronized + PieChart *realItem = static_cast(item); + if (realItem) { + m_animation = realItem->animation(); + m_animationProgress = realItem->animationProgress()/100.0; + m_animateScale = realItem->animateScale(); + m_animateRotate = realItem->animateRotate(); + m_segmentShowStroke = realItem->segmentShowStroke(); + m_segmentStrokeColor = QNanoColor::fromQColor(realItem->segmentStrokeColor()); + m_segmentStrokeWidth = realItem->segmentStrokeWidth(); + m_percentageInnerCutout = realItem->percentageInnerCutout(); + } +} + + +void PieChartPainter::paint(QNanoPainter *p) +{ + + qreal segmentTotal = 0.0; + for (auto i=0; im_value/segmentTotal) * (M_PI*2)); + p->beginPath(); + p->arc(width()/2,height()/2,scaleAnimation * pieRadius,cumulativeAngle,cumulativeAngle + segmentAngle); + p->lineTo(width()/2,height()/2); + p->closePath(); + p->setFillStyle(it->m_color); + p->fill(); + if(m_segmentShowStroke) { + p->setLineWidth(m_segmentStrokeWidth); + p->setStrokeStyle(m_segmentStrokeColor); + p->stroke(); + } + cumulativeAngle += segmentAngle; + } + + QLatin1String text("PieChart"); + QRectF box = p->textBoundingBox(text,0,0); + p->setTextAlign(QNanoPainter::ALIGN_CENTER); + box.setWidth(width()); + box.setY(box.height()); + QNanoFont f; + f.setPixelSize(25); + f.setBlur(2); + p->setFont(f); + p->setFillStyle(0xFFf8f8f8); + p->fillText(text,box); + f.setBlur(0); + p->setFont(f); + p->setFillStyle(0xFF000000); + p->fillText(text,box); + + +} + diff --git a/examples/piechart/piechart.h b/examples/piechart/piechart.h new file mode 100644 index 0000000..c792257 --- /dev/null +++ b/examples/piechart/piechart.h @@ -0,0 +1,89 @@ +#ifndef PIECHART +#define PIECHART + +#include "qnanoquickitem.h" +#include "qnanoquickitempainter.h" + +// PieChartPainter contains the painting code +class PieChartPainter : public QNanoQuickItemPainter +{ + Q_OBJECT + +public: + PieChartPainter() + { + m_data.push_back(Data(10,QNanoColor::fromQColor(Qt::green))); + m_data.push_back(Data(20,QNanoColor::fromQColor(Qt::darkBlue))); + m_data.push_back(Data(40,QNanoColor::fromQColor(Qt::magenta))); + m_data.push_back(Data(50,QNanoColor::fromQColor(Qt::darkGray))); + m_data.push_back(Data(30,QNanoColor::fromQColor(Qt::red))); + m_data.push_back(Data(90,QNanoColor::fromQColor(Qt::blue))); + m_data.push_back(Data(70,QNanoColor::fromQColor(Qt::darkYellow))); + + } + void synchronize(QNanoQuickItem *item); + void paint(QNanoPainter *p); + + class Data { + public: + Data() + :m_value(0) + {} + Data(qreal v,const QNanoColor & c) + :m_value(v) + ,m_color(c) + {} + + public: + qreal m_value; + QNanoColor m_color; + }; +private: + qreal m_animationProgress; + bool m_animation; + bool m_animateScale; + bool m_animateRotate; + bool m_segmentShowStroke; + QNanoColor m_segmentStrokeColor; + qreal m_segmentStrokeWidth; + qreal m_percentageInnerCutout; + QVector m_data; +}; +#define PIE_PROPERTY(type,name) QNANO_PROPERTY(type, m_##name, name, set##name) + +// PieChart provides the API towards QML +class PieChart : public QNanoQuickItem +{ + Q_OBJECT + PIE_PROPERTY(bool,segmentShowStroke) + PIE_PROPERTY(bool,animation) + PIE_PROPERTY(bool,animateScale) + PIE_PROPERTY(bool,animateRotate) + PIE_PROPERTY(int,animationProgress) + PIE_PROPERTY(QColor,segmentStrokeColor) + PIE_PROPERTY(qreal,segmentStrokeWidth) + PIE_PROPERTY(qreal,percentageInnerCutout) +public: + PieChart(QQuickItem *parent = 0) + : QNanoQuickItem(parent) + ,m_segmentShowStroke(true) + ,m_animation(false) + ,m_animateScale(false) + ,m_animateRotate(false) + ,m_animationProgress(0) + ,m_segmentStrokeColor("#fff") + ,m_segmentStrokeWidth(2.0) + ,m_percentageInnerCutout(50.0) + { + } + + // Reimplement + QNanoQuickItemPainter *createItemPainter() const + { + // Create painter for this item + return new PieChartPainter(); + } +}; + +#endif // PIECHART + diff --git a/examples/piechart/piechart.pro b/examples/piechart/piechart.pro new file mode 100644 index 0000000..9858317 --- /dev/null +++ b/examples/piechart/piechart.pro @@ -0,0 +1,20 @@ +TEMPLATE = app + +QT += qml quick + +SOURCES += main.cpp \ + piechart.cpp + +RESOURCES += qml.qrc + +# Additional import path used to resolve QML modules in Qt Creator's code model +QML_IMPORT_PATH = + +# Include QNanoPainter +include(../../libqnanopainter/include.pri) + +# Default rules for deployment. +include(deployment.pri) + +HEADERS += \ + piechart.h diff --git a/examples/piechart/qml.qrc b/examples/piechart/qml.qrc new file mode 100644 index 0000000..ce1633c --- /dev/null +++ b/examples/piechart/qml.qrc @@ -0,0 +1,7 @@ + + + main.qml + FpsItem.qml + images/spinner.png + + diff --git a/qnanopainter.pro b/qnanopainter.pro index 987a9bd..9859780 100644 --- a/qnanopainter.pro +++ b/qnanopainter.pro @@ -3,4 +3,5 @@ TEMPLATE = subdirs SUBDIRS += \ examples/qnanopainter_vs_qpainter_demo \ examples/gallery \ - examples/helloworld + examples/helloworld \ + examples/piechart From d4834776915929bb00b1c9af468cb325efb32e62 Mon Sep 17 00:00:00 2001 From: Gunnar Roth Date: Mon, 4 Jan 2016 17:22:37 +0100 Subject: [PATCH 02/23] implement readingi data from model as QAbstractListModel increase the number of item to 60, use 3 ItemListModels as data provider. --- examples/piechart/main.qml | 929 ++++++++++++++++++++++++++++++++- examples/piechart/piechart.cpp | 106 +++- examples/piechart/piechart.h | 61 ++- examples/piechart/piechart.pro | 2 +- 4 files changed, 1064 insertions(+), 34 deletions(-) diff --git a/examples/piechart/main.qml b/examples/piechart/main.qml index a22fb83..6820112 100644 --- a/examples/piechart/main.qml +++ b/examples/piechart/main.qml @@ -15,22 +15,164 @@ Window { Text { id: textItem anchors.horizontalCenter: parent.horizontalCenter - y: parent.height * 0.02 - font.pixelSize: parent.width * 0.04 + y: parent.height * 0.01 + font.pixelSize: parent.width * 0.015 color: "lightgray" text: "Here are some piecharts" } + ListModel { + id: pieModel1 + + ListElement { + color: "#99e600" + value: 21 + } + ListElement { + color: "#99cc00" + value: 18 + } + ListElement { + color: "#99b300" + value: 14 + } + ListElement { + color: "#9f991a" + value: 13 + } + ListElement { + color: "#a48033" + value: 13 + } + ListElement { + color: "#a9664d" + value: 13 + } + ListElement { + color: "ae4d66" + value: 12 + } + ListElement { + color: "#b33380" + value: 11 + } + ListElement { + color: "#a64086" + value: 9 + } + ListElement { + color: "#994d8d" + value: 9 + } + ListElement { + color: "#8d5a93" + value: 7 + } + ListElement { + color: "806699" + value: 6 + } + ListElement { + color: "#8073a6" + value: 4 + } + ListElement { + color: "#8080b3" + value:38 + } + } + ListModel { + id: pieModel2 + + ListElement { + color: "black" + value: 5 + } + ListElement { + color: "red" + value: 15 + } + ListElement { + color: "blue" + value: 10 + } + ListElement { + color: "gray" + value: 15 + } + ListElement { + color: "green" + value: 20 + } + ListElement { + color: "lightcyan" + value: 25 + } + ListElement { + color: "lemonchiffon" + value: 30 + } + ListElement { + color: "limegreen" + value: 35 + } + ListElement { + color: "salmon" + value: 15 + } + } + ListModel { + id: pieModel3 + + ListElement { + color: "navy" + value: 1 + } + ListElement { + color: "oldlace" + value: 2 + } + ListElement { + color: "orchid" + value: 3 + } + ListElement { + color: "royalblue" + value: 4 + } + ListElement { + color: "firebrick" + value: 5 + } + ListElement { + color: "darkseagreen" + value: 6 + } + ListElement { + color: "cornsilk" + value: 7 + } + ListElement { + color: "cadetblue" + value: 8 + } + ListElement { + color: "burlywood" + value: 9 + } + } + Grid { anchors.top: textItem.bottom anchors.left: parent.left anchors.right: parent.right anchors.bottom: parent.bottom - columns: 7 - spacing: 2 + columns: 10 + spacing: 0 PieChart { + model: pieModel1 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -55,6 +197,7 @@ Window { } } PieChart { + model: pieModel2 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -78,6 +221,7 @@ Window { } PieChart { + model: pieModel1 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -100,6 +244,7 @@ Window { } } PieChart { + model: pieModel2 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -122,6 +267,7 @@ Window { } } PieChart { + model: pieModel1 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -144,6 +290,7 @@ Window { } } PieChart { + model: pieModel2 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -166,6 +313,7 @@ Window { } } PieChart { + model: pieModel3 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -188,6 +336,7 @@ Window { } } PieChart { + model: pieModel1 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -211,6 +360,7 @@ Window { } } PieChart { + model: pieModel2 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -233,6 +383,7 @@ Window { } } PieChart { + model: pieModel3 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -255,6 +406,7 @@ Window { } } PieChart { + model: pieModel1 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -278,6 +430,7 @@ Window { } PieChart { + model: pieModel2 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -300,6 +453,7 @@ Window { } } PieChart { + model: pieModel3 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -323,6 +477,7 @@ Window { } } PieChart { + model: pieModel1 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -345,6 +500,7 @@ Window { } } PieChart { + model: pieModel2 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -367,6 +523,7 @@ Window { } } PieChart { + model: pieModel3 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -390,6 +547,7 @@ Window { } } PieChart { + model: pieModel1 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -412,6 +570,7 @@ Window { } } PieChart { + model: pieModel2 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -434,6 +593,7 @@ Window { } } PieChart { + model: pieModel2 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -457,6 +617,7 @@ Window { } PieChart { + model: pieModel3 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -479,6 +640,7 @@ Window { } } PieChart { + model: pieModel1 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -501,6 +663,7 @@ Window { } } PieChart { + model: pieModel2 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -523,6 +686,7 @@ Window { } } PieChart { + model: pieModel3 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -545,6 +709,7 @@ Window { } } PieChart { + model: pieModel1 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -568,6 +733,7 @@ Window { } } PieChart { + model: pieModel2 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -590,6 +756,7 @@ Window { } } PieChart { + model: pieModel3 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -612,6 +779,7 @@ Window { } } PieChart { + model: pieModel1 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -635,6 +803,7 @@ Window { } PieChart { + model: pieModel2 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -657,7 +826,757 @@ Window { } } } - } + PieChart { + model: pieModel1 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + segmentStrokeWidth: 4 + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 1200 + easing.type: Easing.Linear + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + easing.type: Easing.Linear + duration: 1200 + to: 0 + } + } + } + PieChart { + model: pieModel2 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 750 + easing.type: Easing.OutBounce + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + + PieChart { + model: pieModel1 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: false + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 3000 + easing.type: Easing.Linear + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + model: pieModel2 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 550 + easing.type: Easing.OutBounce + to: 100 + } + PauseAnimation { + duration: 500 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + model: pieModel1 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 250 + easing.type: Easing.InSine + to: 100 + } + PauseAnimation { + duration: 100 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + model: pieModel2 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 750 + easing.type: Easing.OutBounce + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + model: pieModel3 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 750 + easing.type: Easing.OutBounce + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + model: pieModel1 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: false + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 3000 + easing.type: Easing.Linear + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + duration: 1750 + to: 0 + } + } + } + PieChart { + model: pieModel2 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 1500 + easing.type: Easing.OutElastic + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + model: pieModel3 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + segmentStrokeColor: "lightgray" + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 750 + easing.type: Easing.OutBounce + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + model: pieModel1 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: false + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 1500 + easing.type: Easing.OutElastic + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + + PieChart { + model: pieModel2 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: false + animateScale: true + segmentShowStroke:false + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 1500 + easing.type: Easing.OutSine + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + model: pieModel3 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + segmentStrokeWidth:3 + segmentStrokeColor: "black" + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 250 + easing.type: Easing.InSine + to: 100 + } + PauseAnimation { + duration: 100 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + model: pieModel1 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 750 + easing.type: Easing.OutBounce + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + model: pieModel2 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 750 + easing.type: Easing.OutBounce + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + model: pieModel3 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: false + segmentShowStroke:false + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 3000 + easing.type: Easing.Linear + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + duration: 1750 + to: 0 + } + } + } + PieChart { + model: pieModel1 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 1500 + easing.type: Easing.OutElastic + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + model: pieModel2 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + segmentStrokeColor:"darkblue" + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 750 + easing.type: Easing.OutBounce + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + model: pieModel2 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: false + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 1500 + easing.type: Easing.OutElastic + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + + PieChart { + model: pieModel3 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: false + animateScale: true + segmentShowStroke:false + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 1500 + easing.type: Easing.OutSine + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + model: pieModel1 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 250 + easing.type: Easing.InSine + to: 100 + } + PauseAnimation { + duration: 100 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + model: pieModel2 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 750 + easing.type: Easing.OutBounce + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + model: pieModel3 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 750 + easing.type: Easing.OutBounce + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + model: pieModel1 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: false + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 3000 + easing.type: Easing.Linear + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + duration: 1750 + to: 0 + } + } + } + PieChart { + model: pieModel2 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 1500 + easing.type: Easing.OutElastic + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + model: pieModel2 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: false + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 1500 + easing.type: Easing.OutElastic + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + + PieChart { + model: pieModel3 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: false + animateScale: true + segmentShowStroke:false + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 1500 + easing.type: Easing.OutSine + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + model: pieModel1 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 250 + easing.type: Easing.InSine + to: 100 + } + PauseAnimation { + duration: 100 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + model: pieModel2 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 750 + easing.type: Easing.OutBounce + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + + PieChart { + model: pieModel3 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 750 + easing.type: Easing.OutBounce + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + model: pieModel1 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: false + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 1500 + easing.type: Easing.OutElastic + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + + PieChart { + model: pieModel2 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: false + animateScale: true + + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 1500 + easing.type: Easing.OutSine + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + } + FpsItem { id: fpsItem } diff --git a/examples/piechart/piechart.cpp b/examples/piechart/piechart.cpp index 5f50c74..8b85d3e 100644 --- a/examples/piechart/piechart.cpp +++ b/examples/piechart/piechart.cpp @@ -1,5 +1,8 @@ #include "piechart.h" #include + +#include + void PieChartPainter::synchronize(QNanoQuickItem *item) { // Setting values here synchronized @@ -13,19 +16,14 @@ void PieChartPainter::synchronize(QNanoQuickItem *item) m_segmentStrokeColor = QNanoColor::fromQColor(realItem->segmentStrokeColor()); m_segmentStrokeWidth = realItem->segmentStrokeWidth(); m_percentageInnerCutout = realItem->percentageInnerCutout(); + m_data = realItem->data(&m_totalValue); + } } void PieChartPainter::paint(QNanoPainter *p) { - - qreal segmentTotal = 0.0; - for (auto i=0; im_value/segmentTotal) * (M_PI*2)); + qreal segmentAngle = rotateAnimation * ((it->m_value/m_totalValue) * (M_PI*2)); p->beginPath(); p->arc(width()/2,height()/2,scaleAnimation * pieRadius,cumulativeAngle,cumulativeAngle + segmentAngle); p->lineTo(width()/2,height()/2); @@ -51,6 +49,7 @@ void PieChartPainter::paint(QNanoPainter *p) p->setFillStyle(it->m_color); p->fill(); if(m_segmentShowStroke) { + p->setLineJoin(QNanoPainter::JOIN_ROUND); p->setLineWidth(m_segmentStrokeWidth); p->setStrokeStyle(m_segmentStrokeColor); p->stroke(); @@ -77,3 +76,94 @@ void PieChartPainter::paint(QNanoPainter *p) } + +PieChart::PieChart(QQuickItem *parent) + : QNanoQuickItem(parent) + ,m_segmentShowStroke(true) + ,m_animation(false) + ,m_animateScale(false) + ,m_animateRotate(false) + ,m_animationProgress(0) + ,m_segmentStrokeColor("#fff") + ,m_segmentStrokeWidth(2.0) + ,m_percentageInnerCutout(50.0) + ,m_model(0) + ,m_dataSourceIsObject(false) + +{ + m_data.push_back(PieChartPainter::Data(10,QNanoColor::fromQColor(Qt::green))); + m_data.push_back(PieChartPainter::Data(20,QNanoColor::fromQColor(Qt::darkBlue))); + m_data.push_back(PieChartPainter::Data(40,QNanoColor::fromQColor(Qt::magenta))); + m_data.push_back(PieChartPainter::Data(50,QNanoColor::fromQColor(Qt::darkGray))); + m_data.push_back(PieChartPainter::Data(30,QNanoColor::fromQColor(Qt::red))); + m_data.push_back(PieChartPainter::Data(90,QNanoColor::fromQColor(Qt::blue))); + m_data.push_back(PieChartPainter::Data(70,QNanoColor::fromQColor(Qt::darkYellow))); + updateTotalValue(); +} + +PieChart::~PieChart() +{ +} +QVariant PieChart::model() const +{ + + if (m_dataSourceIsObject) { + QObject *o = m_model; + return QVariant::fromValue(o); + } + + return m_dataSource; +} + +void PieChart::setModel(const QVariant &m) +{ + QVariant model = m; + if (model.userType() == qMetaTypeId()) + model = model.value().toVariant(); + + if (m_dataSource == model) + return; + + if (m_model) { + disconnect(m_model, &QAbstractListModel::dataChanged, + this, &PieChart::dataChanged); + } + m_dataSource = model; + QObject *object = qvariant_cast(model); + m_dataSourceIsObject = object != 0; + QAbstractListModel *alm = 0; + if (object && (alm = qobject_cast(object))) { + m_model = alm; + } + if (m_model) { + connect(m_model, &QAbstractListModel::dataChanged, + this, &PieChart::dataChanged); + updateData(); + } + emit modelChanged(); +} + +void PieChart::updateData() { + QVariant m = model(); + QObject *object = qvariant_cast(m); + QAbstractListModel *alm = 0; + if (object && (alm = qobject_cast(object))) { + m_data.clear(); + int roleValue = alm->roleNames().key(QByteArray("value")); + int roleColor = alm->roleNames().key(QByteArray("color")); + + for (int row = 0; row < alm->rowCount(); ++row) { + QModelIndex index = alm->index(row); + QString color = alm->data(index,roleColor).value(); + double value = alm->data(index,roleValue).toDouble(); + m_data.push_back(PieChartPainter::Data(value,QNanoColor::fromQColor(QColor(color)))); + } + } + updateTotalValue(); + update(); +} + +void PieChart::dataChanged(const QModelIndex & /*topLeft*/, const QModelIndex & /*bottomRight*/, const QVector & /*roles*/) +{ + updateData(); +} diff --git a/examples/piechart/piechart.h b/examples/piechart/piechart.h index c792257..550b26d 100644 --- a/examples/piechart/piechart.h +++ b/examples/piechart/piechart.h @@ -3,6 +3,8 @@ #include "qnanoquickitem.h" #include "qnanoquickitempainter.h" +#include +#include // PieChartPainter contains the painting code class PieChartPainter : public QNanoQuickItemPainter @@ -12,13 +14,6 @@ class PieChartPainter : public QNanoQuickItemPainter public: PieChartPainter() { - m_data.push_back(Data(10,QNanoColor::fromQColor(Qt::green))); - m_data.push_back(Data(20,QNanoColor::fromQColor(Qt::darkBlue))); - m_data.push_back(Data(40,QNanoColor::fromQColor(Qt::magenta))); - m_data.push_back(Data(50,QNanoColor::fromQColor(Qt::darkGray))); - m_data.push_back(Data(30,QNanoColor::fromQColor(Qt::red))); - m_data.push_back(Data(90,QNanoColor::fromQColor(Qt::blue))); - m_data.push_back(Data(70,QNanoColor::fromQColor(Qt::darkYellow))); } void synchronize(QNanoQuickItem *item); @@ -48,10 +43,12 @@ class PieChartPainter : public QNanoQuickItemPainter qreal m_segmentStrokeWidth; qreal m_percentageInnerCutout; QVector m_data; + qreal m_totalValue; }; #define PIE_PROPERTY(type,name) QNANO_PROPERTY(type, m_##name, name, set##name) // PieChart provides the API towards QML + class PieChart : public QNanoQuickItem { Q_OBJECT @@ -63,26 +60,50 @@ class PieChart : public QNanoQuickItem PIE_PROPERTY(QColor,segmentStrokeColor) PIE_PROPERTY(qreal,segmentStrokeWidth) PIE_PROPERTY(qreal,percentageInnerCutout) -public: - PieChart(QQuickItem *parent = 0) - : QNanoQuickItem(parent) - ,m_segmentShowStroke(true) - ,m_animation(false) - ,m_animateScale(false) - ,m_animateRotate(false) - ,m_animationProgress(0) - ,m_segmentStrokeColor("#fff") - ,m_segmentStrokeWidth(2.0) - ,m_percentageInnerCutout(50.0) - { - } + Q_PROPERTY(QVariant model READ model WRITE setModel NOTIFY modelChanged) + + QVector m_data; + qreal m_totalValue; + QPointer m_model; + QVariant m_dataSource; + bool m_dataSourceIsObject : 1; + +public: + PieChart(QQuickItem *parent = 0); + ~PieChart(); // Reimplement QNanoQuickItemPainter *createItemPainter() const { // Create painter for this item return new PieChartPainter(); } + + QVariant model() const; + void setModel(const QVariant &); + + QVector data(qreal * ptotalValue) { + *ptotalValue = m_totalValue; + return m_data; + } +protected: + + void updateData(); + void updateTotalValue() { + m_totalValue = 0.0; + for (auto it = m_data.cbegin(); it != m_data.cend(); ++it) { + m_totalValue += it->m_value; + } + + } + +Q_SIGNALS: + void modelChanged(); + +private Q_SLOTS: + void dataChanged(const QModelIndex & topLeft, const QModelIndex & bottomRight, const QVector & roles ); + + }; #endif // PIECHART diff --git a/examples/piechart/piechart.pro b/examples/piechart/piechart.pro index 9858317..5d9a9cd 100644 --- a/examples/piechart/piechart.pro +++ b/examples/piechart/piechart.pro @@ -1,6 +1,6 @@ TEMPLATE = app -QT += qml quick +QT += qml quick qml-private SOURCES += main.cpp \ piechart.cpp From b0e975d6b3c77810979395464566112f09583777 Mon Sep 17 00:00:00 2001 From: Gunnar Roth Date: Wed, 6 Jan 2016 18:13:22 +0100 Subject: [PATCH 03/23] remove unused header --- examples/piechart/piechart.cpp | 2 -- 1 file changed, 2 deletions(-) diff --git a/examples/piechart/piechart.cpp b/examples/piechart/piechart.cpp index 8b85d3e..8955fc2 100644 --- a/examples/piechart/piechart.cpp +++ b/examples/piechart/piechart.cpp @@ -1,8 +1,6 @@ #include "piechart.h" #include -#include - void PieChartPainter::synchronize(QNanoQuickItem *item) { // Setting values here synchronized From 180f2056d8566ca1c5a04f53e31f4425b69c15bc Mon Sep 17 00:00:00 2001 From: Gunnar Roth Date: Wed, 6 Jan 2016 18:43:50 +0100 Subject: [PATCH 04/23] adapt colum count to window size and use flickable to scroll. takes orientation into account for window size and calculates the column count based on this. a flivkable allow to scroll the content now if it is larger than the screen. --- examples/piechart/main.qml | 18 ++++++++++-------- 1 file changed, 10 insertions(+), 8 deletions(-) diff --git a/examples/piechart/main.qml b/examples/piechart/main.qml index 6820112..c94f9e7 100644 --- a/examples/piechart/main.qml +++ b/examples/piechart/main.qml @@ -3,13 +3,14 @@ import QtQuick.Window 2.2 import PieChart 1.0 import "." Window { + id: root property real dp: Screen.pixelDensity * 25.4/160 // This will be 1 on most platforms, 2 on iOS double retina, 3 on iPhone6 plus property int dPRatio: Screen.devicePixelRatio visible: true - width: 800 - height: 480 + width: Screen.primaryOrientation === Qt.LandscapeOrientation ? 800:480 + height: Screen.primaryOrientation === Qt.LandscapeOrientation ? 480:800 color: "#404040" Text { @@ -161,16 +162,17 @@ Window { value: 9 } } - - Grid { + Flickable { anchors.top: textItem.bottom anchors.left: parent.left anchors.right: parent.right anchors.bottom: parent.bottom - - columns: 10 + contentWidth: grid.width; contentHeight: grid.height + Grid { + id: grid + columns: width / 80 spacing: 0 - + width: root.width PieChart { model: pieModel1 width:(parent.width - 2*parent.spacing)/parent.columns @@ -1576,7 +1578,7 @@ Window { } } } - + } FpsItem { id: fpsItem } From 4c6cc54c5228d35844c1f9886b321c072de32908 Mon Sep 17 00:00:00 2001 From: Gunnar Roth Date: Fri, 8 Jan 2016 08:16:21 +0100 Subject: [PATCH 05/23] remove unsued qml-private from piechart.pro --- examples/piechart/piechart.pro | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/examples/piechart/piechart.pro b/examples/piechart/piechart.pro index 5d9a9cd..9858317 100644 --- a/examples/piechart/piechart.pro +++ b/examples/piechart/piechart.pro @@ -1,6 +1,6 @@ TEMPLATE = app -QT += qml quick qml-private +QT += qml quick SOURCES += main.cpp \ piechart.cpp From f44f4abb7237f99f8db9404933caed48e9275b1c Mon Sep 17 00:00:00 2001 From: Gunnar Roth Date: Fri, 8 Jan 2016 08:21:55 +0100 Subject: [PATCH 06/23] add CONFIG += c++11 to piechart.pro i use c++11 style connnect/disconnect. didnt need that on windows (msvc always has c++11 enable) but with qt 5.6 it seems it is not need onosx too, but on linux i suppose it is still needed. --- examples/piechart/piechart.pro | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/examples/piechart/piechart.pro b/examples/piechart/piechart.pro index 9858317..952d3e9 100644 --- a/examples/piechart/piechart.pro +++ b/examples/piechart/piechart.pro @@ -1,5 +1,5 @@ TEMPLATE = app - +CONFIG += c++11 QT += qml quick SOURCES += main.cpp \ From 20454f91c26791ff4ff4fbd26bbdca9222dd0500 Mon Sep 17 00:00:00 2001 From: Gunnar Roth Date: Sun, 10 Jan 2016 17:09:05 +0100 Subject: [PATCH 07/23] fix build with gcc4.8, use data() for QPointer sender in connect() --- examples/piechart/piechart.cpp | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/examples/piechart/piechart.cpp b/examples/piechart/piechart.cpp index 8955fc2..e979a75 100644 --- a/examples/piechart/piechart.cpp +++ b/examples/piechart/piechart.cpp @@ -123,7 +123,7 @@ void PieChart::setModel(const QVariant &m) return; if (m_model) { - disconnect(m_model, &QAbstractListModel::dataChanged, + disconnect(m_model.data(), &QAbstractListModel::dataChanged, this, &PieChart::dataChanged); } m_dataSource = model; @@ -134,7 +134,7 @@ void PieChart::setModel(const QVariant &m) m_model = alm; } if (m_model) { - connect(m_model, &QAbstractListModel::dataChanged, + connect(m_model.data(), &QAbstractListModel::dataChanged, this, &PieChart::dataChanged); updateData(); } From d65d78e1d26c3c3adeba62b291f5a6b26f119162 Mon Sep 17 00:00:00 2001 From: Gunnar Roth Date: Sun, 3 Jan 2016 01:03:56 +0100 Subject: [PATCH 08/23] piechart demo --- examples/piechart/FpsItem.qml | 56 +++ examples/piechart/deployment.pri | 27 ++ examples/piechart/images/spinner.png | Bin 0 -> 5222 bytes examples/piechart/main.cpp | 16 + examples/piechart/main.qml | 665 +++++++++++++++++++++++++++ examples/piechart/piechart.cpp | 79 ++++ examples/piechart/piechart.h | 89 ++++ examples/piechart/piechart.pro | 20 + examples/piechart/qml.qrc | 7 + qnanopainter.pro | 3 +- 10 files changed, 961 insertions(+), 1 deletion(-) create mode 100644 examples/piechart/FpsItem.qml create mode 100644 examples/piechart/deployment.pri create mode 100644 examples/piechart/images/spinner.png create mode 100644 examples/piechart/main.cpp create mode 100644 examples/piechart/main.qml create mode 100644 examples/piechart/piechart.cpp create mode 100644 examples/piechart/piechart.h create mode 100644 examples/piechart/piechart.pro create mode 100644 examples/piechart/qml.qrc diff --git a/examples/piechart/FpsItem.qml b/examples/piechart/FpsItem.qml new file mode 100644 index 0000000..bc5018b --- /dev/null +++ b/examples/piechart/FpsItem.qml @@ -0,0 +1,56 @@ +import QtQuick 2.0 + +Item { + id: root + property int frameCounter: 0 + property int frameCounterAvg: 0 + property int counter: 0 + property int fps: 0 + property int fpsAvg: 0 + width: 140 * dp + height: Math.floor(48 * dp) + + Image { + id: spinnerImage + anchors.verticalCenter: parent.verticalCenter + x: 4 * dp + width: 36 * dp + height: width + source: "images/spinner.png" + NumberAnimation on rotation { + from:0 + to: 360 + duration: 800 + loops: Animation.Infinite + } + onRotationChanged: frameCounter++; + } + + Text { + anchors.left: spinnerImage.right + anchors.leftMargin: 8 * dp + anchors.verticalCenter: spinnerImage.verticalCenter + color: "#c0c0c0" + //style: Text.Outline + //styleColor: "#606060" + font.pixelSize: 18 * dp + text: "Ø " + root.fpsAvg + " | " + root.fps + " fps" + } + + Timer { + interval: 2000 + repeat: true + running: true + onTriggered: { + frameCounterAvg += frameCounter; + root.fps = frameCounter/2; + counter++; + frameCounter = 0; + if (counter >= 3) { + root.fpsAvg = frameCounterAvg/(2*counter) + frameCounterAvg = 0; + counter = 0; + } + } + } +} diff --git a/examples/piechart/deployment.pri b/examples/piechart/deployment.pri new file mode 100644 index 0000000..5441b63 --- /dev/null +++ b/examples/piechart/deployment.pri @@ -0,0 +1,27 @@ +android-no-sdk { + target.path = /data/user/qt + export(target.path) + INSTALLS += target +} else:android { + x86 { + target.path = /libs/x86 + } else: armeabi-v7a { + target.path = /libs/armeabi-v7a + } else { + target.path = /libs/armeabi + } + export(target.path) + INSTALLS += target +} else:unix { + isEmpty(target.path) { + qnx { + target.path = /tmp/$${TARGET}/bin + } else { + target.path = /opt/$${TARGET}/bin + } + export(target.path) + } + INSTALLS += target +} + +export(INSTALLS) diff --git a/examples/piechart/images/spinner.png b/examples/piechart/images/spinner.png new file mode 100644 index 0000000000000000000000000000000000000000..5c6eefd8c39d3aa5c74f0ef70ea2004949be11b2 GIT binary patch literal 5222 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 literal 0 HcmV?d00001 diff --git a/examples/piechart/main.cpp b/examples/piechart/main.cpp new file mode 100644 index 0000000..a9427a7 --- /dev/null +++ b/examples/piechart/main.cpp @@ -0,0 +1,16 @@ +#include +#include +#include "piechart.h" + +int main(int argc, char *argv[]) +{ + QCoreApplication::setAttribute(Qt::AA_UseOpenGLES); + + QGuiApplication app(argc, argv); + + QQmlApplicationEngine engine; + qmlRegisterType("PieChart", 1, 0, "PieChart"); + engine.load(QUrl(QStringLiteral("qrc:/main.qml"))); + + return app.exec(); +} diff --git a/examples/piechart/main.qml b/examples/piechart/main.qml new file mode 100644 index 0000000..a22fb83 --- /dev/null +++ b/examples/piechart/main.qml @@ -0,0 +1,665 @@ +import QtQuick 2.4 +import QtQuick.Window 2.2 +import PieChart 1.0 +import "." +Window { + property real dp: Screen.pixelDensity * 25.4/160 + // This will be 1 on most platforms, 2 on iOS double retina, 3 on iPhone6 plus + property int dPRatio: Screen.devicePixelRatio + + visible: true + width: 800 + height: 480 + color: "#404040" + + Text { + id: textItem + anchors.horizontalCenter: parent.horizontalCenter + y: parent.height * 0.02 + font.pixelSize: parent.width * 0.04 + color: "lightgray" + text: "Here are some piecharts" + } + + Grid { + anchors.top: textItem.bottom + anchors.left: parent.left + anchors.right: parent.right + anchors.bottom: parent.bottom + + columns: 7 + spacing: 2 + + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + segmentStrokeWidth: 4 + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 1200 + easing.type: Easing.Linear + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + easing.type: Easing.Linear + duration: 1200 + to: 0 + } + } + } + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 750 + easing.type: Easing.OutBounce + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: false + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 3000 + easing.type: Easing.Linear + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 550 + easing.type: Easing.OutBounce + to: 100 + } + PauseAnimation { + duration: 500 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 250 + easing.type: Easing.InSine + to: 100 + } + PauseAnimation { + duration: 100 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 750 + easing.type: Easing.OutBounce + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 750 + easing.type: Easing.OutBounce + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: false + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 3000 + easing.type: Easing.Linear + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + duration: 1750 + to: 0 + } + } + } + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 1500 + easing.type: Easing.OutElastic + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + segmentStrokeColor: "lightgray" + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 750 + easing.type: Easing.OutBounce + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: false + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 1500 + easing.type: Easing.OutElastic + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: false + animateScale: true + segmentShowStroke:false + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 1500 + easing.type: Easing.OutSine + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + segmentStrokeWidth:3 + segmentStrokeColor: "black" + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 250 + easing.type: Easing.InSine + to: 100 + } + PauseAnimation { + duration: 100 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 750 + easing.type: Easing.OutBounce + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 750 + easing.type: Easing.OutBounce + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: false + segmentShowStroke:false + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 3000 + easing.type: Easing.Linear + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + duration: 1750 + to: 0 + } + } + } + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 1500 + easing.type: Easing.OutElastic + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + segmentStrokeColor:"darkblue" + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 750 + easing.type: Easing.OutBounce + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: false + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 1500 + easing.type: Easing.OutElastic + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: false + animateScale: true + segmentShowStroke:false + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 1500 + easing.type: Easing.OutSine + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 250 + easing.type: Easing.InSine + to: 100 + } + PauseAnimation { + duration: 100 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 750 + easing.type: Easing.OutBounce + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 750 + easing.type: Easing.OutBounce + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: false + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 3000 + easing.type: Easing.Linear + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + duration: 1750 + to: 0 + } + } + } + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 1500 + easing.type: Easing.OutElastic + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 750 + easing.type: Easing.OutBounce + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: false + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 1500 + easing.type: Easing.OutElastic + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: false + animateScale: true + + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 1500 + easing.type: Easing.OutSine + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + } + FpsItem { + id: fpsItem + } + +} diff --git a/examples/piechart/piechart.cpp b/examples/piechart/piechart.cpp new file mode 100644 index 0000000..5f50c74 --- /dev/null +++ b/examples/piechart/piechart.cpp @@ -0,0 +1,79 @@ +#include "piechart.h" +#include +void PieChartPainter::synchronize(QNanoQuickItem *item) +{ + // Setting values here synchronized + PieChart *realItem = static_cast(item); + if (realItem) { + m_animation = realItem->animation(); + m_animationProgress = realItem->animationProgress()/100.0; + m_animateScale = realItem->animateScale(); + m_animateRotate = realItem->animateRotate(); + m_segmentShowStroke = realItem->segmentShowStroke(); + m_segmentStrokeColor = QNanoColor::fromQColor(realItem->segmentStrokeColor()); + m_segmentStrokeWidth = realItem->segmentStrokeWidth(); + m_percentageInnerCutout = realItem->percentageInnerCutout(); + } +} + + +void PieChartPainter::paint(QNanoPainter *p) +{ + + qreal segmentTotal = 0.0; + for (auto i=0; im_value/segmentTotal) * (M_PI*2)); + p->beginPath(); + p->arc(width()/2,height()/2,scaleAnimation * pieRadius,cumulativeAngle,cumulativeAngle + segmentAngle); + p->lineTo(width()/2,height()/2); + p->closePath(); + p->setFillStyle(it->m_color); + p->fill(); + if(m_segmentShowStroke) { + p->setLineWidth(m_segmentStrokeWidth); + p->setStrokeStyle(m_segmentStrokeColor); + p->stroke(); + } + cumulativeAngle += segmentAngle; + } + + QLatin1String text("PieChart"); + QRectF box = p->textBoundingBox(text,0,0); + p->setTextAlign(QNanoPainter::ALIGN_CENTER); + box.setWidth(width()); + box.setY(box.height()); + QNanoFont f; + f.setPixelSize(25); + f.setBlur(2); + p->setFont(f); + p->setFillStyle(0xFFf8f8f8); + p->fillText(text,box); + f.setBlur(0); + p->setFont(f); + p->setFillStyle(0xFF000000); + p->fillText(text,box); + + +} + diff --git a/examples/piechart/piechart.h b/examples/piechart/piechart.h new file mode 100644 index 0000000..c792257 --- /dev/null +++ b/examples/piechart/piechart.h @@ -0,0 +1,89 @@ +#ifndef PIECHART +#define PIECHART + +#include "qnanoquickitem.h" +#include "qnanoquickitempainter.h" + +// PieChartPainter contains the painting code +class PieChartPainter : public QNanoQuickItemPainter +{ + Q_OBJECT + +public: + PieChartPainter() + { + m_data.push_back(Data(10,QNanoColor::fromQColor(Qt::green))); + m_data.push_back(Data(20,QNanoColor::fromQColor(Qt::darkBlue))); + m_data.push_back(Data(40,QNanoColor::fromQColor(Qt::magenta))); + m_data.push_back(Data(50,QNanoColor::fromQColor(Qt::darkGray))); + m_data.push_back(Data(30,QNanoColor::fromQColor(Qt::red))); + m_data.push_back(Data(90,QNanoColor::fromQColor(Qt::blue))); + m_data.push_back(Data(70,QNanoColor::fromQColor(Qt::darkYellow))); + + } + void synchronize(QNanoQuickItem *item); + void paint(QNanoPainter *p); + + class Data { + public: + Data() + :m_value(0) + {} + Data(qreal v,const QNanoColor & c) + :m_value(v) + ,m_color(c) + {} + + public: + qreal m_value; + QNanoColor m_color; + }; +private: + qreal m_animationProgress; + bool m_animation; + bool m_animateScale; + bool m_animateRotate; + bool m_segmentShowStroke; + QNanoColor m_segmentStrokeColor; + qreal m_segmentStrokeWidth; + qreal m_percentageInnerCutout; + QVector m_data; +}; +#define PIE_PROPERTY(type,name) QNANO_PROPERTY(type, m_##name, name, set##name) + +// PieChart provides the API towards QML +class PieChart : public QNanoQuickItem +{ + Q_OBJECT + PIE_PROPERTY(bool,segmentShowStroke) + PIE_PROPERTY(bool,animation) + PIE_PROPERTY(bool,animateScale) + PIE_PROPERTY(bool,animateRotate) + PIE_PROPERTY(int,animationProgress) + PIE_PROPERTY(QColor,segmentStrokeColor) + PIE_PROPERTY(qreal,segmentStrokeWidth) + PIE_PROPERTY(qreal,percentageInnerCutout) +public: + PieChart(QQuickItem *parent = 0) + : QNanoQuickItem(parent) + ,m_segmentShowStroke(true) + ,m_animation(false) + ,m_animateScale(false) + ,m_animateRotate(false) + ,m_animationProgress(0) + ,m_segmentStrokeColor("#fff") + ,m_segmentStrokeWidth(2.0) + ,m_percentageInnerCutout(50.0) + { + } + + // Reimplement + QNanoQuickItemPainter *createItemPainter() const + { + // Create painter for this item + return new PieChartPainter(); + } +}; + +#endif // PIECHART + diff --git a/examples/piechart/piechart.pro b/examples/piechart/piechart.pro new file mode 100644 index 0000000..9858317 --- /dev/null +++ b/examples/piechart/piechart.pro @@ -0,0 +1,20 @@ +TEMPLATE = app + +QT += qml quick + +SOURCES += main.cpp \ + piechart.cpp + +RESOURCES += qml.qrc + +# Additional import path used to resolve QML modules in Qt Creator's code model +QML_IMPORT_PATH = + +# Include QNanoPainter +include(../../libqnanopainter/include.pri) + +# Default rules for deployment. +include(deployment.pri) + +HEADERS += \ + piechart.h diff --git a/examples/piechart/qml.qrc b/examples/piechart/qml.qrc new file mode 100644 index 0000000..ce1633c --- /dev/null +++ b/examples/piechart/qml.qrc @@ -0,0 +1,7 @@ + + + main.qml + FpsItem.qml + images/spinner.png + + diff --git a/qnanopainter.pro b/qnanopainter.pro index 987a9bd..9859780 100644 --- a/qnanopainter.pro +++ b/qnanopainter.pro @@ -3,4 +3,5 @@ TEMPLATE = subdirs SUBDIRS += \ examples/qnanopainter_vs_qpainter_demo \ examples/gallery \ - examples/helloworld + examples/helloworld \ + examples/piechart From 431f0caaf75519e1e175fb78a0e062fb8ae9b2a8 Mon Sep 17 00:00:00 2001 From: Gunnar Roth Date: Mon, 4 Jan 2016 17:22:37 +0100 Subject: [PATCH 09/23] implement readingi data from model as QAbstractListModel increase the number of item to 60, use 3 ItemListModels as data provider. --- examples/piechart/main.qml | 929 ++++++++++++++++++++++++++++++++- examples/piechart/piechart.cpp | 106 +++- examples/piechart/piechart.h | 61 ++- examples/piechart/piechart.pro | 2 +- 4 files changed, 1064 insertions(+), 34 deletions(-) diff --git a/examples/piechart/main.qml b/examples/piechart/main.qml index a22fb83..6820112 100644 --- a/examples/piechart/main.qml +++ b/examples/piechart/main.qml @@ -15,22 +15,164 @@ Window { Text { id: textItem anchors.horizontalCenter: parent.horizontalCenter - y: parent.height * 0.02 - font.pixelSize: parent.width * 0.04 + y: parent.height * 0.01 + font.pixelSize: parent.width * 0.015 color: "lightgray" text: "Here are some piecharts" } + ListModel { + id: pieModel1 + + ListElement { + color: "#99e600" + value: 21 + } + ListElement { + color: "#99cc00" + value: 18 + } + ListElement { + color: "#99b300" + value: 14 + } + ListElement { + color: "#9f991a" + value: 13 + } + ListElement { + color: "#a48033" + value: 13 + } + ListElement { + color: "#a9664d" + value: 13 + } + ListElement { + color: "ae4d66" + value: 12 + } + ListElement { + color: "#b33380" + value: 11 + } + ListElement { + color: "#a64086" + value: 9 + } + ListElement { + color: "#994d8d" + value: 9 + } + ListElement { + color: "#8d5a93" + value: 7 + } + ListElement { + color: "806699" + value: 6 + } + ListElement { + color: "#8073a6" + value: 4 + } + ListElement { + color: "#8080b3" + value:38 + } + } + ListModel { + id: pieModel2 + + ListElement { + color: "black" + value: 5 + } + ListElement { + color: "red" + value: 15 + } + ListElement { + color: "blue" + value: 10 + } + ListElement { + color: "gray" + value: 15 + } + ListElement { + color: "green" + value: 20 + } + ListElement { + color: "lightcyan" + value: 25 + } + ListElement { + color: "lemonchiffon" + value: 30 + } + ListElement { + color: "limegreen" + value: 35 + } + ListElement { + color: "salmon" + value: 15 + } + } + ListModel { + id: pieModel3 + + ListElement { + color: "navy" + value: 1 + } + ListElement { + color: "oldlace" + value: 2 + } + ListElement { + color: "orchid" + value: 3 + } + ListElement { + color: "royalblue" + value: 4 + } + ListElement { + color: "firebrick" + value: 5 + } + ListElement { + color: "darkseagreen" + value: 6 + } + ListElement { + color: "cornsilk" + value: 7 + } + ListElement { + color: "cadetblue" + value: 8 + } + ListElement { + color: "burlywood" + value: 9 + } + } + Grid { anchors.top: textItem.bottom anchors.left: parent.left anchors.right: parent.right anchors.bottom: parent.bottom - columns: 7 - spacing: 2 + columns: 10 + spacing: 0 PieChart { + model: pieModel1 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -55,6 +197,7 @@ Window { } } PieChart { + model: pieModel2 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -78,6 +221,7 @@ Window { } PieChart { + model: pieModel1 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -100,6 +244,7 @@ Window { } } PieChart { + model: pieModel2 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -122,6 +267,7 @@ Window { } } PieChart { + model: pieModel1 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -144,6 +290,7 @@ Window { } } PieChart { + model: pieModel2 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -166,6 +313,7 @@ Window { } } PieChart { + model: pieModel3 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -188,6 +336,7 @@ Window { } } PieChart { + model: pieModel1 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -211,6 +360,7 @@ Window { } } PieChart { + model: pieModel2 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -233,6 +383,7 @@ Window { } } PieChart { + model: pieModel3 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -255,6 +406,7 @@ Window { } } PieChart { + model: pieModel1 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -278,6 +430,7 @@ Window { } PieChart { + model: pieModel2 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -300,6 +453,7 @@ Window { } } PieChart { + model: pieModel3 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -323,6 +477,7 @@ Window { } } PieChart { + model: pieModel1 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -345,6 +500,7 @@ Window { } } PieChart { + model: pieModel2 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -367,6 +523,7 @@ Window { } } PieChart { + model: pieModel3 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -390,6 +547,7 @@ Window { } } PieChart { + model: pieModel1 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -412,6 +570,7 @@ Window { } } PieChart { + model: pieModel2 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -434,6 +593,7 @@ Window { } } PieChart { + model: pieModel2 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -457,6 +617,7 @@ Window { } PieChart { + model: pieModel3 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -479,6 +640,7 @@ Window { } } PieChart { + model: pieModel1 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -501,6 +663,7 @@ Window { } } PieChart { + model: pieModel2 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -523,6 +686,7 @@ Window { } } PieChart { + model: pieModel3 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -545,6 +709,7 @@ Window { } } PieChart { + model: pieModel1 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -568,6 +733,7 @@ Window { } } PieChart { + model: pieModel2 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -590,6 +756,7 @@ Window { } } PieChart { + model: pieModel3 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -612,6 +779,7 @@ Window { } } PieChart { + model: pieModel1 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -635,6 +803,7 @@ Window { } PieChart { + model: pieModel2 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -657,7 +826,757 @@ Window { } } } - } + PieChart { + model: pieModel1 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + segmentStrokeWidth: 4 + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 1200 + easing.type: Easing.Linear + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + easing.type: Easing.Linear + duration: 1200 + to: 0 + } + } + } + PieChart { + model: pieModel2 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 750 + easing.type: Easing.OutBounce + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + + PieChart { + model: pieModel1 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: false + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 3000 + easing.type: Easing.Linear + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + model: pieModel2 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 550 + easing.type: Easing.OutBounce + to: 100 + } + PauseAnimation { + duration: 500 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + model: pieModel1 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 250 + easing.type: Easing.InSine + to: 100 + } + PauseAnimation { + duration: 100 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + model: pieModel2 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 750 + easing.type: Easing.OutBounce + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + model: pieModel3 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 750 + easing.type: Easing.OutBounce + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + model: pieModel1 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: false + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 3000 + easing.type: Easing.Linear + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + duration: 1750 + to: 0 + } + } + } + PieChart { + model: pieModel2 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 1500 + easing.type: Easing.OutElastic + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + model: pieModel3 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + segmentStrokeColor: "lightgray" + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 750 + easing.type: Easing.OutBounce + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + model: pieModel1 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: false + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 1500 + easing.type: Easing.OutElastic + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + + PieChart { + model: pieModel2 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: false + animateScale: true + segmentShowStroke:false + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 1500 + easing.type: Easing.OutSine + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + model: pieModel3 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + segmentStrokeWidth:3 + segmentStrokeColor: "black" + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 250 + easing.type: Easing.InSine + to: 100 + } + PauseAnimation { + duration: 100 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + model: pieModel1 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 750 + easing.type: Easing.OutBounce + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + model: pieModel2 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 750 + easing.type: Easing.OutBounce + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + model: pieModel3 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: false + segmentShowStroke:false + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 3000 + easing.type: Easing.Linear + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + duration: 1750 + to: 0 + } + } + } + PieChart { + model: pieModel1 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 1500 + easing.type: Easing.OutElastic + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + model: pieModel2 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + segmentStrokeColor:"darkblue" + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 750 + easing.type: Easing.OutBounce + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + model: pieModel2 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: false + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 1500 + easing.type: Easing.OutElastic + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + + PieChart { + model: pieModel3 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: false + animateScale: true + segmentShowStroke:false + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 1500 + easing.type: Easing.OutSine + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + model: pieModel1 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 250 + easing.type: Easing.InSine + to: 100 + } + PauseAnimation { + duration: 100 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + model: pieModel2 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 750 + easing.type: Easing.OutBounce + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + model: pieModel3 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 750 + easing.type: Easing.OutBounce + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + model: pieModel1 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: false + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 3000 + easing.type: Easing.Linear + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + duration: 1750 + to: 0 + } + } + } + PieChart { + model: pieModel2 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 1500 + easing.type: Easing.OutElastic + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + model: pieModel2 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: false + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 1500 + easing.type: Easing.OutElastic + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + + PieChart { + model: pieModel3 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: false + animateScale: true + segmentShowStroke:false + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 1500 + easing.type: Easing.OutSine + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + model: pieModel1 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 250 + easing.type: Easing.InSine + to: 100 + } + PauseAnimation { + duration: 100 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + model: pieModel2 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 750 + easing.type: Easing.OutBounce + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + + PieChart { + model: pieModel3 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 750 + easing.type: Easing.OutBounce + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + model: pieModel1 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: false + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 1500 + easing.type: Easing.OutElastic + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + + PieChart { + model: pieModel2 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: false + animateScale: true + + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 1500 + easing.type: Easing.OutSine + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + } + FpsItem { id: fpsItem } diff --git a/examples/piechart/piechart.cpp b/examples/piechart/piechart.cpp index 5f50c74..8b85d3e 100644 --- a/examples/piechart/piechart.cpp +++ b/examples/piechart/piechart.cpp @@ -1,5 +1,8 @@ #include "piechart.h" #include + +#include + void PieChartPainter::synchronize(QNanoQuickItem *item) { // Setting values here synchronized @@ -13,19 +16,14 @@ void PieChartPainter::synchronize(QNanoQuickItem *item) m_segmentStrokeColor = QNanoColor::fromQColor(realItem->segmentStrokeColor()); m_segmentStrokeWidth = realItem->segmentStrokeWidth(); m_percentageInnerCutout = realItem->percentageInnerCutout(); + m_data = realItem->data(&m_totalValue); + } } void PieChartPainter::paint(QNanoPainter *p) { - - qreal segmentTotal = 0.0; - for (auto i=0; im_value/segmentTotal) * (M_PI*2)); + qreal segmentAngle = rotateAnimation * ((it->m_value/m_totalValue) * (M_PI*2)); p->beginPath(); p->arc(width()/2,height()/2,scaleAnimation * pieRadius,cumulativeAngle,cumulativeAngle + segmentAngle); p->lineTo(width()/2,height()/2); @@ -51,6 +49,7 @@ void PieChartPainter::paint(QNanoPainter *p) p->setFillStyle(it->m_color); p->fill(); if(m_segmentShowStroke) { + p->setLineJoin(QNanoPainter::JOIN_ROUND); p->setLineWidth(m_segmentStrokeWidth); p->setStrokeStyle(m_segmentStrokeColor); p->stroke(); @@ -77,3 +76,94 @@ void PieChartPainter::paint(QNanoPainter *p) } + +PieChart::PieChart(QQuickItem *parent) + : QNanoQuickItem(parent) + ,m_segmentShowStroke(true) + ,m_animation(false) + ,m_animateScale(false) + ,m_animateRotate(false) + ,m_animationProgress(0) + ,m_segmentStrokeColor("#fff") + ,m_segmentStrokeWidth(2.0) + ,m_percentageInnerCutout(50.0) + ,m_model(0) + ,m_dataSourceIsObject(false) + +{ + m_data.push_back(PieChartPainter::Data(10,QNanoColor::fromQColor(Qt::green))); + m_data.push_back(PieChartPainter::Data(20,QNanoColor::fromQColor(Qt::darkBlue))); + m_data.push_back(PieChartPainter::Data(40,QNanoColor::fromQColor(Qt::magenta))); + m_data.push_back(PieChartPainter::Data(50,QNanoColor::fromQColor(Qt::darkGray))); + m_data.push_back(PieChartPainter::Data(30,QNanoColor::fromQColor(Qt::red))); + m_data.push_back(PieChartPainter::Data(90,QNanoColor::fromQColor(Qt::blue))); + m_data.push_back(PieChartPainter::Data(70,QNanoColor::fromQColor(Qt::darkYellow))); + updateTotalValue(); +} + +PieChart::~PieChart() +{ +} +QVariant PieChart::model() const +{ + + if (m_dataSourceIsObject) { + QObject *o = m_model; + return QVariant::fromValue(o); + } + + return m_dataSource; +} + +void PieChart::setModel(const QVariant &m) +{ + QVariant model = m; + if (model.userType() == qMetaTypeId()) + model = model.value().toVariant(); + + if (m_dataSource == model) + return; + + if (m_model) { + disconnect(m_model, &QAbstractListModel::dataChanged, + this, &PieChart::dataChanged); + } + m_dataSource = model; + QObject *object = qvariant_cast(model); + m_dataSourceIsObject = object != 0; + QAbstractListModel *alm = 0; + if (object && (alm = qobject_cast(object))) { + m_model = alm; + } + if (m_model) { + connect(m_model, &QAbstractListModel::dataChanged, + this, &PieChart::dataChanged); + updateData(); + } + emit modelChanged(); +} + +void PieChart::updateData() { + QVariant m = model(); + QObject *object = qvariant_cast(m); + QAbstractListModel *alm = 0; + if (object && (alm = qobject_cast(object))) { + m_data.clear(); + int roleValue = alm->roleNames().key(QByteArray("value")); + int roleColor = alm->roleNames().key(QByteArray("color")); + + for (int row = 0; row < alm->rowCount(); ++row) { + QModelIndex index = alm->index(row); + QString color = alm->data(index,roleColor).value(); + double value = alm->data(index,roleValue).toDouble(); + m_data.push_back(PieChartPainter::Data(value,QNanoColor::fromQColor(QColor(color)))); + } + } + updateTotalValue(); + update(); +} + +void PieChart::dataChanged(const QModelIndex & /*topLeft*/, const QModelIndex & /*bottomRight*/, const QVector & /*roles*/) +{ + updateData(); +} diff --git a/examples/piechart/piechart.h b/examples/piechart/piechart.h index c792257..550b26d 100644 --- a/examples/piechart/piechart.h +++ b/examples/piechart/piechart.h @@ -3,6 +3,8 @@ #include "qnanoquickitem.h" #include "qnanoquickitempainter.h" +#include +#include // PieChartPainter contains the painting code class PieChartPainter : public QNanoQuickItemPainter @@ -12,13 +14,6 @@ class PieChartPainter : public QNanoQuickItemPainter public: PieChartPainter() { - m_data.push_back(Data(10,QNanoColor::fromQColor(Qt::green))); - m_data.push_back(Data(20,QNanoColor::fromQColor(Qt::darkBlue))); - m_data.push_back(Data(40,QNanoColor::fromQColor(Qt::magenta))); - m_data.push_back(Data(50,QNanoColor::fromQColor(Qt::darkGray))); - m_data.push_back(Data(30,QNanoColor::fromQColor(Qt::red))); - m_data.push_back(Data(90,QNanoColor::fromQColor(Qt::blue))); - m_data.push_back(Data(70,QNanoColor::fromQColor(Qt::darkYellow))); } void synchronize(QNanoQuickItem *item); @@ -48,10 +43,12 @@ class PieChartPainter : public QNanoQuickItemPainter qreal m_segmentStrokeWidth; qreal m_percentageInnerCutout; QVector m_data; + qreal m_totalValue; }; #define PIE_PROPERTY(type,name) QNANO_PROPERTY(type, m_##name, name, set##name) // PieChart provides the API towards QML + class PieChart : public QNanoQuickItem { Q_OBJECT @@ -63,26 +60,50 @@ class PieChart : public QNanoQuickItem PIE_PROPERTY(QColor,segmentStrokeColor) PIE_PROPERTY(qreal,segmentStrokeWidth) PIE_PROPERTY(qreal,percentageInnerCutout) -public: - PieChart(QQuickItem *parent = 0) - : QNanoQuickItem(parent) - ,m_segmentShowStroke(true) - ,m_animation(false) - ,m_animateScale(false) - ,m_animateRotate(false) - ,m_animationProgress(0) - ,m_segmentStrokeColor("#fff") - ,m_segmentStrokeWidth(2.0) - ,m_percentageInnerCutout(50.0) - { - } + Q_PROPERTY(QVariant model READ model WRITE setModel NOTIFY modelChanged) + + QVector m_data; + qreal m_totalValue; + QPointer m_model; + QVariant m_dataSource; + bool m_dataSourceIsObject : 1; + +public: + PieChart(QQuickItem *parent = 0); + ~PieChart(); // Reimplement QNanoQuickItemPainter *createItemPainter() const { // Create painter for this item return new PieChartPainter(); } + + QVariant model() const; + void setModel(const QVariant &); + + QVector data(qreal * ptotalValue) { + *ptotalValue = m_totalValue; + return m_data; + } +protected: + + void updateData(); + void updateTotalValue() { + m_totalValue = 0.0; + for (auto it = m_data.cbegin(); it != m_data.cend(); ++it) { + m_totalValue += it->m_value; + } + + } + +Q_SIGNALS: + void modelChanged(); + +private Q_SLOTS: + void dataChanged(const QModelIndex & topLeft, const QModelIndex & bottomRight, const QVector & roles ); + + }; #endif // PIECHART diff --git a/examples/piechart/piechart.pro b/examples/piechart/piechart.pro index 9858317..5d9a9cd 100644 --- a/examples/piechart/piechart.pro +++ b/examples/piechart/piechart.pro @@ -1,6 +1,6 @@ TEMPLATE = app -QT += qml quick +QT += qml quick qml-private SOURCES += main.cpp \ piechart.cpp From 70727b2e86ca4c365e4298e01728afe60e936ced Mon Sep 17 00:00:00 2001 From: Gunnar Roth Date: Wed, 6 Jan 2016 18:13:22 +0100 Subject: [PATCH 10/23] remove unused header --- examples/piechart/piechart.cpp | 2 -- 1 file changed, 2 deletions(-) diff --git a/examples/piechart/piechart.cpp b/examples/piechart/piechart.cpp index 8b85d3e..8955fc2 100644 --- a/examples/piechart/piechart.cpp +++ b/examples/piechart/piechart.cpp @@ -1,8 +1,6 @@ #include "piechart.h" #include -#include - void PieChartPainter::synchronize(QNanoQuickItem *item) { // Setting values here synchronized From 2d19af86c059997b3729d8d9b915491d9b637658 Mon Sep 17 00:00:00 2001 From: Gunnar Roth Date: Wed, 6 Jan 2016 18:43:50 +0100 Subject: [PATCH 11/23] adapt colum count to window size and use flickable to scroll. takes orientation into account for window size and calculates the column count based on this. a flivkable allow to scroll the content now if it is larger than the screen. --- examples/piechart/main.qml | 18 ++++++++++-------- 1 file changed, 10 insertions(+), 8 deletions(-) diff --git a/examples/piechart/main.qml b/examples/piechart/main.qml index 6820112..c94f9e7 100644 --- a/examples/piechart/main.qml +++ b/examples/piechart/main.qml @@ -3,13 +3,14 @@ import QtQuick.Window 2.2 import PieChart 1.0 import "." Window { + id: root property real dp: Screen.pixelDensity * 25.4/160 // This will be 1 on most platforms, 2 on iOS double retina, 3 on iPhone6 plus property int dPRatio: Screen.devicePixelRatio visible: true - width: 800 - height: 480 + width: Screen.primaryOrientation === Qt.LandscapeOrientation ? 800:480 + height: Screen.primaryOrientation === Qt.LandscapeOrientation ? 480:800 color: "#404040" Text { @@ -161,16 +162,17 @@ Window { value: 9 } } - - Grid { + Flickable { anchors.top: textItem.bottom anchors.left: parent.left anchors.right: parent.right anchors.bottom: parent.bottom - - columns: 10 + contentWidth: grid.width; contentHeight: grid.height + Grid { + id: grid + columns: width / 80 spacing: 0 - + width: root.width PieChart { model: pieModel1 width:(parent.width - 2*parent.spacing)/parent.columns @@ -1576,7 +1578,7 @@ Window { } } } - + } FpsItem { id: fpsItem } From 88e32bde50e9c8316a853931321ca2509352971c Mon Sep 17 00:00:00 2001 From: Gunnar Roth Date: Fri, 8 Jan 2016 08:16:21 +0100 Subject: [PATCH 12/23] remove unsued qml-private from piechart.pro --- examples/piechart/piechart.pro | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/examples/piechart/piechart.pro b/examples/piechart/piechart.pro index 5d9a9cd..9858317 100644 --- a/examples/piechart/piechart.pro +++ b/examples/piechart/piechart.pro @@ -1,6 +1,6 @@ TEMPLATE = app -QT += qml quick qml-private +QT += qml quick SOURCES += main.cpp \ piechart.cpp From 7bc1b0788010382d2a305a30d41b014e79827ec8 Mon Sep 17 00:00:00 2001 From: Gunnar Roth Date: Fri, 8 Jan 2016 08:21:55 +0100 Subject: [PATCH 13/23] add CONFIG += c++11 to piechart.pro i use c++11 style connnect/disconnect. didnt need that on windows (msvc always has c++11 enable) but with qt 5.6 it seems it is not need onosx too, but on linux i suppose it is still needed. --- examples/piechart/piechart.pro | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/examples/piechart/piechart.pro b/examples/piechart/piechart.pro index 9858317..952d3e9 100644 --- a/examples/piechart/piechart.pro +++ b/examples/piechart/piechart.pro @@ -1,5 +1,5 @@ TEMPLATE = app - +CONFIG += c++11 QT += qml quick SOURCES += main.cpp \ From 764eb9dfdfe3353fdee89dcbce7b5a8a841eb33f Mon Sep 17 00:00:00 2001 From: Gunnar Roth Date: Sun, 10 Jan 2016 17:09:05 +0100 Subject: [PATCH 14/23] fix build with gcc4.8, use data() for QPointer sender in connect() --- examples/piechart/piechart.cpp | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/examples/piechart/piechart.cpp b/examples/piechart/piechart.cpp index 8955fc2..e979a75 100644 --- a/examples/piechart/piechart.cpp +++ b/examples/piechart/piechart.cpp @@ -123,7 +123,7 @@ void PieChart::setModel(const QVariant &m) return; if (m_model) { - disconnect(m_model, &QAbstractListModel::dataChanged, + disconnect(m_model.data(), &QAbstractListModel::dataChanged, this, &PieChart::dataChanged); } m_dataSource = model; @@ -134,7 +134,7 @@ void PieChart::setModel(const QVariant &m) m_model = alm; } if (m_model) { - connect(m_model, &QAbstractListModel::dataChanged, + connect(m_model.data(), &QAbstractListModel::dataChanged, this, &PieChart::dataChanged); updateData(); } From 75fcd2c0692b3180717d28f89e5ee33d970e7f41 Mon Sep 17 00:00:00 2001 From: Gunnar Roth Date: Thu, 21 Jan 2016 00:00:34 +0100 Subject: [PATCH 15/23] adpat piechart to upstream changes --- examples/piechart/piechart.h | 2 -- examples/piechart/piechart.pro | 1 - 2 files changed, 3 deletions(-) diff --git a/examples/piechart/piechart.h b/examples/piechart/piechart.h index 550b26d..9af2f9e 100644 --- a/examples/piechart/piechart.h +++ b/examples/piechart/piechart.h @@ -9,8 +9,6 @@ // PieChartPainter contains the painting code class PieChartPainter : public QNanoQuickItemPainter { - Q_OBJECT - public: PieChartPainter() { diff --git a/examples/piechart/piechart.pro b/examples/piechart/piechart.pro index 952d3e9..2306246 100644 --- a/examples/piechart/piechart.pro +++ b/examples/piechart/piechart.pro @@ -1,5 +1,4 @@ TEMPLATE = app -CONFIG += c++11 QT += qml quick SOURCES += main.cpp \ From b43a55c91f603178ba50cf94109b2d4bd77ba223 Mon Sep 17 00:00:00 2001 From: Gunnar Roth Date: Sun, 3 Jan 2016 01:03:56 +0100 Subject: [PATCH 16/23] piechart demo --- examples/piechart/FpsItem.qml | 56 +++ examples/piechart/deployment.pri | 27 ++ examples/piechart/images/spinner.png | Bin 0 -> 5222 bytes examples/piechart/main.cpp | 16 + examples/piechart/main.qml | 665 +++++++++++++++++++++++++++ examples/piechart/piechart.cpp | 79 ++++ examples/piechart/piechart.h | 89 ++++ examples/piechart/piechart.pro | 20 + examples/piechart/qml.qrc | 7 + qnanopainter.pro | 3 +- 10 files changed, 961 insertions(+), 1 deletion(-) create mode 100644 examples/piechart/FpsItem.qml create mode 100644 examples/piechart/deployment.pri create mode 100644 examples/piechart/images/spinner.png create mode 100644 examples/piechart/main.cpp create mode 100644 examples/piechart/main.qml create mode 100644 examples/piechart/piechart.cpp create mode 100644 examples/piechart/piechart.h create mode 100644 examples/piechart/piechart.pro create mode 100644 examples/piechart/qml.qrc diff --git a/examples/piechart/FpsItem.qml b/examples/piechart/FpsItem.qml new file mode 100644 index 0000000..bc5018b --- /dev/null +++ b/examples/piechart/FpsItem.qml @@ -0,0 +1,56 @@ +import QtQuick 2.0 + +Item { + id: root + property int frameCounter: 0 + property int frameCounterAvg: 0 + property int counter: 0 + property int fps: 0 + property int fpsAvg: 0 + width: 140 * dp + height: Math.floor(48 * dp) + + Image { + id: spinnerImage + anchors.verticalCenter: parent.verticalCenter + x: 4 * dp + width: 36 * dp + height: width + source: "images/spinner.png" + NumberAnimation on rotation { + from:0 + to: 360 + duration: 800 + loops: Animation.Infinite + } + onRotationChanged: frameCounter++; + } + + Text { + anchors.left: spinnerImage.right + anchors.leftMargin: 8 * dp + anchors.verticalCenter: spinnerImage.verticalCenter + color: "#c0c0c0" + //style: Text.Outline + //styleColor: "#606060" + font.pixelSize: 18 * dp + text: "Ø " + root.fpsAvg + " | " + root.fps + " fps" + } + + Timer { + interval: 2000 + repeat: true + running: true + onTriggered: { + frameCounterAvg += frameCounter; + root.fps = frameCounter/2; + counter++; + frameCounter = 0; + if (counter >= 3) { + root.fpsAvg = frameCounterAvg/(2*counter) + frameCounterAvg = 0; + counter = 0; + } + } + } +} diff --git a/examples/piechart/deployment.pri b/examples/piechart/deployment.pri new file mode 100644 index 0000000..5441b63 --- /dev/null +++ b/examples/piechart/deployment.pri @@ -0,0 +1,27 @@ +android-no-sdk { + target.path = /data/user/qt + export(target.path) + INSTALLS += target +} else:android { + x86 { + target.path = /libs/x86 + } else: armeabi-v7a { + target.path = /libs/armeabi-v7a + } else { + target.path = /libs/armeabi + } + export(target.path) + INSTALLS += target +} else:unix { + isEmpty(target.path) { + qnx { + target.path = /tmp/$${TARGET}/bin + } else { + target.path = /opt/$${TARGET}/bin + } + export(target.path) + } + INSTALLS += target +} + +export(INSTALLS) diff --git a/examples/piechart/images/spinner.png b/examples/piechart/images/spinner.png new file mode 100644 index 0000000000000000000000000000000000000000..5c6eefd8c39d3aa5c74f0ef70ea2004949be11b2 GIT binary patch literal 5222 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 literal 0 HcmV?d00001 diff --git a/examples/piechart/main.cpp b/examples/piechart/main.cpp new file mode 100644 index 0000000..a9427a7 --- /dev/null +++ b/examples/piechart/main.cpp @@ -0,0 +1,16 @@ +#include +#include +#include "piechart.h" + +int main(int argc, char *argv[]) +{ + QCoreApplication::setAttribute(Qt::AA_UseOpenGLES); + + QGuiApplication app(argc, argv); + + QQmlApplicationEngine engine; + qmlRegisterType("PieChart", 1, 0, "PieChart"); + engine.load(QUrl(QStringLiteral("qrc:/main.qml"))); + + return app.exec(); +} diff --git a/examples/piechart/main.qml b/examples/piechart/main.qml new file mode 100644 index 0000000..a22fb83 --- /dev/null +++ b/examples/piechart/main.qml @@ -0,0 +1,665 @@ +import QtQuick 2.4 +import QtQuick.Window 2.2 +import PieChart 1.0 +import "." +Window { + property real dp: Screen.pixelDensity * 25.4/160 + // This will be 1 on most platforms, 2 on iOS double retina, 3 on iPhone6 plus + property int dPRatio: Screen.devicePixelRatio + + visible: true + width: 800 + height: 480 + color: "#404040" + + Text { + id: textItem + anchors.horizontalCenter: parent.horizontalCenter + y: parent.height * 0.02 + font.pixelSize: parent.width * 0.04 + color: "lightgray" + text: "Here are some piecharts" + } + + Grid { + anchors.top: textItem.bottom + anchors.left: parent.left + anchors.right: parent.right + anchors.bottom: parent.bottom + + columns: 7 + spacing: 2 + + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + segmentStrokeWidth: 4 + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 1200 + easing.type: Easing.Linear + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + easing.type: Easing.Linear + duration: 1200 + to: 0 + } + } + } + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 750 + easing.type: Easing.OutBounce + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: false + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 3000 + easing.type: Easing.Linear + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 550 + easing.type: Easing.OutBounce + to: 100 + } + PauseAnimation { + duration: 500 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 250 + easing.type: Easing.InSine + to: 100 + } + PauseAnimation { + duration: 100 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 750 + easing.type: Easing.OutBounce + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 750 + easing.type: Easing.OutBounce + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: false + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 3000 + easing.type: Easing.Linear + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + duration: 1750 + to: 0 + } + } + } + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 1500 + easing.type: Easing.OutElastic + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + segmentStrokeColor: "lightgray" + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 750 + easing.type: Easing.OutBounce + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: false + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 1500 + easing.type: Easing.OutElastic + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: false + animateScale: true + segmentShowStroke:false + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 1500 + easing.type: Easing.OutSine + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + segmentStrokeWidth:3 + segmentStrokeColor: "black" + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 250 + easing.type: Easing.InSine + to: 100 + } + PauseAnimation { + duration: 100 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 750 + easing.type: Easing.OutBounce + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 750 + easing.type: Easing.OutBounce + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: false + segmentShowStroke:false + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 3000 + easing.type: Easing.Linear + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + duration: 1750 + to: 0 + } + } + } + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 1500 + easing.type: Easing.OutElastic + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + segmentStrokeColor:"darkblue" + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 750 + easing.type: Easing.OutBounce + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: false + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 1500 + easing.type: Easing.OutElastic + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: false + animateScale: true + segmentShowStroke:false + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 1500 + easing.type: Easing.OutSine + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 250 + easing.type: Easing.InSine + to: 100 + } + PauseAnimation { + duration: 100 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 750 + easing.type: Easing.OutBounce + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 750 + easing.type: Easing.OutBounce + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: false + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 3000 + easing.type: Easing.Linear + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + duration: 1750 + to: 0 + } + } + } + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 1500 + easing.type: Easing.OutElastic + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 750 + easing.type: Easing.OutBounce + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: false + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 1500 + easing.type: Easing.OutElastic + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + + PieChart { + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: false + animateScale: true + + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 1500 + easing.type: Easing.OutSine + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + } + FpsItem { + id: fpsItem + } + +} diff --git a/examples/piechart/piechart.cpp b/examples/piechart/piechart.cpp new file mode 100644 index 0000000..5f50c74 --- /dev/null +++ b/examples/piechart/piechart.cpp @@ -0,0 +1,79 @@ +#include "piechart.h" +#include +void PieChartPainter::synchronize(QNanoQuickItem *item) +{ + // Setting values here synchronized + PieChart *realItem = static_cast(item); + if (realItem) { + m_animation = realItem->animation(); + m_animationProgress = realItem->animationProgress()/100.0; + m_animateScale = realItem->animateScale(); + m_animateRotate = realItem->animateRotate(); + m_segmentShowStroke = realItem->segmentShowStroke(); + m_segmentStrokeColor = QNanoColor::fromQColor(realItem->segmentStrokeColor()); + m_segmentStrokeWidth = realItem->segmentStrokeWidth(); + m_percentageInnerCutout = realItem->percentageInnerCutout(); + } +} + + +void PieChartPainter::paint(QNanoPainter *p) +{ + + qreal segmentTotal = 0.0; + for (auto i=0; im_value/segmentTotal) * (M_PI*2)); + p->beginPath(); + p->arc(width()/2,height()/2,scaleAnimation * pieRadius,cumulativeAngle,cumulativeAngle + segmentAngle); + p->lineTo(width()/2,height()/2); + p->closePath(); + p->setFillStyle(it->m_color); + p->fill(); + if(m_segmentShowStroke) { + p->setLineWidth(m_segmentStrokeWidth); + p->setStrokeStyle(m_segmentStrokeColor); + p->stroke(); + } + cumulativeAngle += segmentAngle; + } + + QLatin1String text("PieChart"); + QRectF box = p->textBoundingBox(text,0,0); + p->setTextAlign(QNanoPainter::ALIGN_CENTER); + box.setWidth(width()); + box.setY(box.height()); + QNanoFont f; + f.setPixelSize(25); + f.setBlur(2); + p->setFont(f); + p->setFillStyle(0xFFf8f8f8); + p->fillText(text,box); + f.setBlur(0); + p->setFont(f); + p->setFillStyle(0xFF000000); + p->fillText(text,box); + + +} + diff --git a/examples/piechart/piechart.h b/examples/piechart/piechart.h new file mode 100644 index 0000000..c792257 --- /dev/null +++ b/examples/piechart/piechart.h @@ -0,0 +1,89 @@ +#ifndef PIECHART +#define PIECHART + +#include "qnanoquickitem.h" +#include "qnanoquickitempainter.h" + +// PieChartPainter contains the painting code +class PieChartPainter : public QNanoQuickItemPainter +{ + Q_OBJECT + +public: + PieChartPainter() + { + m_data.push_back(Data(10,QNanoColor::fromQColor(Qt::green))); + m_data.push_back(Data(20,QNanoColor::fromQColor(Qt::darkBlue))); + m_data.push_back(Data(40,QNanoColor::fromQColor(Qt::magenta))); + m_data.push_back(Data(50,QNanoColor::fromQColor(Qt::darkGray))); + m_data.push_back(Data(30,QNanoColor::fromQColor(Qt::red))); + m_data.push_back(Data(90,QNanoColor::fromQColor(Qt::blue))); + m_data.push_back(Data(70,QNanoColor::fromQColor(Qt::darkYellow))); + + } + void synchronize(QNanoQuickItem *item); + void paint(QNanoPainter *p); + + class Data { + public: + Data() + :m_value(0) + {} + Data(qreal v,const QNanoColor & c) + :m_value(v) + ,m_color(c) + {} + + public: + qreal m_value; + QNanoColor m_color; + }; +private: + qreal m_animationProgress; + bool m_animation; + bool m_animateScale; + bool m_animateRotate; + bool m_segmentShowStroke; + QNanoColor m_segmentStrokeColor; + qreal m_segmentStrokeWidth; + qreal m_percentageInnerCutout; + QVector m_data; +}; +#define PIE_PROPERTY(type,name) QNANO_PROPERTY(type, m_##name, name, set##name) + +// PieChart provides the API towards QML +class PieChart : public QNanoQuickItem +{ + Q_OBJECT + PIE_PROPERTY(bool,segmentShowStroke) + PIE_PROPERTY(bool,animation) + PIE_PROPERTY(bool,animateScale) + PIE_PROPERTY(bool,animateRotate) + PIE_PROPERTY(int,animationProgress) + PIE_PROPERTY(QColor,segmentStrokeColor) + PIE_PROPERTY(qreal,segmentStrokeWidth) + PIE_PROPERTY(qreal,percentageInnerCutout) +public: + PieChart(QQuickItem *parent = 0) + : QNanoQuickItem(parent) + ,m_segmentShowStroke(true) + ,m_animation(false) + ,m_animateScale(false) + ,m_animateRotate(false) + ,m_animationProgress(0) + ,m_segmentStrokeColor("#fff") + ,m_segmentStrokeWidth(2.0) + ,m_percentageInnerCutout(50.0) + { + } + + // Reimplement + QNanoQuickItemPainter *createItemPainter() const + { + // Create painter for this item + return new PieChartPainter(); + } +}; + +#endif // PIECHART + diff --git a/examples/piechart/piechart.pro b/examples/piechart/piechart.pro new file mode 100644 index 0000000..9858317 --- /dev/null +++ b/examples/piechart/piechart.pro @@ -0,0 +1,20 @@ +TEMPLATE = app + +QT += qml quick + +SOURCES += main.cpp \ + piechart.cpp + +RESOURCES += qml.qrc + +# Additional import path used to resolve QML modules in Qt Creator's code model +QML_IMPORT_PATH = + +# Include QNanoPainter +include(../../libqnanopainter/include.pri) + +# Default rules for deployment. +include(deployment.pri) + +HEADERS += \ + piechart.h diff --git a/examples/piechart/qml.qrc b/examples/piechart/qml.qrc new file mode 100644 index 0000000..ce1633c --- /dev/null +++ b/examples/piechart/qml.qrc @@ -0,0 +1,7 @@ + + + main.qml + FpsItem.qml + images/spinner.png + + diff --git a/qnanopainter.pro b/qnanopainter.pro index 987a9bd..9859780 100644 --- a/qnanopainter.pro +++ b/qnanopainter.pro @@ -3,4 +3,5 @@ TEMPLATE = subdirs SUBDIRS += \ examples/qnanopainter_vs_qpainter_demo \ examples/gallery \ - examples/helloworld + examples/helloworld \ + examples/piechart From aa9c1b13dc6cb08c498acc903c375e361e92f4b5 Mon Sep 17 00:00:00 2001 From: Gunnar Roth Date: Mon, 4 Jan 2016 17:22:37 +0100 Subject: [PATCH 17/23] implement readingi data from model as QAbstractListModel increase the number of item to 60, use 3 ItemListModels as data provider. --- examples/piechart/main.qml | 929 ++++++++++++++++++++++++++++++++- examples/piechart/piechart.cpp | 106 +++- examples/piechart/piechart.h | 61 ++- examples/piechart/piechart.pro | 2 +- 4 files changed, 1064 insertions(+), 34 deletions(-) diff --git a/examples/piechart/main.qml b/examples/piechart/main.qml index a22fb83..6820112 100644 --- a/examples/piechart/main.qml +++ b/examples/piechart/main.qml @@ -15,22 +15,164 @@ Window { Text { id: textItem anchors.horizontalCenter: parent.horizontalCenter - y: parent.height * 0.02 - font.pixelSize: parent.width * 0.04 + y: parent.height * 0.01 + font.pixelSize: parent.width * 0.015 color: "lightgray" text: "Here are some piecharts" } + ListModel { + id: pieModel1 + + ListElement { + color: "#99e600" + value: 21 + } + ListElement { + color: "#99cc00" + value: 18 + } + ListElement { + color: "#99b300" + value: 14 + } + ListElement { + color: "#9f991a" + value: 13 + } + ListElement { + color: "#a48033" + value: 13 + } + ListElement { + color: "#a9664d" + value: 13 + } + ListElement { + color: "ae4d66" + value: 12 + } + ListElement { + color: "#b33380" + value: 11 + } + ListElement { + color: "#a64086" + value: 9 + } + ListElement { + color: "#994d8d" + value: 9 + } + ListElement { + color: "#8d5a93" + value: 7 + } + ListElement { + color: "806699" + value: 6 + } + ListElement { + color: "#8073a6" + value: 4 + } + ListElement { + color: "#8080b3" + value:38 + } + } + ListModel { + id: pieModel2 + + ListElement { + color: "black" + value: 5 + } + ListElement { + color: "red" + value: 15 + } + ListElement { + color: "blue" + value: 10 + } + ListElement { + color: "gray" + value: 15 + } + ListElement { + color: "green" + value: 20 + } + ListElement { + color: "lightcyan" + value: 25 + } + ListElement { + color: "lemonchiffon" + value: 30 + } + ListElement { + color: "limegreen" + value: 35 + } + ListElement { + color: "salmon" + value: 15 + } + } + ListModel { + id: pieModel3 + + ListElement { + color: "navy" + value: 1 + } + ListElement { + color: "oldlace" + value: 2 + } + ListElement { + color: "orchid" + value: 3 + } + ListElement { + color: "royalblue" + value: 4 + } + ListElement { + color: "firebrick" + value: 5 + } + ListElement { + color: "darkseagreen" + value: 6 + } + ListElement { + color: "cornsilk" + value: 7 + } + ListElement { + color: "cadetblue" + value: 8 + } + ListElement { + color: "burlywood" + value: 9 + } + } + Grid { anchors.top: textItem.bottom anchors.left: parent.left anchors.right: parent.right anchors.bottom: parent.bottom - columns: 7 - spacing: 2 + columns: 10 + spacing: 0 PieChart { + model: pieModel1 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -55,6 +197,7 @@ Window { } } PieChart { + model: pieModel2 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -78,6 +221,7 @@ Window { } PieChart { + model: pieModel1 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -100,6 +244,7 @@ Window { } } PieChart { + model: pieModel2 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -122,6 +267,7 @@ Window { } } PieChart { + model: pieModel1 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -144,6 +290,7 @@ Window { } } PieChart { + model: pieModel2 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -166,6 +313,7 @@ Window { } } PieChart { + model: pieModel3 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -188,6 +336,7 @@ Window { } } PieChart { + model: pieModel1 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -211,6 +360,7 @@ Window { } } PieChart { + model: pieModel2 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -233,6 +383,7 @@ Window { } } PieChart { + model: pieModel3 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -255,6 +406,7 @@ Window { } } PieChart { + model: pieModel1 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -278,6 +430,7 @@ Window { } PieChart { + model: pieModel2 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -300,6 +453,7 @@ Window { } } PieChart { + model: pieModel3 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -323,6 +477,7 @@ Window { } } PieChart { + model: pieModel1 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -345,6 +500,7 @@ Window { } } PieChart { + model: pieModel2 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -367,6 +523,7 @@ Window { } } PieChart { + model: pieModel3 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -390,6 +547,7 @@ Window { } } PieChart { + model: pieModel1 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -412,6 +570,7 @@ Window { } } PieChart { + model: pieModel2 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -434,6 +593,7 @@ Window { } } PieChart { + model: pieModel2 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -457,6 +617,7 @@ Window { } PieChart { + model: pieModel3 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -479,6 +640,7 @@ Window { } } PieChart { + model: pieModel1 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -501,6 +663,7 @@ Window { } } PieChart { + model: pieModel2 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -523,6 +686,7 @@ Window { } } PieChart { + model: pieModel3 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -545,6 +709,7 @@ Window { } } PieChart { + model: pieModel1 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -568,6 +733,7 @@ Window { } } PieChart { + model: pieModel2 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -590,6 +756,7 @@ Window { } } PieChart { + model: pieModel3 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -612,6 +779,7 @@ Window { } } PieChart { + model: pieModel1 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -635,6 +803,7 @@ Window { } PieChart { + model: pieModel2 width:(parent.width - 2*parent.spacing)/parent.columns height: width animation: true @@ -657,7 +826,757 @@ Window { } } } - } + PieChart { + model: pieModel1 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + segmentStrokeWidth: 4 + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 1200 + easing.type: Easing.Linear + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + easing.type: Easing.Linear + duration: 1200 + to: 0 + } + } + } + PieChart { + model: pieModel2 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 750 + easing.type: Easing.OutBounce + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + + PieChart { + model: pieModel1 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: false + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 3000 + easing.type: Easing.Linear + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + model: pieModel2 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 550 + easing.type: Easing.OutBounce + to: 100 + } + PauseAnimation { + duration: 500 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + model: pieModel1 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 250 + easing.type: Easing.InSine + to: 100 + } + PauseAnimation { + duration: 100 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + model: pieModel2 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 750 + easing.type: Easing.OutBounce + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + model: pieModel3 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 750 + easing.type: Easing.OutBounce + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + model: pieModel1 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: false + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 3000 + easing.type: Easing.Linear + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + duration: 1750 + to: 0 + } + } + } + PieChart { + model: pieModel2 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 1500 + easing.type: Easing.OutElastic + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + model: pieModel3 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + segmentStrokeColor: "lightgray" + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 750 + easing.type: Easing.OutBounce + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + model: pieModel1 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: false + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 1500 + easing.type: Easing.OutElastic + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + + PieChart { + model: pieModel2 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: false + animateScale: true + segmentShowStroke:false + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 1500 + easing.type: Easing.OutSine + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + model: pieModel3 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + segmentStrokeWidth:3 + segmentStrokeColor: "black" + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 250 + easing.type: Easing.InSine + to: 100 + } + PauseAnimation { + duration: 100 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + model: pieModel1 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 750 + easing.type: Easing.OutBounce + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + model: pieModel2 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 750 + easing.type: Easing.OutBounce + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + model: pieModel3 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: false + segmentShowStroke:false + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 3000 + easing.type: Easing.Linear + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + duration: 1750 + to: 0 + } + } + } + PieChart { + model: pieModel1 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 1500 + easing.type: Easing.OutElastic + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + model: pieModel2 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + segmentStrokeColor:"darkblue" + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 750 + easing.type: Easing.OutBounce + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + model: pieModel2 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: false + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 1500 + easing.type: Easing.OutElastic + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + + PieChart { + model: pieModel3 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: false + animateScale: true + segmentShowStroke:false + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 1500 + easing.type: Easing.OutSine + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + model: pieModel1 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 250 + easing.type: Easing.InSine + to: 100 + } + PauseAnimation { + duration: 100 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + model: pieModel2 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 750 + easing.type: Easing.OutBounce + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + model: pieModel3 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 750 + easing.type: Easing.OutBounce + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + model: pieModel1 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: false + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 3000 + easing.type: Easing.Linear + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + duration: 1750 + to: 0 + } + } + } + PieChart { + model: pieModel2 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 1500 + easing.type: Easing.OutElastic + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + model: pieModel2 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: false + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 1500 + easing.type: Easing.OutElastic + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + + PieChart { + model: pieModel3 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: false + animateScale: true + segmentShowStroke:false + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 1500 + easing.type: Easing.OutSine + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + model: pieModel1 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 250 + easing.type: Easing.InSine + to: 100 + } + PauseAnimation { + duration: 100 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + model: pieModel2 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 750 + easing.type: Easing.OutBounce + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + + PieChart { + model: pieModel3 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: true + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 750 + easing.type: Easing.OutBounce + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + PieChart { + model: pieModel1 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: true + animateScale: false + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 1500 + easing.type: Easing.OutElastic + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + + PieChart { + model: pieModel2 + width:(parent.width - 2*parent.spacing)/parent.columns + height: width + animation: true + animateRotate: false + animateScale: true + + + SequentialAnimation on animationProgress { + loops: Animation.Infinite + PropertyAnimation { + duration: 1500 + easing.type: Easing.OutSine + to: 100 + } + PauseAnimation { + duration: 1000 + } + PropertyAnimation { + to: 0 + } + } + } + } + FpsItem { id: fpsItem } diff --git a/examples/piechart/piechart.cpp b/examples/piechart/piechart.cpp index 5f50c74..8b85d3e 100644 --- a/examples/piechart/piechart.cpp +++ b/examples/piechart/piechart.cpp @@ -1,5 +1,8 @@ #include "piechart.h" #include + +#include + void PieChartPainter::synchronize(QNanoQuickItem *item) { // Setting values here synchronized @@ -13,19 +16,14 @@ void PieChartPainter::synchronize(QNanoQuickItem *item) m_segmentStrokeColor = QNanoColor::fromQColor(realItem->segmentStrokeColor()); m_segmentStrokeWidth = realItem->segmentStrokeWidth(); m_percentageInnerCutout = realItem->percentageInnerCutout(); + m_data = realItem->data(&m_totalValue); + } } void PieChartPainter::paint(QNanoPainter *p) { - - qreal segmentTotal = 0.0; - for (auto i=0; im_value/segmentTotal) * (M_PI*2)); + qreal segmentAngle = rotateAnimation * ((it->m_value/m_totalValue) * (M_PI*2)); p->beginPath(); p->arc(width()/2,height()/2,scaleAnimation * pieRadius,cumulativeAngle,cumulativeAngle + segmentAngle); p->lineTo(width()/2,height()/2); @@ -51,6 +49,7 @@ void PieChartPainter::paint(QNanoPainter *p) p->setFillStyle(it->m_color); p->fill(); if(m_segmentShowStroke) { + p->setLineJoin(QNanoPainter::JOIN_ROUND); p->setLineWidth(m_segmentStrokeWidth); p->setStrokeStyle(m_segmentStrokeColor); p->stroke(); @@ -77,3 +76,94 @@ void PieChartPainter::paint(QNanoPainter *p) } + +PieChart::PieChart(QQuickItem *parent) + : QNanoQuickItem(parent) + ,m_segmentShowStroke(true) + ,m_animation(false) + ,m_animateScale(false) + ,m_animateRotate(false) + ,m_animationProgress(0) + ,m_segmentStrokeColor("#fff") + ,m_segmentStrokeWidth(2.0) + ,m_percentageInnerCutout(50.0) + ,m_model(0) + ,m_dataSourceIsObject(false) + +{ + m_data.push_back(PieChartPainter::Data(10,QNanoColor::fromQColor(Qt::green))); + m_data.push_back(PieChartPainter::Data(20,QNanoColor::fromQColor(Qt::darkBlue))); + m_data.push_back(PieChartPainter::Data(40,QNanoColor::fromQColor(Qt::magenta))); + m_data.push_back(PieChartPainter::Data(50,QNanoColor::fromQColor(Qt::darkGray))); + m_data.push_back(PieChartPainter::Data(30,QNanoColor::fromQColor(Qt::red))); + m_data.push_back(PieChartPainter::Data(90,QNanoColor::fromQColor(Qt::blue))); + m_data.push_back(PieChartPainter::Data(70,QNanoColor::fromQColor(Qt::darkYellow))); + updateTotalValue(); +} + +PieChart::~PieChart() +{ +} +QVariant PieChart::model() const +{ + + if (m_dataSourceIsObject) { + QObject *o = m_model; + return QVariant::fromValue(o); + } + + return m_dataSource; +} + +void PieChart::setModel(const QVariant &m) +{ + QVariant model = m; + if (model.userType() == qMetaTypeId()) + model = model.value().toVariant(); + + if (m_dataSource == model) + return; + + if (m_model) { + disconnect(m_model, &QAbstractListModel::dataChanged, + this, &PieChart::dataChanged); + } + m_dataSource = model; + QObject *object = qvariant_cast(model); + m_dataSourceIsObject = object != 0; + QAbstractListModel *alm = 0; + if (object && (alm = qobject_cast(object))) { + m_model = alm; + } + if (m_model) { + connect(m_model, &QAbstractListModel::dataChanged, + this, &PieChart::dataChanged); + updateData(); + } + emit modelChanged(); +} + +void PieChart::updateData() { + QVariant m = model(); + QObject *object = qvariant_cast(m); + QAbstractListModel *alm = 0; + if (object && (alm = qobject_cast(object))) { + m_data.clear(); + int roleValue = alm->roleNames().key(QByteArray("value")); + int roleColor = alm->roleNames().key(QByteArray("color")); + + for (int row = 0; row < alm->rowCount(); ++row) { + QModelIndex index = alm->index(row); + QString color = alm->data(index,roleColor).value(); + double value = alm->data(index,roleValue).toDouble(); + m_data.push_back(PieChartPainter::Data(value,QNanoColor::fromQColor(QColor(color)))); + } + } + updateTotalValue(); + update(); +} + +void PieChart::dataChanged(const QModelIndex & /*topLeft*/, const QModelIndex & /*bottomRight*/, const QVector & /*roles*/) +{ + updateData(); +} diff --git a/examples/piechart/piechart.h b/examples/piechart/piechart.h index c792257..550b26d 100644 --- a/examples/piechart/piechart.h +++ b/examples/piechart/piechart.h @@ -3,6 +3,8 @@ #include "qnanoquickitem.h" #include "qnanoquickitempainter.h" +#include +#include // PieChartPainter contains the painting code class PieChartPainter : public QNanoQuickItemPainter @@ -12,13 +14,6 @@ class PieChartPainter : public QNanoQuickItemPainter public: PieChartPainter() { - m_data.push_back(Data(10,QNanoColor::fromQColor(Qt::green))); - m_data.push_back(Data(20,QNanoColor::fromQColor(Qt::darkBlue))); - m_data.push_back(Data(40,QNanoColor::fromQColor(Qt::magenta))); - m_data.push_back(Data(50,QNanoColor::fromQColor(Qt::darkGray))); - m_data.push_back(Data(30,QNanoColor::fromQColor(Qt::red))); - m_data.push_back(Data(90,QNanoColor::fromQColor(Qt::blue))); - m_data.push_back(Data(70,QNanoColor::fromQColor(Qt::darkYellow))); } void synchronize(QNanoQuickItem *item); @@ -48,10 +43,12 @@ class PieChartPainter : public QNanoQuickItemPainter qreal m_segmentStrokeWidth; qreal m_percentageInnerCutout; QVector m_data; + qreal m_totalValue; }; #define PIE_PROPERTY(type,name) QNANO_PROPERTY(type, m_##name, name, set##name) // PieChart provides the API towards QML + class PieChart : public QNanoQuickItem { Q_OBJECT @@ -63,26 +60,50 @@ class PieChart : public QNanoQuickItem PIE_PROPERTY(QColor,segmentStrokeColor) PIE_PROPERTY(qreal,segmentStrokeWidth) PIE_PROPERTY(qreal,percentageInnerCutout) -public: - PieChart(QQuickItem *parent = 0) - : QNanoQuickItem(parent) - ,m_segmentShowStroke(true) - ,m_animation(false) - ,m_animateScale(false) - ,m_animateRotate(false) - ,m_animationProgress(0) - ,m_segmentStrokeColor("#fff") - ,m_segmentStrokeWidth(2.0) - ,m_percentageInnerCutout(50.0) - { - } + Q_PROPERTY(QVariant model READ model WRITE setModel NOTIFY modelChanged) + + QVector m_data; + qreal m_totalValue; + QPointer m_model; + QVariant m_dataSource; + bool m_dataSourceIsObject : 1; + +public: + PieChart(QQuickItem *parent = 0); + ~PieChart(); // Reimplement QNanoQuickItemPainter *createItemPainter() const { // Create painter for this item return new PieChartPainter(); } + + QVariant model() const; + void setModel(const QVariant &); + + QVector data(qreal * ptotalValue) { + *ptotalValue = m_totalValue; + return m_data; + } +protected: + + void updateData(); + void updateTotalValue() { + m_totalValue = 0.0; + for (auto it = m_data.cbegin(); it != m_data.cend(); ++it) { + m_totalValue += it->m_value; + } + + } + +Q_SIGNALS: + void modelChanged(); + +private Q_SLOTS: + void dataChanged(const QModelIndex & topLeft, const QModelIndex & bottomRight, const QVector & roles ); + + }; #endif // PIECHART diff --git a/examples/piechart/piechart.pro b/examples/piechart/piechart.pro index 9858317..5d9a9cd 100644 --- a/examples/piechart/piechart.pro +++ b/examples/piechart/piechart.pro @@ -1,6 +1,6 @@ TEMPLATE = app -QT += qml quick +QT += qml quick qml-private SOURCES += main.cpp \ piechart.cpp From eeae6dfa822df8ffce3ac473cf5c2d967cbddcf4 Mon Sep 17 00:00:00 2001 From: Gunnar Roth Date: Wed, 6 Jan 2016 18:13:22 +0100 Subject: [PATCH 18/23] remove unused header --- examples/piechart/piechart.cpp | 2 -- 1 file changed, 2 deletions(-) diff --git a/examples/piechart/piechart.cpp b/examples/piechart/piechart.cpp index 8b85d3e..8955fc2 100644 --- a/examples/piechart/piechart.cpp +++ b/examples/piechart/piechart.cpp @@ -1,8 +1,6 @@ #include "piechart.h" #include -#include - void PieChartPainter::synchronize(QNanoQuickItem *item) { // Setting values here synchronized From 4c1aaa2e56fb538e1955c3d76ca3b8645e90bc33 Mon Sep 17 00:00:00 2001 From: Gunnar Roth Date: Wed, 6 Jan 2016 18:43:50 +0100 Subject: [PATCH 19/23] adapt colum count to window size and use flickable to scroll. takes orientation into account for window size and calculates the column count based on this. a flivkable allow to scroll the content now if it is larger than the screen. --- examples/piechart/main.qml | 18 ++++++++++-------- 1 file changed, 10 insertions(+), 8 deletions(-) diff --git a/examples/piechart/main.qml b/examples/piechart/main.qml index 6820112..c94f9e7 100644 --- a/examples/piechart/main.qml +++ b/examples/piechart/main.qml @@ -3,13 +3,14 @@ import QtQuick.Window 2.2 import PieChart 1.0 import "." Window { + id: root property real dp: Screen.pixelDensity * 25.4/160 // This will be 1 on most platforms, 2 on iOS double retina, 3 on iPhone6 plus property int dPRatio: Screen.devicePixelRatio visible: true - width: 800 - height: 480 + width: Screen.primaryOrientation === Qt.LandscapeOrientation ? 800:480 + height: Screen.primaryOrientation === Qt.LandscapeOrientation ? 480:800 color: "#404040" Text { @@ -161,16 +162,17 @@ Window { value: 9 } } - - Grid { + Flickable { anchors.top: textItem.bottom anchors.left: parent.left anchors.right: parent.right anchors.bottom: parent.bottom - - columns: 10 + contentWidth: grid.width; contentHeight: grid.height + Grid { + id: grid + columns: width / 80 spacing: 0 - + width: root.width PieChart { model: pieModel1 width:(parent.width - 2*parent.spacing)/parent.columns @@ -1576,7 +1578,7 @@ Window { } } } - + } FpsItem { id: fpsItem } From 6b99c91dd2790d34f38d43afa43b400da75a1247 Mon Sep 17 00:00:00 2001 From: Gunnar Roth Date: Fri, 8 Jan 2016 08:16:21 +0100 Subject: [PATCH 20/23] remove unsued qml-private from piechart.pro --- examples/piechart/piechart.pro | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/examples/piechart/piechart.pro b/examples/piechart/piechart.pro index 5d9a9cd..9858317 100644 --- a/examples/piechart/piechart.pro +++ b/examples/piechart/piechart.pro @@ -1,6 +1,6 @@ TEMPLATE = app -QT += qml quick qml-private +QT += qml quick SOURCES += main.cpp \ piechart.cpp From 71ea2db32bafb78f47151f18a660846fa4be9de3 Mon Sep 17 00:00:00 2001 From: Gunnar Roth Date: Fri, 8 Jan 2016 08:21:55 +0100 Subject: [PATCH 21/23] add CONFIG += c++11 to piechart.pro i use c++11 style connnect/disconnect. didnt need that on windows (msvc always has c++11 enable) but with qt 5.6 it seems it is not need onosx too, but on linux i suppose it is still needed. --- examples/piechart/piechart.pro | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/examples/piechart/piechart.pro b/examples/piechart/piechart.pro index 9858317..952d3e9 100644 --- a/examples/piechart/piechart.pro +++ b/examples/piechart/piechart.pro @@ -1,5 +1,5 @@ TEMPLATE = app - +CONFIG += c++11 QT += qml quick SOURCES += main.cpp \ From 738a829a9f1faa4ff4145882a99dc8e3cb395746 Mon Sep 17 00:00:00 2001 From: Gunnar Roth Date: Sun, 10 Jan 2016 17:09:05 +0100 Subject: [PATCH 22/23] fix build with gcc4.8, use data() for QPointer sender in connect() --- examples/piechart/piechart.cpp | 4 ++-- 1 file changed, 2 insertions(+), 2 deletions(-) diff --git a/examples/piechart/piechart.cpp b/examples/piechart/piechart.cpp index 8955fc2..e979a75 100644 --- a/examples/piechart/piechart.cpp +++ b/examples/piechart/piechart.cpp @@ -123,7 +123,7 @@ void PieChart::setModel(const QVariant &m) return; if (m_model) { - disconnect(m_model, &QAbstractListModel::dataChanged, + disconnect(m_model.data(), &QAbstractListModel::dataChanged, this, &PieChart::dataChanged); } m_dataSource = model; @@ -134,7 +134,7 @@ void PieChart::setModel(const QVariant &m) m_model = alm; } if (m_model) { - connect(m_model, &QAbstractListModel::dataChanged, + connect(m_model.data(), &QAbstractListModel::dataChanged, this, &PieChart::dataChanged); updateData(); } From da0da363e88c7e45a7e17047d99ebf5da66516b8 Mon Sep 17 00:00:00 2001 From: Gunnar Roth Date: Thu, 21 Jan 2016 00:00:34 +0100 Subject: [PATCH 23/23] adpat piechart to upstream changes --- examples/piechart/piechart.h | 2 -- examples/piechart/piechart.pro | 1 - 2 files changed, 3 deletions(-) diff --git a/examples/piechart/piechart.h b/examples/piechart/piechart.h index 550b26d..9af2f9e 100644 --- a/examples/piechart/piechart.h +++ b/examples/piechart/piechart.h @@ -9,8 +9,6 @@ // PieChartPainter contains the painting code class PieChartPainter : public QNanoQuickItemPainter { - Q_OBJECT - public: PieChartPainter() { diff --git a/examples/piechart/piechart.pro b/examples/piechart/piechart.pro index 952d3e9..2306246 100644 --- a/examples/piechart/piechart.pro +++ b/examples/piechart/piechart.pro @@ -1,5 +1,4 @@ TEMPLATE = app -CONFIG += c++11 QT += qml quick SOURCES += main.cpp \