QGroundControl UI customization

First of all, I’m just trying to learn the code, so you should take my advice and guiding taken with a grain of salt.

You can set different maps in The APPLICATION SETTINGS > GENERAL tab, under MAP PROVIDER.

So we start in MainWindowInner.qml. In the app we should go to the Application Settings tab in the main toolbar. So checking the qml, we find there is defined a custom type MainToolBar with id toolBar and defined as the main UI. We so, check MainToolBar.qml and get a QGCToolBarButton custom type:

        QGCToolBarButton {
            id:                 settingsButton
            anchors.top:        parent.top
            anchors.bottom:     parent.bottom
            exclusiveGroup:     mainActionGroup
            source:             "/res/QGCLogoWhite"
            logo:               true
            onClicked:          toolBar.showSettingsView()
            visible:            !QGroundControl.corePlugin.options.combineSettingsAndSetup
        }

So back to MainWindowInner.qml and see that onShowSettingsView points to mainWindow.showSettingsView:

function showSettingsView() {
    rootLoader.sourceComponent = null
    if(currentPopUp) {
        currentPopUp.close()
    }
    //-- In settings view, the full height is available. Set to 0 so it is ignored.
    ScreenTools.availableHeight = 0
    hideAllViews()
    if (settingsViewLoader.source != _settingsViewSource) {
        settingsViewLoader.source  = _settingsViewSource
    }
    settingsViewLoader.visible  = true
    toolBar.checkSettingsButton()
}

_settingsViewSource is a property string that points to “AppSettings.qml”, so there we go. Here we have a rectangle that holds a QGCFlickable, where a Repeater (http://doc.qt.io/qt-5/qml-qtquick-repeater.html) instantiates a number of QGCButton type components using a model:

            model:  QGroundControl.corePlugin.settingsPages

So now, based on how C++ integrates with QML, we have to search, in this case, for a Q_PROPERTY called settingsPage. In my case, a grep search through the code takes me to QGCCorePlugin.h were we find:

Q_PROPERTY(QVariantList         settingsPages           READ settingsPages                                  NOTIFY settingsPagesChanged)

So, lets take a look at that code in QGCCorePlugin.cc:

QVariantList &QGCCorePlugin::settingsPages()
{
if(!_p->pGeneral) {
_p->pGeneral = new QmlComponentInfo(tr(“General”),
QUrl::fromUserInput(“qrc:/qml/GeneralSettings.qml”),
QUrl::fromUserInput(“qrc:/res/gear-white.svg”));
_p->settingsList.append(QVariant::fromValue((QmlComponentInfo*)_p->pGeneral));
_p->pCommLinks = new QmlComponentInfo(tr(“Comm Links”),
QUrl::fromUserInput(“qrc:/qml/LinkSettings.qml”),
QUrl::fromUserInput(“qrc:/res/waves.svg”));
_p->settingsList.append(QVariant::fromValue((QmlComponentInfo*)_p->pCommLinks));
_p->pOfflineMaps = new QmlComponentInfo(tr(“Offline Maps”),
QUrl::fromUserInput(“qrc:/qml/OfflineMap.qml”),
QUrl::fromUserInput(“qrc:/res/waves.svg”));
_p->settingsList.append(QVariant::fromValue((QmlComponentInfo*)_p->pOfflineMaps));
_p->pMAVLink = new QmlComponentInfo(tr(“MAVLink”),
QUrl::fromUserInput(“qrc:/qml/MavlinkSettings.qml”),
QUrl::fromUserInput(“qrc:/res/waves.svg”));
_p->settingsList.append(QVariant::fromValue((QmlComponentInfo*)_p->pMAVLink));
_p->pConsole = new QmlComponentInfo(tr(“Console”),
QUrl::fromUserInput(“qrc:/qml/QGroundControl/Controls/AppMessages.qml”));
_p->settingsList.append(QVariant::fromValue((QmlComponentInfo*)_p->pConsole));
#if defined(QT_DEBUG)
//-- These are always present on Debug builds
_p->pMockLink = new QmlComponentInfo(tr(“Mock Link”),
QUrl::fromUserInput(“qrc:/qml/MockLink.qml”));
_p->settingsList.append(QVariant::fromValue((QmlComponentInfo*)_p->pMockLink));
_p->pDebug = new QmlComponentInfo(tr(“Debug”),
QUrl::fromUserInput(“qrc:/qml/DebugWindow.qml”));
_p->settingsList.append(QVariant::fromValue((QmlComponentInfo*)_p->pDebug));
#endif

The code is pointing us to GeneralSettings.qml.

                    //-- Map Provider
                    Row {
                        spacing:    ScreenTools.defaultFontPixelWidth
                        visible:    _mapProvider.visible
                        QGCLabel {
                            text:       qsTr("Map Provider:")
                            width:      _labelWidth
                            anchors.verticalCenter: parent.verticalCenter
                        }
                        FactComboBox {
                            width:      _editFieldWidth
                            fact:       _mapProvider
                            indexModel: false
                            anchors.verticalCenter: parent.verticalCenter
                        }
                    }

We have a Fact defined:

property Fact _mapProvider:                 QGroundControl.settingsManager.flightMapSettings.mapProvider

So here is where map provider is defined. But we dont want to know who is the provider, but where its implemented the flight map. But now we know how the app calls to get the name of the map he wants to provide. So another grep search:

jguillen@HarryPotter:~/workspace/qgroundcontrol/src$ grep -r “QGroundControl.settingsManager.flightMapSettings.mapProvider” .
./ui/preferences/GeneralSettings.qml: property Fact _mapProvider: QGroundControl.settingsManager.flightMapSettings.mapProvider
./FlightMap/FlightMap.qml: target: QGroundControl.settingsManager.flightMapSettings.mapProvider
jguillen@HarryPotter:~/workspace/qgroundcontrol/src$

So we open FlightMap.qml and find that has a Map QML type (Map QML Type | Qt Location 5.15.16). You can follow from here.

Good luck :wink: