From 2a960893d0bb0a0bbfb73c3d50ef66a8bfb5832f Mon Sep 17 00:00:00 2001
From: Yury Shuvakin <shuvakin94@yandex.ru>
Date: Fri, 26 Aug 2022 13:45:04 +0300
Subject: [PATCH] Added horizontal legend for a small number of series on the
 chart

---
 qml/Screens/VisualizationScreen.qml | 28 ++++++++++++++++++++++++----
 1 file changed, 24 insertions(+), 4 deletions(-)

diff --git a/qml/Screens/VisualizationScreen.qml b/qml/Screens/VisualizationScreen.qml
index c0cd463..7ae44d9 100644
--- a/qml/Screens/VisualizationScreen.qml
+++ b/qml/Screens/VisualizationScreen.qml
@@ -71,11 +71,12 @@ ColumnLayout {
                     id: legendDelegate
 
                     RowLayout {
-                        width: ListView.view.width
+                        width: ListView.view ? ListView.view.width : 200
                         height: 60
 
                         property Controls.ChartView chartItem: undefined
                         property color seriesColor: "black"
+                        property bool horizontal: true
 
                         Controls.CheckBox {
                             id: checkSeries
@@ -87,7 +88,7 @@ ColumnLayout {
                                     chartItem.series(modelData).color = "transparent"
                                 }
                             }
-                            Layout.fillWidth: true
+                            Layout.fillWidth: !horizontal
                         }
 
                         Rectangle {
@@ -99,7 +100,8 @@ ColumnLayout {
                         }
 
                         Component.onCompleted: {
-                            chartItem = ListView.view.chartItem
+                            chartItem = ListView.view ? ListView.view.chartItem : parent.chartItem
+                            horizontal = !ListView.view
                             seriesColor = chartItem.series(modelData).color
                             checkSeries.text = chartItem.series(modelData).name
                         }
@@ -114,6 +116,7 @@ ColumnLayout {
                         property string yLabel: ""
                         property Controls.ChartView chart: chartView
                         property int seriesCount: 0
+                        property bool horizontalLegend: true
 
                         ColumnLayout {
                             spacing: -20
@@ -140,6 +143,21 @@ ColumnLayout {
                                 Layout.bottomMargin: 10
                             }
 
+                            RowLayout {
+                                visible: horizontalLegend
+                                spacing: 20
+
+                                property Controls.ChartView chartItem: chart
+
+                                Repeater {
+                                    model: seriesCount
+                                    delegate: legendDelegate
+                                }
+
+                                Layout.topMargin: 20
+                                Layout.leftMargin: 20
+                            }
+
                             Layout.fillWidth: true
                             Layout.fillHeight: true
                         }
@@ -148,10 +166,11 @@ ColumnLayout {
                             clip: true
                             model: seriesCount
                             delegate: legendDelegate
+                            visible: !horizontalLegend
 
                             property Controls.ChartView chartItem: chart
 
-                            Layout.preferredWidth: 300
+                            Layout.preferredWidth: 180
                             Layout.fillHeight: true
                         }
                     }
@@ -232,6 +251,7 @@ ColumnLayout {
                     Component.onCompleted: {
                         item.xLabel = Qt.binding(function() { return qsTr("Time, s") })
                         item.yLabel = Qt.binding(function() { return qsTr("Voltage, V") })
+                        item.horizontalLegend = false
                     }
                 }