Slight rework of App Settings list

* Add divider support for spacing between groups
* Alphabetize center group

Author: DonLakeFlyer

src/QmlControls/AppSettings.qml

@@ -35,9 +35,9 @@ Rectangle {
 
     function showSettingsPage(settingsPage) {
         for (var i=0; i<buttonRepeater.count; i++) {
-            var button = buttonRepeater.itemAt(i)
-            if (button.text === settingsPage) {
-                button.clicked()
+            var loader = buttonRepeater.itemAt(i)
+            if (loader && loader.item && loader.item.text === settingsPage) {
+                loader.item.clicked()
                 break
             }
         }
@@ -60,9 +60,10 @@ Rectangle {
         }
     }
 
-
     SettingsPagesModel { id: settingsPagesModel }
 
+    ButtonGroup { id: buttonGroup }
+
     QGCFlickable {
         id:                 buttonList
         width:              buttonColumn.width
@@ -77,24 +78,29 @@ Rectangle {
 
         ColumnLayout {
             id:         buttonColumn
-            spacing:    ScreenTools.defaultFontPixelHeight / 4
+            spacing:    0
 
             property real _maxButtonWidth: 0
 
-            Repeater {
-                id:     buttonRepeater
-                model:  settingsPagesModel
+            Component {
+                id: dividerComponent
+
+                Item { height: ScreenTools.defaultFontPixelHeight / 2 }
+            }
+
+            Component {
+                id: buttonComponent
 
                 SettingsButton {
-                    Layout.fillWidth:   true
-                    text:               name
-                    icon.source:        iconUrl
-                    visible:            pageVisible()
+                    text:               modelName
+                    icon.source:        modelIconUrl
+                    visible:            modelPageVisible()
+                    ButtonGroup.group:  buttonGroup
 
                     onClicked: {
                         if (mainWindow.allowViewSwitch()) {
-                            if (rightPanel.source !== url) {
-                                rightPanel.source = url
+                            if (rightPanel.source !== modelUrl) {
+                                rightPanel.source = modelUrl
                             }
                             checked = true
                         }
@@ -111,13 +117,28 @@ Rectangle {
                         if (_commingFromRIDSettings) {
                             checked = false
                             _commingFromRIDSettings = false
-                            if (modelData.url == "qrc:/qml/QGroundControl/AppSettings/RemoteIDSettings.qml") {
+                            if (modelUrl == "qrc:/qml/QGroundControl/AppSettings/RemoteIDSettings.qml") {
                                 checked = true
                             }
                         }
                     }
                 }
             }
+
+            Repeater {
+                id:     buttonRepeater
+                model:  settingsPagesModel
+
+                Loader {
+                    Layout.fillWidth: true
+                    sourceComponent: name === "Divider" ? dividerComponent : buttonComponent
+
+                    property var modelName: name
+                    property var modelIconUrl: iconUrl
+                    property var modelUrl: url
+                    property var modelPageVisible: pageVisible
+                }
+            }
         }
     }
 

src/QmlControls/SettingsButton.qml

@@ -14,8 +14,6 @@ import QtQuick.Layouts
 import QGroundControl
 import QGroundControl.Controls
 
-
-
 Button {
     id:             control
     padding:        ScreenTools.defaultFontPixelWidth * 0.75

src/UI/AppSettings/SettingsPagesModel.qml

@@ -42,10 +42,7 @@ ListModel {
     }
 
     ListElement {
-        name: qsTr("Telemetry")
-        url: "qrc:/qml/QGroundControl/AppSettings/TelemetrySettings.qml"
-        iconUrl: "qrc:/InstrumentValueIcons/drone.svg"
-        pageVisible: function() { return true }
+        name: "Divider"
     }
 
     ListElement {
@@ -54,29 +51,38 @@ ListModel {
         iconUrl: "qrc:/InstrumentValueIcons/airplane.svg"
         pageVisible: function() { return true }
     }
-    ListElement {
-        name: qsTr("NTRIP/RTK")
-        url: "qrc:/qml/QGroundControl/AppSettings/NTRIPSettings.qml"
-        iconUrl: "qrc:/InstrumentValueIcons/globe.svg"
-        pageVisible: function() {
-            return QGroundControl.settingsManager &&
-                   QGroundControl.settingsManager.ntripSettings !== undefined
-        }
-    }
+
     ListElement {
         name: qsTr("Comm Links")
         url: "qrc:/qml/QGroundControl/AppSettings/LinkSettings.qml"
         iconUrl: "qrc:/InstrumentValueIcons/usb.svg"
         pageVisible: function() { return true }
     }
 
+    ListElement {
+        name: qsTr("Logging")
+        url: "qrc:/qml/QGroundControl/Controls/AppLogging.qml"
+        iconUrl: "qrc:/InstrumentValueIcons/conversation.svg"
+        pageVisible: function() { return true }
+    }
+
     ListElement {
         name: qsTr("Maps")
         url: "qrc:/qml/QGroundControl/AppSettings/MapSettings.qml"
         iconUrl: "qrc:/InstrumentValueIcons/globe.svg"
         pageVisible: function() { return true }
     }
 
+    ListElement {
+        name: qsTr("NTRIP/RTK")
+        url: "qrc:/qml/QGroundControl/AppSettings/NTRIPSettings.qml"
+        iconUrl: "qrc:/InstrumentValueIcons/globe.svg"
+        pageVisible: function() {
+            return QGroundControl.settingsManager &&
+                   QGroundControl.settingsManager.ntripSettings !== undefined
+        }
+    }
+
     ListElement {
         name: qsTr("PX4 Log Transfer")
         url: "qrc:/qml/QGroundControl/AppSettings/PX4LogTransferSettings.qml"
@@ -97,19 +103,27 @@ ListModel {
     }
 
     ListElement {
-        name: qsTr("Logging")
-        url: "qrc:/qml/QGroundControl/Controls/AppLogging.qml"
-        iconUrl: "qrc:/InstrumentValueIcons/conversation.svg"
+        name: qsTr("Telemetry")
+        url: "qrc:/qml/QGroundControl/AppSettings/TelemetrySettings.qml"
+        iconUrl: "qrc:/InstrumentValueIcons/drone.svg"
         pageVisible: function() { return true }
     }
 
+    ListElement {
+        name: "Divider"
+    }
+
     ListElement {
         name: qsTr("Help")
         url: "qrc:/qml/QGroundControl/AppSettings/HelpSettings.qml"
         iconUrl: "qrc:/InstrumentValueIcons/question.svg"
         pageVisible: function() { return true }
     }
 
+    ListElement {
+        name: "Divider"
+    }
+
     ListElement {
         name: qsTr("Mock Link")
         url: "qrc:/qml/QGroundControl/AppSettings/MockLink.qml"