##// END OF EJS Templates
Documentation for QML custom model demo
Tero Ahola -
r1385:c13c825c33e5
parent child
Show More
@@ -0,0 +1,29
1 /*!
2 \example demos/qmlcustommodel
3 \title QML Custom Model
4 \subtitle
5
6 This example shows how to use your own QAbstractItemModel derived data model as a data source for a ChartView.
7 \image demos_qmlcustommodel.png
8
9 First we create a ChartView:
10 \snippet ../demos/qmlcustommodel/qml/qmlcustommodel/main.qml 1
11
12 Then our data model that contains the shares of top-5 car manufacturers in Finland for the last 5 years. The model
13 could be constructed from various sources depending on the use case, but here we use static data for the sake of
14 simplicity. Check customtablemodel.cpp, declarativemodel.cpp and plugin.cpp to see how to make your own
15 QAbstractItemModel accessible on QML.
16 \snippet ../demos/qmlcustommodel/qml/qmlcustommodel/main.qml 2
17
18 Then we create several series as children for the same ChartView. First a pie series that illustrates the shares of
19 the car manufacturers in Finland in 2011:
20 \snippet ../demos/qmlcustommodel/qml/qmlcustommodel/main.qml 3
21
22 And one line series for each manufacturer presenting the share between 2007-2011, for example this one is for
23 Volkswagen. The series is not visible by default; it is made visible when the user clicks on the Volkswagen slice
24 on the pie series:
25 \snippet ../demos/qmlcustommodel/qml/qmlcustommodel/main.qml 4
26
27 And finally a bar series that shows the share for all the other manufacturers between 2007-2011:
28 \snippet ../demos/qmlcustommodel/qml/qmlcustommodel/main.qml 5
29 */
@@ -1,109 +1,97
1 /****************************************************************************
1 /****************************************************************************
2 **
2 **
3 ** Copyright (C) 2012 Digia Plc
3 ** Copyright (C) 2012 Digia Plc
4 ** All rights reserved.
4 ** All rights reserved.
5 ** For any questions to Digia, please use contact form at http://qt.digia.com
5 ** For any questions to Digia, please use contact form at http://qt.digia.com
6 **
6 **
7 ** This file is part of the Qt Commercial Charts Add-on.
7 ** This file is part of the Qt Commercial Charts Add-on.
8 **
8 **
9 ** $QT_BEGIN_LICENSE$
9 ** $QT_BEGIN_LICENSE$
10 ** Licensees holding valid Qt Commercial licenses may use this file in
10 ** Licensees holding valid Qt Commercial licenses may use this file in
11 ** accordance with the Qt Commercial License Agreement provided with the
11 ** accordance with the Qt Commercial License Agreement provided with the
12 ** Software or, alternatively, in accordance with the terms contained in
12 ** Software or, alternatively, in accordance with the terms contained in
13 ** a written agreement between you and Digia.
13 ** a written agreement between you and Digia.
14 **
14 **
15 ** If you have questions regarding the use of this file, please use
15 ** If you have questions regarding the use of this file, please use
16 ** contact form at http://qt.digia.com
16 ** contact form at http://qt.digia.com
17 ** $QT_END_LICENSE$
17 ** $QT_END_LICENSE$
18 **
18 **
19 ****************************************************************************/
19 ****************************************************************************/
20
20
21 #include "declarativemodel.h"
21 #include "declarativemodel.h"
22 #include <qdeclarativelist.h>
22 #include <qdeclarativelist.h>
23 #include <QDebug>
23 #include <QDebug>
24
24
25 ////////////// Table model element ///////////////////
25 ////////////// Table model element ///////////////////
26
26
27 DeclarativeTableModelElement::DeclarativeTableModelElement(QObject *parent)
27 DeclarativeTableModelElement::DeclarativeTableModelElement(QObject *parent)
28 : QObject(parent)
28 : QObject(parent)
29 {
29 {
30 }
30 }
31
31
32 QVariantList DeclarativeTableModelElement::values()
32 QVariantList DeclarativeTableModelElement::values()
33 {
33 {
34 return m_values;
34 return m_values;
35 }
35 }
36
36
37 void DeclarativeTableModelElement::setValues(QVariantList values)
37 void DeclarativeTableModelElement::setValues(QVariantList values)
38 {
38 {
39 m_values = values;
39 m_values = values;
40 }
40 }
41
41
42 ////////////// Table model ///////////////////
42 ////////////// Table model ///////////////////
43
43
44 DeclarativeTableModel::DeclarativeTableModel(QObject *parent) :
44 DeclarativeTableModel::DeclarativeTableModel(QObject *parent) :
45 CustomTableModel(parent)
45 CustomTableModel(parent)
46 {
46 {
47 }
47 }
48
48
49 void DeclarativeTableModel::classBegin()
49 void DeclarativeTableModel::classBegin()
50 {
50 {
51 }
51 }
52
52
53 void DeclarativeTableModel::componentComplete()
53 void DeclarativeTableModel::componentComplete()
54 {
54 {
55 foreach (QObject *child, children()) {
55 foreach (QObject *child, children()) {
56 if (qobject_cast<DeclarativeTableModelElement *>(child)) {
56 if (qobject_cast<DeclarativeTableModelElement *>(child)) {
57 append(qobject_cast<DeclarativeTableModelElement *>(child)->values());
57 append(qobject_cast<DeclarativeTableModelElement *>(child)->values());
58 }
58 }
59 }
59 }
60 }
60 }
61
61
62 QDeclarativeListProperty<QObject> DeclarativeTableModel::modelChildren()
62 QDeclarativeListProperty<QObject> DeclarativeTableModel::modelChildren()
63 {
63 {
64 return QDeclarativeListProperty<QObject>(this, 0, &DeclarativeTableModel::appendModelChild);
64 return QDeclarativeListProperty<QObject>(this, 0, &DeclarativeTableModel::appendModelChild);
65 }
65 }
66
66
67 void DeclarativeTableModel::appendModelChild(QDeclarativeListProperty<QObject> *list,
67 void DeclarativeTableModel::appendModelChild(QDeclarativeListProperty<QObject> *list,
68 QObject *child)
68 QObject *child)
69 {
69 {
70 // childs are added in componentComplete instead
70 // childs are added in componentComplete instead
71 Q_UNUSED(list)
71 Q_UNUSED(list)
72 Q_UNUSED(child)
72 Q_UNUSED(child)
73 }
73 }
74
74
75 void DeclarativeTableModel::append(QVariantList values)
75 void DeclarativeTableModel::append(QVariantList values)
76 {
76 {
77 // qDebug() << "DeclarativeTableModel::append:" << values;
77 // qDebug() << "DeclarativeTableModel::append:" << values;
78
78
79 while (columnCount() < values.count())
79 while (columnCount() < values.count())
80 insertColumn(columnCount());
80 insertColumn(columnCount());
81
81
82 insertRow(rowCount());
82 insertRow(rowCount());
83
83
84 QModelIndex beginIndex = QModelIndex();
84 QModelIndex beginIndex = QModelIndex();
85 QModelIndex endIndex = QModelIndex();
85 QModelIndex endIndex = QModelIndex();
86 for (int i(0); i < values.count(); i++) {
86 for (int i(0); i < values.count(); i++) {
87 QModelIndex modelIndex = createIndex(rowCount() - 1, i);
87 QModelIndex modelIndex = createIndex(rowCount() - 1, i);
88 if (i == 0)
88 if (i == 0)
89 beginIndex = modelIndex;
89 beginIndex = modelIndex;
90 if (i == (values.count() - 1))
90 if (i == (values.count() - 1))
91 endIndex = modelIndex;
91 endIndex = modelIndex;
92 setData(modelIndex, values.at(i));
92 setData(modelIndex, values.at(i));
93 }
93 }
94 dataChanged(beginIndex, endIndex);
94 dataChanged(beginIndex, endIndex);
95 }
95 }
96
96
97 //void DeclarativeTableModel::appendPoint(QXYModelMapper *mapper, DeclarativeXyPoint *point)
98 //{
99 // Q_UNUSED(mapper)
100 // Q_UNUSED(point)
101 // // TODO: XYModelMapper implementation has change, this code has to be updated.
102 //// qDebug() << "DeclarativeTableModel::appendPoint:" << point;
103 //// QVariantList values;
104 //// values.insert(mapper->mapX(), point->x());
105 //// values.insert(mapper->mapY(), point->y());
106 //// append(values);
107 //}
108
109 #include "moc_declarativemodel.cpp"
97 #include "moc_declarativemodel.cpp"
@@ -1,64 +1,63
1 /****************************************************************************
1 /****************************************************************************
2 **
2 **
3 ** Copyright (C) 2012 Digia Plc
3 ** Copyright (C) 2012 Digia Plc
4 ** All rights reserved.
4 ** All rights reserved.
5 ** For any questions to Digia, please use contact form at http://qt.digia.com
5 ** For any questions to Digia, please use contact form at http://qt.digia.com
6 **
6 **
7 ** This file is part of the Qt Commercial Charts Add-on.
7 ** This file is part of the Qt Commercial Charts Add-on.
8 **
8 **
9 ** $QT_BEGIN_LICENSE$
9 ** $QT_BEGIN_LICENSE$
10 ** Licensees holding valid Qt Commercial licenses may use this file in
10 ** Licensees holding valid Qt Commercial licenses may use this file in
11 ** accordance with the Qt Commercial License Agreement provided with the
11 ** accordance with the Qt Commercial License Agreement provided with the
12 ** Software or, alternatively, in accordance with the terms contained in
12 ** Software or, alternatively, in accordance with the terms contained in
13 ** a written agreement between you and Digia.
13 ** a written agreement between you and Digia.
14 **
14 **
15 ** If you have questions regarding the use of this file, please use
15 ** If you have questions regarding the use of this file, please use
16 ** contact form at http://qt.digia.com
16 ** contact form at http://qt.digia.com
17 ** $QT_END_LICENSE$
17 ** $QT_END_LICENSE$
18 **
18 **
19 ****************************************************************************/
19 ****************************************************************************/
20
20
21 #ifndef DECLARATIVEMODEL_H
21 #ifndef DECLARATIVEMODEL_H
22 #define DECLARATIVEMODEL_H
22 #define DECLARATIVEMODEL_H
23
23
24 #include "customtablemodel.h"
24 #include "customtablemodel.h"
25 #include <QDeclarativeListProperty>
25 #include <QDeclarativeListProperty>
26 #include <QVariant>
26 #include <QVariant>
27 #include <QDeclarativeParserStatus>
27 #include <QDeclarativeParserStatus>
28
28
29 class DeclarativeTableModelElement : public QObject
29 class DeclarativeTableModelElement : public QObject
30 {
30 {
31 Q_OBJECT
31 Q_OBJECT
32 Q_PROPERTY(QVariantList values READ values WRITE setValues)
32 Q_PROPERTY(QVariantList values READ values WRITE setValues)
33
33
34 public:
34 public:
35 explicit DeclarativeTableModelElement(QObject *parent = 0);
35 explicit DeclarativeTableModelElement(QObject *parent = 0);
36 QVariantList values();
36 QVariantList values();
37 void setValues(QVariantList values);
37 void setValues(QVariantList values);
38 private:
38 private:
39 QVariantList m_values;
39 QVariantList m_values;
40 };
40 };
41
41
42 class DeclarativeTableModel : public CustomTableModel, public QDeclarativeParserStatus
42 class DeclarativeTableModel : public CustomTableModel, public QDeclarativeParserStatus
43 {
43 {
44 Q_OBJECT
44 Q_OBJECT
45 Q_INTERFACES(QDeclarativeParserStatus)
45 Q_INTERFACES(QDeclarativeParserStatus)
46 Q_PROPERTY(QDeclarativeListProperty<QObject> modelChildren READ modelChildren)
46 Q_PROPERTY(QDeclarativeListProperty<QObject> modelChildren READ modelChildren)
47 Q_CLASSINFO("DefaultProperty", "modelChildren")
47 Q_CLASSINFO("DefaultProperty", "modelChildren")
48
48
49 public:
49 public:
50 explicit DeclarativeTableModel(QObject *parent = 0);
50 explicit DeclarativeTableModel(QObject *parent = 0);
51 QDeclarativeListProperty<QObject> modelChildren();
51 QDeclarativeListProperty<QObject> modelChildren();
52 // void appendPoint(QXYModelMapper *mapper, DeclarativeXyPoint *point);
53
52
54 public: // from QDeclarativeParserStatus
53 public: // from QDeclarativeParserStatus
55 void classBegin();
54 void classBegin();
56 void componentComplete();
55 void componentComplete();
57
56
58 public Q_SLOTS:
57 public Q_SLOTS:
59 void append(QVariantList slices);
58 void append(QVariantList slices);
60 static void appendModelChild(QDeclarativeListProperty<QObject> *list,
59 static void appendModelChild(QDeclarativeListProperty<QObject> *list,
61 QObject *element);
60 QObject *element);
62 };
61 };
63
62
64 #endif // DECLARATIVEMODEL_H
63 #endif // DECLARATIVEMODEL_H
@@ -1,146 +1,155
1 /****************************************************************************
1 /****************************************************************************
2 **
2 **
3 ** Copyright (C) 2012 Digia Plc
3 ** Copyright (C) 2012 Digia Plc
4 ** All rights reserved.
4 ** All rights reserved.
5 ** For any questions to Digia, please use contact form at http://qt.digia.com
5 ** For any questions to Digia, please use contact form at http://qt.digia.com
6 **
6 **
7 ** This file is part of the Qt Commercial Charts Add-on.
7 ** This file is part of the Qt Commercial Charts Add-on.
8 **
8 **
9 ** $QT_BEGIN_LICENSE$
9 ** $QT_BEGIN_LICENSE$
10 ** Licensees holding valid Qt Commercial licenses may use this file in
10 ** Licensees holding valid Qt Commercial licenses may use this file in
11 ** accordance with the Qt Commercial License Agreement provided with the
11 ** accordance with the Qt Commercial License Agreement provided with the
12 ** Software or, alternatively, in accordance with the terms contained in
12 ** Software or, alternatively, in accordance with the terms contained in
13 ** a written agreement between you and Digia.
13 ** a written agreement between you and Digia.
14 **
14 **
15 ** If you have questions regarding the use of this file, please use
15 ** If you have questions regarding the use of this file, please use
16 ** contact form at http://qt.digia.com
16 ** contact form at http://qt.digia.com
17 ** $QT_END_LICENSE$
17 ** $QT_END_LICENSE$
18 **
18 **
19 ****************************************************************************/
19 ****************************************************************************/
20
20
21 import QtQuick 1.0
21 import QtQuick 1.0
22 import QtCommercial.Chart 1.0
22 import QtCommercial.Chart 1.0
23 import QmlCustomModel 1.0
23 import QmlCustomModel 1.0
24
24
25 Rectangle {
25 Rectangle {
26 width: parent.width
26 width: parent.width
27 height: parent.height
27 height: parent.heigh
28
28
29 //![1]
29 ChartView {
30 ChartView {
30 id: chartView
31 id: chartView
31 title: "Top-5 car brand shares in Finland"
32 title: "Top-5 car brand shares in Finland"
32 anchors.fill: parent
33 anchors.fill: parent
33 theme: ChartView.ChartThemeLight
34 axisX.max: 10
34 axisX.max: 10
35 axisX.min: 0
35 axisX.min: 0
36 axisY.max: 20
36 axisY.max: 20
37 axisY.min: 0
37 axisY.min: 0
38 animationOptions: ChartView.SeriesAnimations
38 animationOptions: ChartView.SeriesAnimations
39 axisXLabels: [0, "2007", 1, "2008", 2, "2009", 3, "2010", 4, "2011", 5, "2012"]
39 axisXLabels: [0, "2007", 1, "2008", 2, "2009", 3, "2010", 4, "2011", 5, "2012"]
40 // ...
41 //![1]
40
42
41 // For dynamic data we use a custom data model derived from QAbstractiItemModel
43 //![2]
42 CustomModel {
44 CustomModel {
43 id: customModel
45 id: customModel
44 CustomModelElement { values: [0, "Manufacturer", 0, 1, 2, 3, 4] }
46 CustomModelElement { values: [0, "Manufacturer", 0, 1, 2, 3, 4] }
45 CustomModelElement { values: [1, "Volkswagen", 10.3, 12.0, 12.8, 13.0, 13.8] }
47 CustomModelElement { values: [1, "Volkswagen", 10.3, 12.0, 12.8, 13.0, 13.8] }
46 CustomModelElement { values: [2, "Toyota", 13.8, 13.5, 16.2, 13.7, 10.7] }
48 CustomModelElement { values: [2, "Toyota", 13.8, 13.5, 16.2, 13.7, 10.7] }
47 CustomModelElement { values: [3, "Ford", 6.4, 7.1, 8.9, 8.2, 8.6] }
49 CustomModelElement { values: [3, "Ford", 6.4, 7.1, 8.9, 8.2, 8.6] }
48 CustomModelElement { values: [4, "Skoda", 4.7, 5.8, 6.9, 8.3, 8.2] }
50 CustomModelElement { values: [4, "Skoda", 4.7, 5.8, 6.9, 8.3, 8.2] }
49 CustomModelElement { values: [5, "Volvo", 7.1, 6.7, 6.5, 6.3, 7.0] }
51 CustomModelElement { values: [5, "Volvo", 7.1, 6.7, 6.5, 6.3, 7.0] }
50 CustomModelElement { values: [6, "Others", 57.7, 54.9, 48.7, 50.5, 51.7] }
52 CustomModelElement { values: [6, "Others", 57.7, 54.9, 48.7, 50.5, 51.7] }
51 }
53 }
54 //![2]
52
55
56 //![5]
53 BarSeries {
57 BarSeries {
54 name: "Others"
58 name: "Others"
55 barMargin: 0
59 barMargin: 0
56 visible: false
60 visible: false
57 HBarModelMapper {
61 HBarModelMapper {
58 model: customModel
62 model: customModel
59 firstBarSetRow: 6
63 firstBarSetRow: 6
60 lastBarSetRow: 6
64 lastBarSetRow: 6
61 first: 2
65 first: 2
62 }
66 }
63 }
67 }
68 //![5]
64
69
70 //![4]
65 LineSeries {
71 LineSeries {
66 name: "Volkswagen"
72 name: "Volkswagen"
67 visible: false
73 visible: false
68 HXYModelMapper {
74 HXYModelMapper {
69 model: customModel
75 model: customModel
70 xRow: 0
76 xRow: 0
71 yRow: 1
77 yRow: 1
72 first: 2
78 first: 2
73 }
79 }
74 }
80 }
81 //![4]
75
82
76 LineSeries {
83 LineSeries {
77 name: "Toyota"
84 name: "Toyota"
78 visible: false
85 visible: false
79 HXYModelMapper {
86 HXYModelMapper {
80 model: customModel
87 model: customModel
81 xRow: 0
88 xRow: 0
82 yRow: 2
89 yRow: 2
83 first: 2
90 first: 2
84 }
91 }
85 }
92 }
86
93
87 LineSeries {
94 LineSeries {
88 name: "Ford"
95 name: "Ford"
89 visible: false
96 visible: false
90 HXYModelMapper {
97 HXYModelMapper {
91 model: customModel
98 model: customModel
92 xRow: 0
99 xRow: 0
93 yRow: 2
100 yRow: 2
94 first: 2
101 first: 2
95 }
102 }
96 }
103 }
97
104
98 LineSeries {
105 LineSeries {
99 name: "Skoda"
106 name: "Skoda"
100 visible: false
107 visible: false
101 HXYModelMapper {
108 HXYModelMapper {
102 model: customModel
109 model: customModel
103 xRow: 0
110 xRow: 0
104 yRow: 3
111 yRow: 3
105 first: 2
112 first: 2
106 }
113 }
107 }
114 }
108
115
109 LineSeries {
116 LineSeries {
110 name: "Volvo"
117 name: "Volvo"
111 visible: false
118 visible: false
112 HXYModelMapper {
119 HXYModelMapper {
113 model: customModel
120 model: customModel
114 xRow: 0
121 xRow: 0
115 yRow: 4
122 yRow: 4
116 first: 2
123 first: 2
117 }
124 }
118 }
125 }
119
126
127 //![3]
120 PieSeries {
128 PieSeries {
121 id: pieSeries
129 id: pieSeries
122 size: 0.4
130 size: 0.4
123 horizontalPosition: 0.7
131 horizontalPosition: 0.7
124 verticalPosition: 0.4
132 verticalPosition: 0.4
125 onClicked: {
133 onClicked: {
126 // Show the selection by exploding the slice
134 // Show the selection by exploding the slice
127 slice.exploded = !slice.exploded;
135 slice.exploded = !slice.exploded;
128
136
129 // Update the line series to show the yearly data for this slice
137 // Update the line series to show the yearly data for this slice
130 for (var i = 0; i < chartView.count; i++) {
138 for (var i = 0; i < chartView.count; i++) {
131 if (chartView.series(i).name == slice.label) {
139 if (chartView.series(i).name == slice.label) {
132 chartView.series(i).visible = slice.exploded;
140 chartView.series(i).visible = slice.exploded;
133 }
141 }
134 }
142 }
135 }
143 }
136 }
144 }
145 //![3]
137
146
138 VPieModelMapper {
147 VPieModelMapper {
139 series: pieSeries
148 series: pieSeries
140 model: customModel
149 model: customModel
141 labelsColumn: 1
150 labelsColumn: 1
142 valuesColumn: 2
151 valuesColumn: 2
143 first: 1
152 first: 1
144 }
153 }
145 }
154 }
146 }
155 }
@@ -1,26 +1,27
1 /*!
1 /*!
2 \page demos.html
2 \page demos.html
3 \title Demos
3 \title Demos
4 \keyword Demos
4 \keyword Demos
5
5
6 \raw HTML
6 \raw HTML
7 <table cellpadding="2" cellspacing="1" border="0" width="100%" class="indextable">
7 <table cellpadding="2" cellspacing="1" border="0" width="100%" class="indextable">
8 <tr>
8 <tr>
9 <th class="titleheader" width="33%">
9 <th class="titleheader" width="33%">
10 List of demos
10 List of demos
11 </th>
11 </th>
12 </tr>
12 </tr>
13 <tr>
13 <tr>
14 <td valign="top">
14 <td valign="top">
15 <ul>
15 <ul>
16 <li><a href="demos-chartthemes.html">Chart themes</a></li>
16 <li><a href="demos-chartthemes.html">Chart themes</a></li>
17 <li><a href="demos-piechartcustomization.html">Pie chart customization</a></li>
17 <li><a href="demos-piechartcustomization.html">Pie chart customization</a></li>
18 <li><a href="demos-dynamicspline.html">Dynamic spline chart</a></li>
18 <li><a href="demos-dynamicspline.html">Dynamic spline chart</a></li>
19 <li><a href="demos-qmlchart.html">Qml Basic Charts</a></li>
19 <li><a href="demos-qmlchart.html">Qml Basic Charts</a></li>
20 <li><a href="demos-qmlweather.html">Qml Weather</a></li>
20 <li><a href="demos-qmlweather.html">Qml Weather</a></li>
21 <li><a href="demos-qmlcustommodel.html">Qml Custom Model</a></li>
21 </ul>
22 </ul>
22 </td>
23 </td>
23 </tr>
24 </tr>
24 </table>
25 </table>
25 \endraw
26 \endraw
26 */
27 */
General Comments 0
You need to be logged in to leave comments. Login now