summaryrefslogtreecommitdiffstats
path: root/examples/datavisualization/qmlbars
diff options
context:
space:
mode:
Diffstat (limited to 'examples/datavisualization/qmlbars')
-rw-r--r--examples/datavisualization/qmlbars/doc/images/qmlbars-example.pngbin0 -> 149167 bytes
-rw-r--r--examples/datavisualization/qmlbars/doc/src/qmlbars.qdoc93
-rw-r--r--examples/datavisualization/qmlbars/main.cpp51
-rw-r--r--examples/datavisualization/qmlbars/qml/qmlbars/Axes.qml52
-rw-r--r--examples/datavisualization/qmlbars/qml/qmlbars/Data.qml119
-rw-r--r--examples/datavisualization/qmlbars/qml/qmlbars/main.qml303
-rw-r--r--examples/datavisualization/qmlbars/qmlbars.desktop11
-rw-r--r--examples/datavisualization/qmlbars/qmlbars.pro20
-rw-r--r--examples/datavisualization/qmlbars/qmlbars.qrc7
-rw-r--r--examples/datavisualization/qmlbars/qmlbars64.pngbin0 -> 3400 bytes
-rw-r--r--examples/datavisualization/qmlbars/qtquick2applicationviewer/qtquick2applicationviewer.cpp81
-rw-r--r--examples/datavisualization/qmlbars/qtquick2applicationviewer/qtquick2applicationviewer.h33
-rw-r--r--examples/datavisualization/qmlbars/qtquick2applicationviewer/qtquick2applicationviewer.pri180
13 files changed, 950 insertions, 0 deletions
diff --git a/examples/datavisualization/qmlbars/doc/images/qmlbars-example.png b/examples/datavisualization/qmlbars/doc/images/qmlbars-example.png
new file mode 100644
index 00000000..64ad6b0e
--- /dev/null
+++ b/examples/datavisualization/qmlbars/doc/images/qmlbars-example.png
Binary files differ
diff --git a/examples/datavisualization/qmlbars/doc/src/qmlbars.qdoc b/examples/datavisualization/qmlbars/doc/src/qmlbars.qdoc
new file mode 100644
index 00000000..cc344c9c
--- /dev/null
+++ b/examples/datavisualization/qmlbars/doc/src/qmlbars.qdoc
@@ -0,0 +1,93 @@
+/****************************************************************************
+**
+** Copyright (C) 2014 Digia Plc
+** All rights reserved.
+** For any questions to Digia, please use contact form at http://qt.digia.com
+**
+** This file is part of the QtDataVisualization module.
+**
+** Licensees holding valid Qt Enterprise licenses may use this file in
+** accordance with the Qt Enterprise License Agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and Digia.
+**
+** If you have questions regarding the use of this file, please use
+** contact form at http://qt.digia.com
+**
+****************************************************************************/
+
+/*!
+ \example qmlbars
+ \title Qt Quick 2 Bars Example
+ \ingroup qtdatavisualization_examples
+ \brief Using Bars3D in a QML application.
+
+ The Qt Quick 2 bars example shows how to make a simple 3D bar graph using Bars3D and Qt
+ Quick 2.
+
+ \image qmlbars-example.png
+
+ The interesting thing about this example is switching series and displaying more than one series
+ at once. We'll concentrate on those and skip explaining the basic Bars3D functionality - for
+ more detailed QML example documentation, see \l{Qt Quick 2 Scatter Example}.
+
+ \section1 Data
+
+ The example data is monthly income and expenses of a fictional company over several years.
+ The data is defined in a list model in \c Data.qml like this:
+
+ \snippet ../examples/qmlbars/qml/qmlbars/Data.qml 0
+ \dots
+
+ Each data item has four roles: year, month, income, and expenses. Years and months are natural to
+ map to rows and columns of a bar chart, but we can only show either income or expenses as the
+ value.
+
+ Now we need to add the data to the Bars3D graph. We will create two Bar3DSeries inside it,
+ starting with a series for the income:
+
+ \snippet ../examples/qmlbars/qml/qmlbars/main.qml 3
+ \dots
+
+ The data is attached to the \c itemModel property of the ItemModelBarDataProxy inside the
+ series.
+
+ Then we add another series for the expenses:
+
+ \snippet ../examples/qmlbars/qml/qmlbars/main.qml 4
+ \dots
+
+ We use the \c visible property of the series to hide the second series for now.
+
+ \section1 Custom axis labels
+
+ One interesting tidbit about axes is that we redefine the category labels for column axis in
+ \c Axes.qml. This is done because the data contains abbreviated month names, which we don't want
+ to use for our column labels:
+
+ \snippet ../examples/qmlbars/qml/qmlbars/Axes.qml 0
+
+ \section1 Switching series
+
+ In the \c main.qml, we set up the graph and various UI elements. There are three interesting
+ code blocks we want to highlight here. The first one shows how to change the
+ visualized data between income, expenses, and both, by simply changing visibility of the two
+ series:
+
+ \snippet ../examples/qmlbars/qml/qmlbars/main.qml 0
+
+ The axis change is done because income and expenses have a different label format. The same could have
+ been achieved using a single axis and just changing the label format.
+
+ The second interesting block is where we filter some of the rows away from the visualized data:
+
+ \snippet ../examples/qmlbars/qml/qmlbars/main.qml 1
+
+ The filtering is done by setting \c autoRowCategories to false on the ItemModelBarDataProxy item and defining
+ the row categories explicitly. This way, only the items in specified rows are visualized.
+
+ The third interesting block shows how to get the row and column index of an item if you know the
+ row and column values by using ItemModelBarDataProxy methods \c rowCategoryIndex() and \c columnCategoryIndex():
+
+ \snippet ../examples/qmlbars/qml/qmlbars/main.qml 2
+*/
diff --git a/examples/datavisualization/qmlbars/main.cpp b/examples/datavisualization/qmlbars/main.cpp
new file mode 100644
index 00000000..a6b2f4c5
--- /dev/null
+++ b/examples/datavisualization/qmlbars/main.cpp
@@ -0,0 +1,51 @@
+/****************************************************************************
+**
+** Copyright (C) 2014 Digia Plc
+** All rights reserved.
+** For any questions to Digia, please use contact form at http://qt.digia.com
+**
+** This file is part of the QtDataVisualization module.
+**
+** Licensees holding valid Qt Enterprise licenses may use this file in
+** accordance with the Qt Enterprise License Agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and Digia.
+**
+** If you have questions regarding the use of this file, please use
+** contact form at http://qt.digia.com
+**
+****************************************************************************/
+
+#include "qtquick2applicationviewer.h"
+#include <QtDataVisualization/qutils.h>
+
+#include <QtGui/QGuiApplication>
+#include <QtCore/QDir>
+
+int main(int argc, char *argv[])
+{
+ QGuiApplication app(argc, argv);
+
+ QtQuick2ApplicationViewer viewer;
+
+ // Enable antialiasing
+ viewer.setFormat(QtDataVisualization::qDefaultSurfaceFormat());
+
+ // The following are needed to make examples run without having to install the module
+ // in desktop environments.
+#ifdef Q_OS_WIN
+ QString extraImportPath(QStringLiteral("%1/../../../../%2"));
+#else
+ QString extraImportPath(QStringLiteral("%1/../../../%2"));
+#endif
+ viewer.addImportPath(extraImportPath.arg(QGuiApplication::applicationDirPath(),
+ QString::fromLatin1("qml")));
+
+ viewer.setTitle(QStringLiteral("Monthly income/expenses"));
+
+ viewer.setSource(QUrl("qrc:/qml/qmlbars/main.qml"));
+ viewer.setResizeMode(QQuickView::SizeRootObjectToView);
+ viewer.show();
+
+ return app.exec();
+}
diff --git a/examples/datavisualization/qmlbars/qml/qmlbars/Axes.qml b/examples/datavisualization/qmlbars/qml/qmlbars/Axes.qml
new file mode 100644
index 00000000..29979e1b
--- /dev/null
+++ b/examples/datavisualization/qmlbars/qml/qmlbars/Axes.qml
@@ -0,0 +1,52 @@
+/****************************************************************************
+**
+** Copyright (C) 2014 Digia Plc
+** All rights reserved.
+** For any questions to Digia, please use contact form at http://qt.digia.com
+**
+** This file is part of the QtDataVisualization module.
+**
+** Licensees holding valid Qt Enterprise licenses may use this file in
+** accordance with the Qt Enterprise License Agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and Digia.
+**
+** If you have questions regarding the use of this file, please use
+** contact form at http://qt.digia.com
+**
+****************************************************************************/
+
+import QtQuick 2.1
+import QtDataVisualization 1.0
+
+Item {
+ property alias column: columnAxis
+ property alias expenses: expensesAxis
+ property alias income: incomeAxis
+
+ // For row labels we can use row labels from data proxy, so default axis
+ // suffices for rows.
+
+ // Custom labels for columns, since the data contains abbreviated month names.
+ //! [0]
+ CategoryAxis3D {
+ id: columnAxis
+ labels: ["January", "February", "March", "April", "May", "June",
+ "July", "August", "September", "October", "November", "December"]
+ }
+ //! [0]
+ ValueAxis3D {
+ id: incomeAxis
+ min: 0
+ max: 35
+ labelFormat: "%.2f M\u20AC"
+ title: "Monthly income"
+ }
+ ValueAxis3D {
+ id: expensesAxis
+ min: 0
+ max: 35
+ labelFormat: "-%.2f M\u20AC"
+ title: "Monthly expenses"
+ }
+}
diff --git a/examples/datavisualization/qmlbars/qml/qmlbars/Data.qml b/examples/datavisualization/qmlbars/qml/qmlbars/Data.qml
new file mode 100644
index 00000000..7e0978c6
--- /dev/null
+++ b/examples/datavisualization/qmlbars/qml/qmlbars/Data.qml
@@ -0,0 +1,119 @@
+/****************************************************************************
+**
+** Copyright (C) 2014 Digia Plc
+** All rights reserved.
+** For any questions to Digia, please use contact form at http://qt.digia.com
+**
+** This file is part of the QtDataVisualization module.
+**
+** Licensees holding valid Qt Enterprise licenses may use this file in
+** accordance with the Qt Enterprise License Agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and Digia.
+**
+** If you have questions regarding the use of this file, please use
+** contact form at http://qt.digia.com
+**
+****************************************************************************/
+
+import QtQuick 2.1
+
+Item {
+ property alias model: dataModel
+
+ //! [0]
+ ListModel {
+ id: dataModel
+ ListElement{ year: "2006"; month: "Jan"; expenses: "4"; income: "5" }
+ ListElement{ year: "2006"; month: "Feb"; expenses: "5"; income: "6" }
+ ListElement{ year: "2006"; month: "Mar"; expenses: "7"; income: "4" }
+ //! [0]
+ ListElement{ year: "2006"; month: "Apr"; expenses: "3"; income: "2" }
+ ListElement{ year: "2006"; month: "May"; expenses: "4"; income: "1" }
+ ListElement{ year: "2006"; month: "Jun"; expenses: "2"; income: "2" }
+ ListElement{ year: "2006"; month: "Jul"; expenses: "1"; income: "3" }
+ ListElement{ year: "2006"; month: "Aug"; expenses: "5"; income: "1" }
+ ListElement{ year: "2006"; month: "Sep"; expenses: "2"; income: "3" }
+ ListElement{ year: "2006"; month: "Oct"; expenses: "5"; income: "2" }
+ ListElement{ year: "2006"; month: "Nov"; expenses: "8"; income: "5" }
+ ListElement{ year: "2006"; month: "Dec"; expenses: "3"; income: "3" }
+
+ ListElement{ year: "2007"; month: "Jan"; expenses: "3"; income: "1" }
+ ListElement{ year: "2007"; month: "Feb"; expenses: "4"; income: "2" }
+ ListElement{ year: "2007"; month: "Mar"; expenses: "12"; income: "4" }
+ ListElement{ year: "2007"; month: "Apr"; expenses: "13"; income: "6" }
+ ListElement{ year: "2007"; month: "May"; expenses: "14"; income: "11" }
+ ListElement{ year: "2007"; month: "Jun"; expenses: "7"; income: "7" }
+ ListElement{ year: "2007"; month: "Jul"; expenses: "6"; income: "4" }
+ ListElement{ year: "2007"; month: "Aug"; expenses: "4"; income: "15" }
+ ListElement{ year: "2007"; month: "Sep"; expenses: "2"; income: "18" }
+ ListElement{ year: "2007"; month: "Oct"; expenses: "29"; income: "25" }
+ ListElement{ year: "2007"; month: "Nov"; expenses: "23"; income: "29" }
+ ListElement{ year: "2007"; month: "Dec"; expenses: "5"; income: "9" }
+
+ ListElement{ year: "2008"; month: "Jan"; expenses: "3"; income: "8" }
+ ListElement{ year: "2008"; month: "Feb"; expenses: "8"; income: "14" }
+ ListElement{ year: "2008"; month: "Mar"; expenses: "10"; income: "20" }
+ ListElement{ year: "2008"; month: "Apr"; expenses: "12"; income: "24" }
+ ListElement{ year: "2008"; month: "May"; expenses: "10"; income: "19" }
+ ListElement{ year: "2008"; month: "Jun"; expenses: "5"; income: "8" }
+ ListElement{ year: "2008"; month: "Jul"; expenses: "1"; income: "4" }
+ ListElement{ year: "2008"; month: "Aug"; expenses: "7"; income: "12" }
+ ListElement{ year: "2008"; month: "Sep"; expenses: "4"; income: "16" }
+ ListElement{ year: "2008"; month: "Oct"; expenses: "22"; income: "33" }
+ ListElement{ year: "2008"; month: "Nov"; expenses: "16"; income: "25" }
+ ListElement{ year: "2008"; month: "Dec"; expenses: "2"; income: "7" }
+
+ ListElement{ year: "2009"; month: "Jan"; expenses: "4"; income: "5" }
+ ListElement{ year: "2009"; month: "Feb"; expenses: "4"; income: "7" }
+ ListElement{ year: "2009"; month: "Mar"; expenses: "11"; income: "14" }
+ ListElement{ year: "2009"; month: "Apr"; expenses: "16"; income: "22" }
+ ListElement{ year: "2009"; month: "May"; expenses: "3"; income: "5" }
+ ListElement{ year: "2009"; month: "Jun"; expenses: "4"; income: "8" }
+ ListElement{ year: "2009"; month: "Jul"; expenses: "7"; income: "9" }
+ ListElement{ year: "2009"; month: "Aug"; expenses: "9"; income: "13" }
+ ListElement{ year: "2009"; month: "Sep"; expenses: "1"; income: "6" }
+ ListElement{ year: "2009"; month: "Oct"; expenses: "14"; income: "25" }
+ ListElement{ year: "2009"; month: "Nov"; expenses: "19"; income: "29" }
+ ListElement{ year: "2009"; month: "Dec"; expenses: "5"; income: "7" }
+
+ ListElement{ year: "2010"; month: "Jan"; expenses: "14"; income: "22" }
+ ListElement{ year: "2010"; month: "Feb"; expenses: "5"; income: "7" }
+ ListElement{ year: "2010"; month: "Mar"; expenses: "1"; income: "9" }
+ ListElement{ year: "2010"; month: "Apr"; expenses: "1"; income: "12" }
+ ListElement{ year: "2010"; month: "May"; expenses: "5"; income: "9" }
+ ListElement{ year: "2010"; month: "Jun"; expenses: "5"; income: "8" }
+ ListElement{ year: "2010"; month: "Jul"; expenses: "3"; income: "7" }
+ ListElement{ year: "2010"; month: "Aug"; expenses: "1"; income: "5" }
+ ListElement{ year: "2010"; month: "Sep"; expenses: "2"; income: "4" }
+ ListElement{ year: "2010"; month: "Oct"; expenses: "10"; income: "13" }
+ ListElement{ year: "2010"; month: "Nov"; expenses: "12"; income: "17" }
+ ListElement{ year: "2010"; month: "Dec"; expenses: "6"; income: "9" }
+
+ ListElement{ year: "2011"; month: "Jan"; expenses: "2"; income: "6" }
+ ListElement{ year: "2011"; month: "Feb"; expenses: "4"; income: "8" }
+ ListElement{ year: "2011"; month: "Mar"; expenses: "7"; income: "12" }
+ ListElement{ year: "2011"; month: "Apr"; expenses: "9"; income: "15" }
+ ListElement{ year: "2011"; month: "May"; expenses: "7"; income: "19" }
+ ListElement{ year: "2011"; month: "Jun"; expenses: "9"; income: "18" }
+ ListElement{ year: "2011"; month: "Jul"; expenses: "13"; income: "17" }
+ ListElement{ year: "2011"; month: "Aug"; expenses: "5"; income: "9" }
+ ListElement{ year: "2011"; month: "Sep"; expenses: "3"; income: "8" }
+ ListElement{ year: "2011"; month: "Oct"; expenses: "13"; income: "15" }
+ ListElement{ year: "2011"; month: "Nov"; expenses: "8"; income: "17" }
+ ListElement{ year: "2011"; month: "Dec"; expenses: "7"; income: "10" }
+
+ ListElement{ year: "2012"; month: "Jan"; expenses: "12"; income: "16" }
+ ListElement{ year: "2012"; month: "Feb"; expenses: "24"; income: "28" }
+ ListElement{ year: "2012"; month: "Mar"; expenses: "27"; income: "22" }
+ ListElement{ year: "2012"; month: "Apr"; expenses: "29"; income: "25" }
+ ListElement{ year: "2012"; month: "May"; expenses: "27"; income: "29" }
+ ListElement{ year: "2012"; month: "Jun"; expenses: "19"; income: "18" }
+ ListElement{ year: "2012"; month: "Jul"; expenses: "13"; income: "17" }
+ ListElement{ year: "2012"; month: "Aug"; expenses: "15"; income: "19" }
+ ListElement{ year: "2012"; month: "Sep"; expenses: "3"; income: "8" }
+ ListElement{ year: "2012"; month: "Oct"; expenses: "3"; income: "6" }
+ ListElement{ year: "2012"; month: "Nov"; expenses: "4"; income: "8" }
+ ListElement{ year: "2012"; month: "Dec"; expenses: "5"; income: "9" }
+ }
+}
diff --git a/examples/datavisualization/qmlbars/qml/qmlbars/main.qml b/examples/datavisualization/qmlbars/qml/qmlbars/main.qml
new file mode 100644
index 00000000..0ff060ca
--- /dev/null
+++ b/examples/datavisualization/qmlbars/qml/qmlbars/main.qml
@@ -0,0 +1,303 @@
+/****************************************************************************
+**
+** Copyright (C) 2014 Digia Plc
+** All rights reserved.
+** For any questions to Digia, please use contact form at http://qt.digia.com
+**
+** This file is part of the QtDataVisualization module.
+**
+** Licensees holding valid Qt Enterprise licenses may use this file in
+** accordance with the Qt Enterprise License Agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and Digia.
+**
+** If you have questions regarding the use of this file, please use
+** contact form at http://qt.digia.com
+**
+****************************************************************************/
+
+import QtQuick 2.1
+import QtQuick.Controls 1.0
+import QtQuick.Layouts 1.0
+import QtDataVisualization 1.0
+import QtQuick.Window 2.0
+import "."
+
+Item {
+ id: mainview
+ width: 1280
+ height: 1024
+
+ property int buttonLayoutHeight: 180;
+ state: Screen.width < Screen.height ? "portrait" : "landscape"
+
+ Data {
+ id: graphData
+ }
+
+ Axes {
+ id: graphAxes
+ }
+
+ property Bar3DSeries selectedSeries
+ selectedSeries: barSeries
+
+ function handleSelectionChange(series, position) {
+ if (position != series.invalidSelectionPosition) {
+ selectedSeries = series
+ }
+
+ // Set tableView current row to selected bar
+ var rowRole = series.dataProxy.rowLabels[position.x];
+ var colRole = series.dataProxy.columnLabels[position.y];
+ var currentRow = tableView.currentRow
+ if (currentRow === -1 || rowRole !== graphData.model.get(currentRow).year
+ || colRole !== graphData.model.get(currentRow).month) {
+ var totalRows = tableView.rowCount;
+ for (var i = 0; i < totalRows; i++) {
+ var currentRowRole = graphData.model.get(i).year
+ var currentColRole = graphData.model.get(i).month
+ if (currentRowRole === rowRole && currentColRole === colRole) {
+ tableView.currentRow = i
+ // Workaround to 5.2 row selection issue
+ if (typeof tableView.selection != "undefined") {
+ tableView.selection.clear()
+ tableView.selection.select(i)
+ }
+ break
+ }
+ }
+ }
+ }
+
+ Item {
+ id: dataView
+ anchors.right: mainview.right;
+ anchors.bottom: mainview.bottom
+
+ Bars3D {
+ id: barGraph
+ width: dataView.width
+ height: dataView.height
+ shadowQuality: AbstractGraph3D.ShadowQualityMedium
+ selectionMode: AbstractGraph3D.SelectionItem
+ theme: Theme3D {
+ type: Theme3D.ThemeRetro
+ labelBorderEnabled: true
+ font.pointSize: 35
+ labelBackgroundEnabled: true
+ colorStyle: Theme3D.ColorStyleRangeGradient
+ singleHighlightGradient: customGradient
+
+ ColorGradient {
+ id: customGradient
+ ColorGradientStop { position: 1.0; color: "#FFFF00" }
+ ColorGradientStop { position: 0.0; color: "#808000" }
+ }
+ }
+ barThickness: 0.7
+ barSpacing: Qt.size(0.5, 0.5)
+ barSpacingRelative: false
+ scene.activeCamera.cameraPreset: Camera3D.CameraPresetIsometricLeftHigh
+ columnAxis: graphAxes.column
+ valueAxis: graphAxes.income
+
+ //! [3]
+ Bar3DSeries {
+ id: barSeries
+ itemLabelFormat: "Income for @colLabel, @rowLabel: @valueLabel"
+ baseGradient: barGradient
+
+ ItemModelBarDataProxy {
+ id: modelProxy
+ itemModel: graphData.model
+ rowRole: "year"
+ columnRole: "month"
+ valueRole: "income"
+ }
+ //! [3]
+
+ ColorGradient {
+ id: barGradient
+ ColorGradientStop { position: 1.0; color: "#00FF00" }
+ ColorGradientStop { position: 0.0; color: "#006000" }
+ }
+
+ onSelectedBarChanged: handleSelectionChange(barSeries, position)
+ }
+
+ //! [4]
+ Bar3DSeries {
+ id: secondarySeries
+ visible: false
+ itemLabelFormat: "Expenses for @colLabel, @rowLabel: @valueLabel"
+ baseGradient: secondaryGradient
+
+ ItemModelBarDataProxy {
+ id: secondaryProxy
+ itemModel: graphData.model
+ rowRole: "year"
+ columnRole: "month"
+ valueRole: "expenses"
+ }
+ //! [4]
+
+ ColorGradient {
+ id: secondaryGradient
+ ColorGradientStop { position: 1.0; color: "#FF0000" }
+ ColorGradientStop { position: 0.0; color: "#600000" }
+ }
+
+ onSelectedBarChanged: handleSelectionChange(secondarySeries, position)
+ }
+ }
+ }
+
+ TableView {
+ id: tableView
+ anchors.top: parent.top
+ anchors.left: parent.left
+ TableViewColumn{ role: "year" ; title: "Year" ; width: tableView.width / 4 }
+ TableViewColumn{ role: "month" ; title: "Month" ; width: tableView.width / 4 }
+ TableViewColumn{ role: "expenses" ; title: "Expenses" ; width: tableView.width / 4 }
+ TableViewColumn{ role: "income" ; title: "Income" ; width: tableView.width / 4 }
+ model: graphData.model
+
+ //! [2]
+ onCurrentRowChanged: {
+ var rowIndex = modelProxy.rowCategoryIndex(graphData.model.get(currentRow).year)
+ var colIndex = modelProxy.columnCategoryIndex(graphData.model.get(currentRow).month)
+ if (selectedSeries.visible)
+ mainview.selectedSeries.selectedBar = Qt.point(rowIndex, colIndex)
+ else if (barSeries.visible)
+ barSeries.selectedBar = Qt.point(rowIndex, colIndex)
+ else
+ secondarySeries.selectedBar = Qt.point(rowIndex, colIndex)
+ }
+ //! [2]
+ }
+
+ ColumnLayout {
+ id: controlLayout
+ spacing: 0
+
+ Button {
+ id: dataToggle
+ Layout.fillWidth: true
+ Layout.fillHeight: true
+ text: "Show 2010 - 2012"
+ clip: true
+ //! [1]
+ onClicked: {
+ if (barGraph.rowAxis.max !== 6) {
+ text = "Show 2010 - 2012"
+ modelProxy.autoRowCategories = true
+ secondaryProxy.autoRowCategories = true
+ } else {
+ text = "Show all years"
+ // Explicitly defining row categories, since we do not want to show data for
+ // all years in the model, just for the selected ones.
+ modelProxy.autoRowCategories = false
+ secondaryProxy.autoRowCategories = false
+ modelProxy.rowCategories = ["2010", "2011", "2012"]
+ secondaryProxy.rowCategories = ["2010", "2011", "2012"]
+ }
+ }
+ //! [1]
+ }
+
+ Button {
+ id: shadowToggle
+ Layout.fillWidth: true
+ Layout.fillHeight: true
+ text: "Hide Shadows"
+ clip: true
+ onClicked: {
+ if (barGraph.shadowQuality == AbstractGraph3D.ShadowQualityNone) {
+ barGraph.shadowQuality = AbstractGraph3D.ShadowQualityMedium;
+ text = "Hide Shadows"
+ } else {
+ barGraph.shadowQuality = AbstractGraph3D.ShadowQualityNone;
+ text = "Show Shadows"
+ }
+ }
+ }
+
+ Button {
+ id: seriesToggle
+ Layout.fillWidth: true
+ Layout.fillHeight: true
+ text: "Show Expenses"
+ clip: true
+ //! [0]
+ onClicked: {
+ if (!secondarySeries.visible) {
+ text = "Show Both"
+ barGraph.valueAxis = graphAxes.expenses
+ barSeries.visible = false
+ secondarySeries.visible = true
+ } else if (!barSeries.visible){
+ barSeries.visible = true
+ text = "Show Income"
+ barGraph.valueAxis = graphAxes.income
+ } else {
+ secondarySeries.visible = false
+ text = "Show Expenses"
+ barGraph.valueAxis = graphAxes.income
+ }
+ }
+ //! [0]
+ }
+ }
+
+ states: [
+ State {
+ name: "landscape"
+ PropertyChanges {
+ target: dataView
+ width: mainview.width / 4 * 3
+ height: mainview.height
+ }
+ PropertyChanges {
+ target: tableView
+ height: mainview.height - buttonLayoutHeight
+ anchors.right: dataView.left
+ anchors.left: mainview.left
+ anchors.bottom: undefined
+ }
+ PropertyChanges {
+ target: controlLayout
+ width: mainview.width / 4
+ height: buttonLayoutHeight
+ anchors.top: tableView.bottom
+ anchors.bottom: mainview.bottom
+ anchors.left: mainview.left
+ anchors.right: dataView.left
+ }
+ },
+ State {
+ name: "portrait"
+ PropertyChanges {
+ target: dataView
+ width: mainview.height / 4 * 3
+ height: mainview.width
+ }
+ PropertyChanges {
+ target: tableView
+ height: mainview.width
+ anchors.right: controlLayout.left
+ anchors.left: mainview.left
+ anchors.bottom: dataView.top
+ }
+ PropertyChanges {
+ target: controlLayout
+ width: mainview.height / 4
+ height: mainview.width / 4
+ anchors.top: mainview.top
+ anchors.bottom: dataView.top
+ anchors.left: undefined
+ anchors.right: mainview.right
+ }
+ }
+ ]
+}
diff --git a/examples/datavisualization/qmlbars/qmlbars.desktop b/examples/datavisualization/qmlbars/qmlbars.desktop
new file mode 100644
index 00000000..cf59c6b8
--- /dev/null
+++ b/examples/datavisualization/qmlbars/qmlbars.desktop
@@ -0,0 +1,11 @@
+[Desktop Entry]
+Encoding=UTF-8
+Version=1.0
+Type=Application
+Terminal=false
+Name=qmlbars
+Exec=/opt/qmlbars/bin/qmlbars
+Icon=qmlbars64
+X-Window-Icon=
+X-HildonDesk-ShowInToolbar=true
+X-Osso-Type=application/x-executable
diff --git a/examples/datavisualization/qmlbars/qmlbars.pro b/examples/datavisualization/qmlbars/qmlbars.pro
new file mode 100644
index 00000000..c3d48fd9
--- /dev/null
+++ b/examples/datavisualization/qmlbars/qmlbars.pro
@@ -0,0 +1,20 @@
+!include( ../examples.pri ) {
+ error( "Couldn't find the examples.pri file!" )
+}
+
+# Add more folders to ship with the application, here
+folder_01.source = qml/qmlbars
+folder_01.target = qml
+DEPLOYMENTFOLDERS = folder_01
+
+# Additional import path used to resolve QML modules in Creator's code model
+QML_IMPORT_PATH =
+
+# The .cpp file which was generated for your project. Feel free to hack it.
+SOURCES += main.cpp
+
+# Please do not modify the following two lines. Required for deployment.
+include(qtquick2applicationviewer/qtquick2applicationviewer.pri)
+qtcAddDeployment()
+
+RESOURCES += qmlbars.qrc
diff --git a/examples/datavisualization/qmlbars/qmlbars.qrc b/examples/datavisualization/qmlbars/qmlbars.qrc
new file mode 100644
index 00000000..2240fbef
--- /dev/null
+++ b/examples/datavisualization/qmlbars/qmlbars.qrc
@@ -0,0 +1,7 @@
+<RCC>
+ <qresource prefix="/">
+ <file>qml/qmlbars/Axes.qml</file>
+ <file>qml/qmlbars/Data.qml</file>
+ <file>qml/qmlbars/main.qml</file>
+ </qresource>
+</RCC>
diff --git a/examples/datavisualization/qmlbars/qmlbars64.png b/examples/datavisualization/qmlbars/qmlbars64.png
new file mode 100644
index 00000000..707d5c4e
--- /dev/null
+++ b/examples/datavisualization/qmlbars/qmlbars64.png
Binary files differ
diff --git a/examples/datavisualization/qmlbars/qtquick2applicationviewer/qtquick2applicationviewer.cpp b/examples/datavisualization/qmlbars/qtquick2applicationviewer/qtquick2applicationviewer.cpp
new file mode 100644
index 00000000..10709d7a
--- /dev/null
+++ b/examples/datavisualization/qmlbars/qtquick2applicationviewer/qtquick2applicationviewer.cpp
@@ -0,0 +1,81 @@
+// checksum 0x4f6f version 0x90005
+/*
+ This file was generated by the Qt Quick 2 Application wizard of Qt Creator.
+ QtQuick2ApplicationViewer is a convenience class containing mobile device specific
+ code such as screen orientation handling. Also QML paths and debugging are
+ handled here.
+ It is recommended not to modify this file, since newer versions of Qt Creator
+ may offer an updated version of it.
+*/
+
+#include "qtquick2applicationviewer.h"
+
+#include <QtCore/QCoreApplication>
+#include <QtCore/QDir>
+#include <QtQml/QQmlEngine>
+
+class QtQuick2ApplicationViewerPrivate
+{
+ QString mainQmlFile;
+ friend class QtQuick2ApplicationViewer;
+ static QString adjustPath(const QString &path);
+};
+
+QString QtQuick2ApplicationViewerPrivate::adjustPath(const QString &path)
+{
+#if defined(Q_OS_MAC)
+ if (!QDir::isAbsolutePath(path))
+ return QString::fromLatin1("%1/../Resources/%2")
+ .arg(QCoreApplication::applicationDirPath(), path);
+#elif defined(Q_OS_BLACKBERRY)
+ if (!QDir::isAbsolutePath(path))
+ return QString::fromLatin1("app/native/%1").arg(path);
+#elif !defined(Q_OS_ANDROID)
+ QString pathInInstallDir =
+ QString::fromLatin1("%1/../%2").arg(QCoreApplication::applicationDirPath(), path);
+ if (QFileInfo(pathInInstallDir).exists())
+ return pathInInstallDir;
+ pathInInstallDir =
+ QString::fromLatin1("%1/%2").arg(QCoreApplication::applicationDirPath(), path);
+ if (QFileInfo(pathInInstallDir).exists())
+ return pathInInstallDir;
+#endif
+ return path;
+}
+
+QtQuick2ApplicationViewer::QtQuick2ApplicationViewer(QWindow *parent)
+ : QQuickView(parent)
+ , d(new QtQuick2ApplicationViewerPrivate())
+{
+ connect(engine(), SIGNAL(quit()), SLOT(close()));
+ setResizeMode(QQuickView::SizeRootObjectToView);
+}
+
+QtQuick2ApplicationViewer::~QtQuick2ApplicationViewer()
+{
+ delete d;
+}
+
+void QtQuick2ApplicationViewer::setMainQmlFile(const QString &file)
+{
+ d->mainQmlFile = QtQuick2ApplicationViewerPrivate::adjustPath(file);
+#ifdef Q_OS_ANDROID
+ setSource(QUrl(QLatin1String("assets:/")+d->mainQmlFile));
+#else
+ setSource(QUrl::fromLocalFile(d->mainQmlFile));
+#endif
+}
+
+void QtQuick2ApplicationViewer::addImportPath(const QString &path)
+{
+ engine()->addImportPath(QtQuick2ApplicationViewerPrivate::adjustPath(path));
+}
+
+void QtQuick2ApplicationViewer::showExpanded()
+{
+#if defined(Q_WS_SIMULATOR) || defined(Q_OS_QNX)
+ showFullScreen();
+#else
+ show();
+#endif
+}
diff --git a/examples/datavisualization/qmlbars/qtquick2applicationviewer/qtquick2applicationviewer.h b/examples/datavisualization/qmlbars/qtquick2applicationviewer/qtquick2applicationviewer.h
new file mode 100644
index 00000000..cf66f140
--- /dev/null
+++ b/examples/datavisualization/qmlbars/qtquick2applicationviewer/qtquick2applicationviewer.h
@@ -0,0 +1,33 @@
+// checksum 0xfde6 version 0x90005
+/*
+ This file was generated by the Qt Quick 2 Application wizard of Qt Creator.
+ QtQuick2ApplicationViewer is a convenience class containing mobile device specific
+ code such as screen orientation handling. Also QML paths and debugging are
+ handled here.
+ It is recommended not to modify this file, since newer versions of Qt Creator
+ may offer an updated version of it.
+*/
+
+#ifndef QTQUICK2APPLICATIONVIEWER_H
+#define QTQUICK2APPLICATIONVIEWER_H
+
+#include <QtQuick/QQuickView>
+
+class QtQuick2ApplicationViewer : public QQuickView
+{
+ Q_OBJECT
+
+public:
+ explicit QtQuick2ApplicationViewer(QWindow *parent = 0);
+ virtual ~QtQuick2ApplicationViewer();
+
+ void setMainQmlFile(const QString &file);
+ void addImportPath(const QString &path);
+
+ void showExpanded();
+
+private:
+ class QtQuick2ApplicationViewerPrivate *d;
+};
+
+#endif // QTQUICK2APPLICATIONVIEWER_H
diff --git a/examples/datavisualization/qmlbars/qtquick2applicationviewer/qtquick2applicationviewer.pri b/examples/datavisualization/qmlbars/qtquick2applicationviewer/qtquick2applicationviewer.pri
new file mode 100644
index 00000000..e5f7990f
--- /dev/null
+++ b/examples/datavisualization/qmlbars/qtquick2applicationviewer/qtquick2applicationviewer.pri
@@ -0,0 +1,180 @@
+# checksum 0x7b0d version 0x90005
+# This file was generated by the Qt Quick 2 Application wizard of Qt Creator.
+# The code below adds the QtQuick2ApplicationViewer to the project and handles
+# the activation of QML debugging.
+# It is recommended not to modify this file, since newer versions of Qt Creator
+# may offer an updated version of it.
+
+QT += qml quick
+
+SOURCES += $$PWD/qtquick2applicationviewer.cpp
+HEADERS += $$PWD/qtquick2applicationviewer.h
+INCLUDEPATH += $$PWD
+# This file was generated by an application wizard of Qt Creator.
+# The code below handles deployment to Android and Maemo, aswell as copying
+# of the application data to shadow build directories on desktop.
+# It is recommended not to modify this file, since newer versions of Qt Creator
+# may offer an updated version of it.
+
+defineTest(qtcAddDeployment) {
+for(deploymentfolder, DEPLOYMENTFOLDERS) {
+ item = item$${deploymentfolder}
+ greaterThan(QT_MAJOR_VERSION, 4) {
+ itemsources = $${item}.files
+ } else {
+ itemsources = $${item}.sources
+ }
+ $$itemsources = $$eval($${deploymentfolder}.source)
+ itempath = $${item}.path
+ $$itempath= $$eval($${deploymentfolder}.target)
+ export($$itemsources)
+ export($$itempath)
+ DEPLOYMENT += $$item
+}
+
+MAINPROFILEPWD = $$PWD
+
+android-no-sdk {
+ for(deploymentfolder, DEPLOYMENTFOLDERS) {
+ item = item$${deploymentfolder}
+ itemfiles = $${item}.files
+ $$itemfiles = $$eval($${deploymentfolder}.source)
+ itempath = $${item}.path
+ $$itempath = /data/user/qt/$$eval($${deploymentfolder}.target)
+ export($$itemfiles)
+ export($$itempath)
+ INSTALLS += $$item
+ }
+
+ target.path = /data/user/qt
+
+ export(target.path)
+ INSTALLS += target
+} else:android {
+ for(deploymentfolder, DEPLOYMENTFOLDERS) {
+ item = item$${deploymentfolder}
+ itemfiles = $${item}.files
+ $$itemfiles = $$eval($${deploymentfolder}.source)
+ itempath = $${item}.path
+ $$itempath = /assets/$$eval($${deploymentfolder}.target)
+ export($$itemfiles)
+ export($$itempath)
+ INSTALLS += $$item
+ }
+
+ x86 {
+ target.path = /libs/x86
+ } else: armeabi-v7a {
+ target.path = /libs/armeabi-v7a
+ } else {
+ target.path = /libs/armeabi
+ }
+
+ export(target.path)
+ INSTALLS += target
+} else:win32 {
+ copyCommand =
+ for(deploymentfolder, DEPLOYMENTFOLDERS) {
+ source = $$MAINPROFILEPWD/$$eval($${deploymentfolder}.source)
+ source = $$replace(source, /, \\)
+ sourcePathSegments = $$split(source, \\)
+ target = $$OUT_PWD/$$eval($${deploymentfolder}.target)/$$last(sourcePathSegments)
+ target = $$replace(target, /, \\)
+ target ~= s,\\\\\\.?\\\\,\\,
+ !isEqual(source,$$target) {
+ !isEmpty(copyCommand):copyCommand += &&
+ isEqual(QMAKE_DIR_SEP, \\) {
+ copyCommand += $(COPY_DIR) \"$$source\" \"$$target\"
+ } else {
+ source = $$replace(source, \\\\, /)
+ target = $$OUT_PWD/$$eval($${deploymentfolder}.target)
+ target = $$replace(target, \\\\, /)
+ copyCommand += test -d \"$$target\" || mkdir -p \"$$target\" && cp -r \"$$source\" \"$$target\"
+ }
+ }
+ }
+ !isEmpty(copyCommand) {
+ copyCommand = @echo Copying application data... && $$copyCommand
+ copydeploymentfolders.commands = $$copyCommand
+ first.depends = $(first) copydeploymentfolders
+ export(first.depends)
+ export(copydeploymentfolders.commands)
+ QMAKE_EXTRA_TARGETS += first copydeploymentfolders
+ }
+} else:unix {
+ maemo5 {
+ desktopfile.files = $${TARGET}.desktop
+ desktopfile.path = /usr/share/applications/hildon
+ icon.files = $${TARGET}64.png
+ icon.path = /usr/share/icons/hicolor/64x64/apps
+ } else:!isEmpty(MEEGO_VERSION_MAJOR) {
+ desktopfile.files = $${TARGET}_harmattan.desktop
+ desktopfile.path = /usr/share/applications
+ icon.files = $${TARGET}80.png
+ icon.path = /usr/share/icons/hicolor/80x80/apps
+ } else { # Assumed to be a Desktop Unix
+ copyCommand =
+ for(deploymentfolder, DEPLOYMENTFOLDERS) {
+ source = $$MAINPROFILEPWD/$$eval($${deploymentfolder}.source)
+ source = $$replace(source, \\\\, /)
+ macx {
+ target = $$OUT_PWD/$${TARGET}.app/Contents/Resources/$$eval($${deploymentfolder}.target)
+ } else {
+ target = $$OUT_PWD/$$eval($${deploymentfolder}.target)
+ }
+ target = $$replace(target, \\\\, /)
+ sourcePathSegments = $$split(source, /)
+ targetFullPath = $$target/$$last(sourcePathSegments)
+ targetFullPath ~= s,/\\.?/,/,
+ !isEqual(source,$$targetFullPath) {
+ !isEmpty(copyCommand):copyCommand += &&
+ copyCommand += $(MKDIR) \"$$target\"
+ copyCommand += && $(COPY_DIR) \"$$source\" \"$$target\"
+ }
+ }
+ !isEmpty(copyCommand) {
+ copyCommand = @echo Copying application data... && $$copyCommand
+ copydeploymentfolders.commands = $$copyCommand
+ first.depends = $(first) copydeploymentfolders
+ export(first.depends)
+ export(copydeploymentfolders.commands)
+ QMAKE_EXTRA_TARGETS += first copydeploymentfolders
+ }
+ }
+ !isEmpty(target.path) {
+ installPrefix = $${target.path}
+ } else {
+ installPrefix = /opt/$${TARGET}
+ }
+ for(deploymentfolder, DEPLOYMENTFOLDERS) {
+ item = item$${deploymentfolder}
+ itemfiles = $${item}.files
+ $$itemfiles = $$eval($${deploymentfolder}.source)
+ itempath = $${item}.path
+ $$itempath = $${installPrefix}/$$eval($${deploymentfolder}.target)
+ export($$itemfiles)
+ export($$itempath)
+ INSTALLS += $$item
+ }
+
+ !isEmpty(desktopfile.path) {
+ export(icon.files)
+ export(icon.path)
+ export(desktopfile.files)
+ export(desktopfile.path)
+ INSTALLS += icon desktopfile
+ }
+
+ isEmpty(target.path) {
+ target.path = $${installPrefix}/bin
+ export(target.path)
+ }
+ INSTALLS += target
+}
+
+export (ICON)
+export (INSTALLS)
+export (DEPLOYMENT)
+export (LIBS)
+export (QMAKE_EXTRA_TARGETS)
+}