iot-sensortag: Add Accelometer chart

Added new accelometer chart. Updated the ui-layout and images.

Change-Id: Id8474e533f39f5c8178b487fc9bc03d7ea956772
Reviewed-by: Otto Ryynänen <otto.ryynanen@qt.io>

10 files changed, 140 insertions, 11 deletions

diff --git a/tradeshow/iot-sensortag/resources/base/AccelChart.qml b/tradeshow/iot-sensortag/resources/base/AccelChart.qml
new file mode 100644
index 0000000..6b7d240
--- /dev/null
+++ b/tradeshow/iot-sensortag/resources/base/AccelChart.qml
@@ -0,0 +1,120 @@
+/****************************************************************************
+**
+** Copyright (C) 2017 The Qt Company Ltd.
+** Contact: https://www.qt.io/licensing/
+**
+** This file is part of the examples of Qt for Device Creation.
+**
+** $QT_BEGIN_LICENSE:BSD$
+** Commercial License Usage
+** Licensees holding valid commercial Qt licenses may use this file in
+** accordance with the commercial license agreement provided with the
+** Software or, alternatively, in accordance with the terms contained in
+** a written agreement between you and The Qt Company. For licensing terms
+** and conditions see https://www.qt.io/terms-conditions. For further
+** information use the contact form at https://www.qt.io/contact-us.
+**
+** BSD License Usage
+** Alternatively, you may use this file under the terms of the BSD license
+** as follows:
+**
+** "Redistribution and use in source and binary forms, with or without
+** modification, are permitted provided that the following conditions are
+** met:
+**   * Redistributions of source code must retain the above copyright
+**     notice, this list of conditions and the following disclaimer.
+**   * Redistributions in binary form must reproduce the above copyright
+**     notice, this list of conditions and the following disclaimer in
+**     the documentation and/or other materials provided with the
+**     distribution.
+**   * Neither the name of The Qt Company Ltd nor the names of its
+**     contributors may be used to endorse or promote products derived
+**     from this software without specific prior written permission.
+**
+**
+** THIS SOFTWARE IS PROVIDED BY THE COPYRIGHT HOLDERS AND CONTRIBUTORS
+** "AS IS" AND ANY EXPRESS OR IMPLIED WARRANTIES, INCLUDING, BUT NOT
+** LIMITED TO, THE IMPLIED WARRANTIES OF MERCHANTABILITY AND FITNESS FOR
+** A PARTICULAR PURPOSE ARE DISCLAIMED. IN NO EVENT SHALL THE COPYRIGHT
+** OWNER OR CONTRIBUTORS BE LIABLE FOR ANY DIRECT, INDIRECT, INCIDENTAL,
+** SPECIAL, EXEMPLARY, OR CONSEQUENTIAL DAMAGES (INCLUDING, BUT NOT
+** LIMITED TO, PROCUREMENT OF SUBSTITUTE GOODS OR SERVICES; LOSS OF USE,
+** DATA, OR PROFITS; OR BUSINESS INTERRUPTION) HOWEVER CAUSED AND ON ANY
+** THEORY OF LIABILITY, WHETHER IN CONTRACT, STRICT LIABILITY, OR TORT
+** (INCLUDING NEGLIGENCE OR OTHERWISE) ARISING IN ANY WAY OUT OF THE USE
+** OF THIS SOFTWARE, EVEN IF ADVISED OF THE POSSIBILITY OF SUCH DAMAGE."
+**
+** $QT_END_LICENSE$
+**
+****************************************************************************/
+import QtQuick 2.5
+import SensorTag.DataProvider 1.0
+
+BaseChart {
+
+    property real acceXValue
+    property real acceYValue
+    property real acceZValue
+
+    antialiasing: true
+    title: qsTr("Accelometer")
+    rightSide: true
+
+    onSensorChanged: if (sensor) {
+        sensor.accelometerGChanged.connect(contentItem.updateAcceValues)
+    }
+
+    content: Item {
+        anchors.fill: parent
+
+        function updateAcceValues() {
+            acceXValue = sensor.accelometer_mG_xAxis.toFixed(1)
+            acceYValue = sensor.accelometer_mG_yAxis.toFixed(1)
+            acceZValue = sensor.accelometer_mG_zAxis.toFixed(1)
+        }
+
+        Row {
+            id: itemRow
+            anchors.fill: parent
+
+            Repeater {
+
+                model: 3
+
+                Item {
+                    height: itemRow.height
+                    width: itemRow.width / 3
+                    Image {
+                        id: accelometerOuter
+
+                        source: pathPrefix + "Accelometer/outer_ring.png"
+                        anchors.centerIn: parent
+
+                        Image {
+                            source: pathPrefix + "Accelometer/inner_ring.png"
+                            anchors.centerIn: parent
+                        }
+
+                        Text {
+                            id: accelMainText
+                            anchors.horizontalCenter: parent.horizontalCenter
+                            anchors.bottom: parent.verticalCenter
+                            anchors.bottomMargin: -12
+                            text: (index == 0) ? acceXValue : ((index == 1) ? acceYValue : acceZValue)
+                            color: "white"
+                        }
+                    }
+
+                    Text {
+                        anchors.horizontalCenter: accelometerOuter.horizontalCenter
+                        anchors.top: accelometerOuter.bottom
+                        anchors.topMargin: -18
+                        text: (index == 0) ? "X" : ((index == 1) ? "Y" : "Z")
+                        color: "white"
+                        font.pixelSize: 20
+                    }
+                }
+            }
+        }
+    }
+}
diff --git a/tradeshow/iot-sensortag/resources/base/GyroChart.qml b/tradeshow/iot-sensortag/resources/base/GyroChart.qml
index 91f1911..1852641 100644
--- a/tradeshow/iot-sensortag/resources/base/GyroChart.qml
+++ b/tradeshow/iot-sensortag/resources/base/GyroChart.qml
@@ -97,7 +97,7 @@ BaseChart {
 
             anchors.top: parent.top
             anchors.bottom: parent.bottom
-            anchors.bottomMargin: 33
+            anchors.bottomMargin: 25
             anchors.left: parent.left
             anchors.leftMargin: -20
             anchors.right: parent.right
@@ -161,7 +161,7 @@ BaseChart {
         Row {
             id: xLabelRow
             anchors.bottom: parent.bottom
-            anchors.bottomMargin: 28
+            anchors.bottomMargin: 4
             anchors.left: parent.left
             anchors.leftMargin: chartView.plotArea.x - 40
             anchors.right: parent.right
diff --git a/tradeshow/iot-sensortag/resources/base/HumidityChart.qml b/tradeshow/iot-sensortag/resources/base/HumidityChart.qml
index 0a74a68..fdffc5a 100644
--- a/tradeshow/iot-sensortag/resources/base/HumidityChart.qml
+++ b/tradeshow/iot-sensortag/resources/base/HumidityChart.qml
@@ -95,7 +95,10 @@ BaseChart {
             source: pathPrefix + "Humidity/humidity_base_gauge.png"
             anchors.left: parent.left
             anchors.leftMargin: 8
+            anchors.top: parent.top
+            anchors.topMargin: 8
             anchors.bottom: parent.bottom
+            width: height
 
             Text {
                 id: humidityMainText
@@ -108,7 +111,7 @@ BaseChart {
         Image {
             source: pathPrefix + "Humidity/humidity_min_hum.png"
             anchors.left: humidityMainImg.right
-            anchors.leftMargin: -11
+            anchors.leftMargin: -7
             anchors.bottom: humidityMainImg.bottom
 
             Text {
@@ -134,8 +137,8 @@ BaseChart {
         Image {
             source: pathPrefix + "Humidity/humidity_max_hum.png"
             anchors.left: humidityMainImg.right
-            anchors.leftMargin: -22
-            anchors.top: humidityMainImg.top
+            anchors.leftMargin: -18
+            anchors.top: parent.top
 
             Text {
                 anchors.top: parent.top
diff --git a/tradeshow/iot-sensortag/resources/base/MagnetometerChart.qml b/tradeshow/iot-sensortag/resources/base/MagnetometerChart.qml
index bd60dc6..699f537 100644
--- a/tradeshow/iot-sensortag/resources/base/MagnetometerChart.qml
+++ b/tradeshow/iot-sensortag/resources/base/MagnetometerChart.qml
@@ -161,7 +161,6 @@ BaseChart {
             horizontalAlignment: Text.AlignHCenter
             text: "<font color=\"" + xColor + "\">X<br><font color=\"white\">" + (sensor ? sensor.magnetometerMicroT_xAxis : 0)
             lineHeight: 0.7
-            width: (magnetHolderRect.width - xLabelRow.x) / 3
         }
 
         Text {
@@ -172,7 +171,6 @@ BaseChart {
             horizontalAlignment: Text.AlignHCenter
             text: "<font color=\"" + yColor + "\">Y<br><font color=\"white\">" + (sensor ? sensor.magnetometerMicroT_yAxis : 0)
             lineHeight: 0.7
-            width: xLabel.width
         }
 
         Text {
@@ -183,7 +181,6 @@ BaseChart {
             horizontalAlignment: Text.AlignHCenter
             text: "<font color=\"" + zColor + "\">Z<br><font color=\"white\">" + (sensor ? sensor.magnetometerMicroT_zAxis : 0)
             lineHeight: 0.7
-            width: xLabel.width
         }
     }
 }
diff --git a/tradeshow/iot-sensortag/resources/base/TopToolbar.qml b/tradeshow/iot-sensortag/resources/base/TopToolbar.qml
index f3e7e2b..36117b3 100644
--- a/tradeshow/iot-sensortag/resources/base/TopToolbar.qml
+++ b/tradeshow/iot-sensortag/resources/base/TopToolbar.qml
@@ -191,6 +191,7 @@ Item {
 
     Image {
         anchors.bottom: parent.bottom
+        anchors.bottomMargin: -18
         source: pathPrefix + "Toolbar/topbar_all.png"
     }
 }
diff --git a/tradeshow/iot-sensortag/resources/small/MainSmall.qml b/tradeshow/iot-sensortag/resources/small/MainSmall.qml
index 4044b32..1f46093 100644
--- a/tradeshow/iot-sensortag/resources/small/MainSmall.qml
+++ b/tradeshow/iot-sensortag/resources/small/MainSmall.qml
@@ -70,6 +70,7 @@ Item {
             light.sensor = dataProviderPool.getProvider(SensorTagData.Light);
             magnetometer.sensor = dataProviderPool.getProvider(SensorTagData.Magnetometer);
             rotation.sensor = dataProviderPool.getProvider(SensorTagData.Rotation);
+            accelometer.sensor = dataProviderPool.getProvider(SensorTagData.Accelometer);
         }
     }
 
@@ -136,21 +137,21 @@ Item {
             id: light
 
             width: rightPane.width
-            height: leftPane.height / 4
+            height: rightPane.height / 4
         }
 
         MagnetometerChart {
             id: magnetometer
 
             width: rightPane.width
-            height: leftPane.height * 0.3
+            height: rightPane.height * 0.3 - 30
         }
 
         GyroChart {
             id: rotation
 
             width: rightPane.width
-            height: leftPane.height * 0.3
+            height: rightPane.height * 0.3 - 60
             onClicked: {
                 //mainContainer.source = "../base/GyroPage.qml";
                 gyroConnection.enabled = true;
@@ -169,6 +170,13 @@ Item {
                 }
             }
         }
+
+        AccelChart {
+            id: accelometer
+
+            width: rightPane.width
+            height: rightPane.height - light.height - magnetometer.height - rotation.height - 3 * rightPane.spacing
+        }
     }
 
     Loader {
diff --git a/tradeshow/iot-sensortag/resources/small/images/Accelometer/inner_ring.png b/tradeshow/iot-sensortag/resources/small/images/Accelometer/inner_ring.png
new file mode 100644
index 0000000..aeaa36a
--- /dev/null
+++ b/tradeshow/iot-sensortag/resources/small/images/Accelometer/inner_ring.png
diff --git a/tradeshow/iot-sensortag/resources/small/images/Accelometer/outer_ring.png b/tradeshow/iot-sensortag/resources/small/images/Accelometer/outer_ring.png
new file mode 100644
index 0000000..80cd670
--- /dev/null
+++ b/tradeshow/iot-sensortag/resources/small/images/Accelometer/outer_ring.png
diff --git a/tradeshow/iot-sensortag/resources/small/images/General/icon_sensor.png b/tradeshow/iot-sensortag/resources/small/images/General/icon_sensor.png
index e7aed60..a1286e8 100644
--- a/tradeshow/iot-sensortag/resources/small/images/General/icon_sensor.png
+++ b/tradeshow/iot-sensortag/resources/small/images/General/icon_sensor.png
diff --git a/tradeshow/iot-sensortag/resources/small/images/Toolbar/topbar_all.png b/tradeshow/iot-sensortag/resources/small/images/Toolbar/topbar_all.png
index 85d85dc..992318b 100644
--- a/tradeshow/iot-sensortag/resources/small/images/Toolbar/topbar_all.png
+++ b/tradeshow/iot-sensortag/resources/small/images/Toolbar/topbar_all.png