Add graph animation; support for line graphs
[harbour-pedalo.git] / qml / pages / Stats.qml
index 8e13f97..235ca1c 100644 (file)
@@ -8,6 +8,7 @@ Page {
 
     // The effective value will be restricted by ApplicationWindow.allowedOrientations
     allowedOrientations: Orientation.All
+    property int showingindex: 0
 
     SilicaFlickable {
         id: statsView
@@ -89,10 +90,10 @@ Page {
             }
 
             model: statsmodel
-            delegate: Rectangle {
+            delegate: Item {
+                id: delegateItem
                 width: graphsView.itemWidth
                 height: graphsView.height
-                color: "transparent"
 
                 SectionHeader {
                     id: sectionHeaderItem
@@ -105,66 +106,29 @@ Page {
                     anchors.top: sectionHeaderItem.bottom
                     height: (isPortrait ? (statsPage.height / 2.0) - Theme.paddingLarge : statsPage.height - Theme.paddingLarge - headerItem.height) - sectionHeaderItem.height
                     anchors.left: parent.left
-                    model: values
+                    bardata: barvalues
+                    //linedata: barvalues
                     labelsx: labels
                     //labelsy: ["0%", "10%", "20%", "30%", "40%", "50%", "60%", "70%", "80%", "90%", "100%"]
                     unitsy: units
                     primary: Theme.primaryColor
                     secondary: Theme.highlightColor
-                    highlight: Theme.highlightColor
+                    highlight: Theme.secondaryColor
                     miny: minval
                     maxy: maxval
                     stepy: step
                     gap: 0.1
                     fontsize: Theme.fontSizeExtraSmall
-                    /*
-                    PropertyAnimation on animate {
-                        id: animx
-                        duration: 2000
-                        easing.type: Easing.InOutExpo
-                        from: 0.0
-                        to: 1.0
-                    }
-                    */
-                }
-
-            }
-        }
+                    animate: (graphsView.currentItem === delegateItem) ? 1.0 : 0.0
 
-        /*
-        Column {
-            id: graphsColumn
-            spacing: Theme.paddingLarge
-            width: isPortrait ? parent.width : parent.width * 0.5
-            y: (isPortrait ? (statsPage.height / 2.0) : statsColumn.y)
-            anchors.left: isPortrait ? statsColumn.left : statsColumn.right
-            anchors.leftMargin: Theme.horizontalPageMargin
-
-
-            Graph {
-                id: graph
-                width: parent.width - 2 * Theme.horizontalPageMargin
-                height: isPortrait ? (statsPage.height / 2.0) - Theme.paddingLarge : statsPage.height - Theme.paddingLarge - headerItem.height
-                model: currentStatus.getGraphData()
-                labelsx: ["M", "T", "W", "Th", "F", "S", "Su", "A", "B", "C"]
-                //labelsy: ["0%", "10%", "20%", "30%", "40%", "50%", "60%", "70%", "80%", "90%", "100%"]
-                unitsy: "%"
-                primary: Theme.primaryColor
-                secondary: Theme.highlightColor
-                highlight: Theme.highlightColor
-                miny: 0.0
-                maxy: 1.0
-                stepy: 0.1
-                gap: 0.1
-                fontsize: Theme.fontSizeExtraSmall
-                PropertyAnimation on animate {
-                    duration: 2000
-                    easing.type: Easing.InOutExpo
-                    from: 0.0
-                    to: 1.0
+                    Behavior on animate {
+                        NumberAnimation {
+                            easing.type: Easing.OutExpo
+                            duration: 2000
+                        }
+                    }
                 }
             }
         }
-        */
     }
 }