diff options
| -rw-r--r-- | src/graphs/BarGraph.qml | 98 | ||||
| -rw-r--r-- | src/main.qml | 102 | ||||
| -rw-r--r-- | src/resources.qrc | 1 |
3 files changed, 112 insertions, 89 deletions
diff --git a/src/graphs/BarGraph.qml b/src/graphs/BarGraph.qml new file mode 100644 index 0000000..f5de55f --- /dev/null +++ b/src/graphs/BarGraph.qml @@ -0,0 +1,98 @@ +/* + * Copyright (C) 2023 Arseniy Movshev <dodoradio@outlook.com> + * 2019 Florent Revest <revestflo@gmail.com> + * + * This program is free software: you can redistribute it and/or modify + * it under the terms of the GNU General Public License as published by + * the Free Software Foundation, either version 3 of the License, or + * (at your option) any later version. + * + * This program is distributed in the hope that it will be useful, + * but WITHOUT ANY WARRANTY; without even the implied warranty of + * MERCHANTABILITY or FITNESS FOR A PARTICULAR PURPOSE. See the + * GNU General Public License for more details. + * + * You should have received a copy of the GNU General Public License + * along with this program. If not, see <http://www.gnu.org/licenses/>. + */ + +import QtQuick 2.15 +import org.asteroid.controls 1.0 + +Item { + id: barGraph + anchors.horizontalCenter: parent.horizontalCenter + property var valuesArr: [] + property var labelsArr: [] + property var maxValue: 0 + property var divisionsInterval: 0 + property var divisionsCount: 0 + function dataLoadingDone() { + barsRepeater.model = valuesArr.length + labelsRepeater.model = labelsArr.length + } + Item { // labels column + id: markerParent + width: parent.width/8 + height: parent.height + anchors { + left: parent.left + top: barsRow.top + bottom: barsRow.bottom + } + Repeater { + model: barGraph.divisionsCount + delegate: Label { + anchors.left: parent.left + text: barGraph.divisionsInterval*index + font.pixelSize: Dims.w(5) + y: parent.height - parent.height*barGraph.divisionsInterval*index/barGraph.maxValue - height/2 + verticalAlignment: Text.AlignVCenter + } + } + } + Row { // bars + id: barsRow + anchors { + horizontalCenter: parent.horizontalCenter + top: parent.top + bottom: labelsRow.top + } + Repeater { + id: barsRepeater + delegate: Item { //this contains the graph column and positions it correctly + width: barGraph.width/8 + height: parent.height + Rectangle { + id: bar + anchors.bottom: parent.bottom + anchors.horizontalCenter: parent.horizontalCenter + width: parent.width*2/3 + radius: width/2 + property int value: barGraph.valuesArr[index] + height: (value/barGraph.maxValue)*parent.height + } + } + } + } + Row { //labels row + id: labelsRow + height: Dims.w(5) + anchors { + bottom: parent.bottom + left: barsRow.left + right: barsRow.right + } + Repeater { + id: labelsRepeater + delegate: Label { + width: barGraph.width/8 + id: dowLabel + // anchors.horizontalCenter: parent.horizontalCenter + horizontalAlignment: Text.AlignHCenter + text: barGraph.labelsArr[index] + font.pixelSize: Dims.w(5) + } + } + } +} diff --git a/src/main.qml b/src/main.qml index cfec0c7..e2e4876 100644 --- a/src/main.qml +++ b/src/main.qml @@ -21,6 +21,8 @@ import org.asteroid.controls 1.0 import org.asteroid.sensorlogd 1.0 +import "graphs" + Application { id: app @@ -60,16 +62,19 @@ Application { } Item { width: parent.width; height: parent.width*0.1} + Label { + anchors { + left: parent.left + margins: app.width*0.1 + } + text: "Steps" + } - Column { //this is the graph of steps for the past week + BarGraph { id: stepsGraph - width: parent.width*0.9 anchors.horizontalCenter: parent.horizontalCenter - property var valuesArr: [] - property var labelsArr: [] - property var maxValue: 0 - property var divisionsInterval: 0 - property var divisionsCount: 0 + width: parent.width*0.9 + height: app.height*2/3 StepsDataLoader { id: stepsDataLoader Component.onCompleted: { @@ -100,88 +105,7 @@ Application { maxValue = divisionsInterval*Math.floor(maxValue/divisionsInterval) + (divisionsInterval/5)*Math.ceil((maxValue%divisionsInterval)/(divisionsInterval/5)) divisionsCount = Math.floor(maxValue/divisionsInterval) + 1 console.log(maxValue,divisionsInterval,divisionsCount) - // now update the repeater so it reloads the data. for some reason a normal qml binding doesn't do it here. - barsRepeater.model = valuesArr.length - labelsRepeater.model = valuesArr.length - } - Label { - anchors { - left: parent.left - margins: app.width*0.1 - } - text: "Steps" - } - Item { - height: app.height/2 - anchors { - margins: app.width*0.05 - left: parent.left - right: parent.right - } - Item { - id: markerParent - width: parent.width/8 - height: parent.height - anchors { - left: parent.left - top: barsRow.top - bottom: barsRow.bottom - } - Repeater { - model: stepsGraph.divisionsCount - delegate: Label { - anchors.right: parent.right - text: stepsGraph.divisionsInterval*index - font.pixelSize: Dims.w(5) - y: parent.height - parent.height*stepsGraph.divisionsInterval*index/stepsGraph.maxValue - height/2 - verticalAlignment: Text.AlignVCenter - } - } - } - Row { - id: barsRow - anchors { - horizontalCenter: parent.horizontalCenter - top: parent.top - bottom: labelsRow.top - } - Repeater { - id: barsRepeater - delegate: Item { //this contains the graph column and positions it correctly - width: stepsGraph.width/8 - height: parent.height - Rectangle { - id: bar - anchors.bottom: parent.bottom - anchors.horizontalCenter: parent.horizontalCenter - width: parent.width*2/3 - radius: width/2 - property int value: stepsGraph.valuesArr[index] - height: (value/stepsGraph.maxValue)*parent.height - } - } - } - } - Row { - id: labelsRow - height: Dims.w(5) - anchors { - bottom: parent.bottom - left: barsRow.left - right: barsRow.right - } - Repeater { - id: labelsRepeater - delegate: Label { - width: stepsGraph.width/8 - id: dowLabel - // anchors.horizontalCenter: parent.horizontalCenter - horizontalAlignment: Text.AlignHCenter - text: stepsGraph.labelsArr[index] - font.pixelSize: Dims.w(5) - } - } - } + dataLoadingDone() } } diff --git a/src/resources.qrc b/src/resources.qrc index 4e26cb8..eb135ca 100644 --- a/src/resources.qrc +++ b/src/resources.qrc @@ -2,5 +2,6 @@ <qresource prefix="/"> <file>main.qml</file> <file>SettingsPage.qml</file> + <file>graphs/BarGraph.qml</file> </qresource> </RCC> |