State: Resize combo boxes to fit the values

Most strings were clipped, due to shortcomings in the Qt default
ComboBox.

4 files changed, 86 insertions, 13 deletions

diff --git a/retrace/daemon/ui/glframe_state_model.cpp b/retrace/daemon/ui/glframe_state_model.cpp
index 4a3edc7a..6eb943e8 100644
--- a/retrace/daemon/ui/glframe_state_model.cpp
+++ b/retrace/daemon/ui/glframe_state_model.cpp
@@ -45,12 +45,23 @@ QStateValue::QStateValue(const std::string &_name,
 
 void
 QStateValue::insert(int index, const std::string &value) {
+  int value_index = 0;
+  QVariant qvalue(value.c_str());
+  for (auto c : m_choices) {
+    if (qvalue == c) {
+      break;
+    ++value_index;
+    }
+  }
+  // value must be found
+  assert(value_index < m_choices.size());
+
   while (m_values.size() < index)
-    m_values.append("");
+    m_values.append(0);
   if (m_values.size() == index)
-    m_values.append(value.c_str());
+    m_values.append(value_index);
   else
-    m_values[index] = QVariant(value.c_str());
+    m_values[index] = value_index;
 }
 
 QStateModel::QStateModel() {}
diff --git a/retrace/daemon/ui/qml/ComboBoxFitContents.qml b/retrace/daemon/ui/qml/ComboBoxFitContents.qml
new file mode 100644
index 00000000..e34eb6b4
--- /dev/null
+++ b/retrace/daemon/ui/qml/ComboBoxFitContents.qml
@@ -0,0 +1,34 @@
+import QtQuick 2.7
+import QtQuick.Controls 2.2
+
+// based on
+// https://stackoverflow.com/questions/45029968/how-do-i-set-the-combobox-width-to-fit-the-largest-item
+
+ComboBox {
+    id: control
+
+    property int modelWidth
+    width: modelWidth + 2*leftPadding + 2*rightPadding
+
+    delegate: ItemDelegate {
+        width:control.width
+        text: modelData
+        highlighted: control.highlightedIndex === index
+        hoverEnabled: control.hoverEnabled
+        font.weight: control.currentIndex === index ? Font.DemiBold : Font.Normal
+        font.family: control.font.family
+        font.pointSize: control.font.pointSize
+    }
+
+    TextMetrics {
+        id: textMetrics
+    }
+
+    onModelChanged: {
+        textMetrics.font = control.font
+        for(var i = 0; i < model.length; i++){
+            textMetrics.text = model[i]
+            modelWidth = Math.max(textMetrics.width, modelWidth)
+        }
+    }
+}
diff --git a/retrace/daemon/ui/qml/StateControl.qml b/retrace/daemon/ui/qml/StateControl.qml
index 7b182d39..b31089d0 100644
--- a/retrace/daemon/ui/qml/StateControl.qml
+++ b/retrace/daemon/ui/qml/StateControl.qml
@@ -5,6 +5,36 @@ import ApiTrace 1.0
 
 Item {
     property QStateModel stateModel
+    function getWidth(choices) {
+        console.warn("getWidth called: " + choices.length.toString());
+        var len = 0;
+        for (var i = 0; i < choices.length; i++) {
+            console.warn("getWidth: " + choices[i]);
+            var choice_len = choices[i].length;
+            if (choice_len > len) {
+                len = choice_len;
+            }
+        }
+        console.warn("getWidth returned: " + len.toString());
+        return len;
+    }
+
+    function getLongest(choices) {
+        console.warn("getLongest called: " + choices.length.toString());
+        var len = 0;
+        var longest = 0;
+        for (var i = 0; i < choices.length; i++) {
+            console.warn("getLongest: " + choices[i]);
+            var choice_len = choices[i].length;
+            if (choice_len > len) {
+                len = choice_len;
+                longest = i;
+            }
+        }
+        console.warn("getLongest returned: " + choices[longest]);
+        return choices[longest];
+    }
+
     ScrollView {
         anchors.fill: parent
         ListView {
@@ -21,18 +51,15 @@ Item {
                         id: stateGrid
                         anchors.left: parent.left
                         anchors.right: parent.right
+                        // property var choice_width: getWidth(modelData.choices)
                         Repeater {
                             model: modelData.values
-                            Rectangle {
-                                width: stateText.width
-                                height: stateText.height
-                                anchors.margins:10
-                                border.width: 1
-                                Text {
-                                    id: stateText
-                                    anchors.centerIn: parent
-                                    text: modelData
-                                }
+                            property var choices: modelData.choices
+                            ComboBoxFitContents {
+                                model: choices
+                                currentIndex: modelData
+                                // currentText: modelData
+                                // border.width: 1
                             }
                         }
                     }
diff --git a/retrace/daemon/ui/resources.qrc b/retrace/daemon/ui/resources.qrc
index c79c14d9..9574d8c0 100644
--- a/retrace/daemon/ui/resources.qrc
+++ b/retrace/daemon/ui/resources.qrc
@@ -14,5 +14,6 @@
         <file>qml/RenderTargetControl.qml</file>
         <file>qml/UniformControl.qml</file>
         <file>qml/StateControl.qml</file>
+        <file>qml/ComboBoxFitContents.qml</file>
     </qresource>
 </RCC>