Preference: Selecting preferred display settings app

virtscreen/qml/DisplayPage.qml

@@ -76,8 +76,7 @@ ColumnLayout {
                     delegate: ItemDelegate {
                         width: deviceComboBox.width
                         text: modelData.name
-                        font.weight: deviceComboBox.currentIndex === index ? Font.DemiBold : Font.Normal
+                        font.weight: deviceComboBox.currentIndex === index ? Font.Bold : Font.Normal
-                        highlighted: ListView.isCurrentItem
                         enabled: modelData.connected ? false : true
                     }
                 }

virtscreen/qml/data.json

@@ -12,16 +12,19 @@
     },
     "displaySettingApps": {
         "gnome": {
+            "value": "gnome",
             "name": "GNOME",
             "args": "gnome-control-center display",
             "XDG_CURRENT_DESKTOP": ["gnome", "unity"]
         },
         "kde": {
+            "value": "kde",
             "name": "KDE",
             "args": "kcmshell5 kcm_kscreen",
             "XDG_CURRENT_DESKTOP": ["kde"]
         },
         "arandr": {
+            "value": "arandr",
             "name": "ARandR",
             "args": "arandr",
             "XDG_CURRENT_DESKTOP": []

virtscreen/qml/preferenceDialog.qml

@@ -13,8 +13,46 @@ Dialog {
     x: (window.width - width) / 2
     y: (window.width - height) / 2 
     width: popupWidth
+    height: 250
+
+    Component.onCompleted: {
+        var request = new XMLHttpRequest();
+        request.open('GET', 'data.json');
+        request.onreadystatechange = function(event) {
+            if (request.readyState == XMLHttpRequest.DONE) {
+                var data = JSON.parse(request.responseText).displaySettingApps;
+                var combobox = displaySettingAppComboBox;
+                combobox.model = Object.keys(data).map(function(k){return data[k]});
+                combobox.currentIndex = Object.keys(data).indexOf(settings.displaySettingApp);
+            }
+        };
+        request.send();
+    }
+
     ColumnLayout {
         anchors.fill: parent
+
+        RowLayout {
+            anchors.left: parent.left
+            anchors.right: parent.right
+            Label { id: displaySettingAppLabel; text: "Display setting program"; }
+            ComboBox {
+                id: displaySettingAppComboBox
+                anchors.left: displaySettingAppLabel.right
+                anchors.right: parent.right
+                anchors.leftMargin: 10
+                textRole: "name"
+                onActivated: function(index) {
+                    settings.displaySettingApp = model[index].value;
+                }
+                delegate: ItemDelegate {
+                    width: parent.width
+                    text: modelData.name
+                    font.weight: displaySettingAppComboBox.currentIndex === index ? Font.Bold : Font.Normal
+                }
+            }
+        }
+
         RowLayout {
             anchors.left: parent.left
             anchors.right: parent.right
@@ -52,6 +90,11 @@ Dialog {
                 }
             }
         }
+
+        RowLayout {
+            // Empty layout
+            Layout.fillHeight: true
+        }
     }
     onAccepted: {}
     onRejected: {}