[mobileshell]: apply scale factor to status bar

This change allows scaling of the statusbar (the top panel).

As we have to accommodate for a wide variety of devices with different
physical pixel sizes, we need a way to scale the top panel / status bar.
This change introduces a config value (in plasmamobilerc, such as other
shell settings) that controls this size.

For example (plasmamobilerc):

[General]
statusBarScaleFactor=1.5

(Config UI in kcm mobileshell in separate patch)

Signed-off-by: Sebastian Kügler <sebas@kde.org>

components/mobileshell/qml/actiondrawer/quicksettings/QuickSettingsPanel.qml

@@ -13,6 +13,7 @@ import org.kde.ksvg 1.0 as KSvg
 import org.kde.plasma.private.mobileshell as MobileShell
 import org.kde.plasma.core as PlasmaCore
 import org.kde.plasma.private.mobileshell.quicksettingsplugin as QS
+import org.kde.plasma.private.mobileshell.shellsettingsplugin as ShellSettings
 
 /**
  * Quick settings panel for landscape view (right sidebar).
@@ -62,8 +63,9 @@ MobileShell.BaseItem {
                 id: statusBar
                 Layout.alignment: Qt.AlignTop
                 Layout.fillWidth: true
-                Layout.preferredHeight: Kirigami.Units.gridUnit * 1.5
+                // Align these to double pixels to aid vertical alignment and sharper icon rendering
-                Layout.maximumHeight: Kirigami.Units.gridUnit * 1.5
+                Layout.preferredHeight: Math.round(Kirigami.Units.gridUnit * 1.5 * ShellSettings.Settings.statusBarScaleFactor / 2) * 2
+                Layout.maximumHeight: Math.round(Kirigami.Units.gridUnit * 1.5 * ShellSettings.Settings.statusBarScaleFactor / 2) * 2
 
                 Kirigami.Theme.colorSet: Kirigami.Theme.Window
                 Kirigami.Theme.inherit: false

components/mobileshell/qml/components/Constants.qml

@@ -12,7 +12,7 @@ import org.kde.plasma.private.mobileshell.shellsettingsplugin as ShellSettings
 pragma Singleton
 
 QtObject {
-    readonly property real topPanelHeight: Kirigami.Units.gridUnit + Kirigami.Units.smallSpacing
+    readonly property real topPanelHeight: Math.round(Kirigami.Units.gridUnit * ShellSettings.Settings.statusBarScaleFactor / 2) * 2 + Kirigami.Units.smallSpacing
     readonly property real navigationPanelThickness: ShellSettings.Settings.navigationPanelEnabled ? Kirigami.Units.gridUnit * 2 : 0
 
     function navigationPanelOnSide(screenWidth: real, screenHeight: real): bool {

components/mobileshell/qml/statusbar/StatusBar.qml

@@ -20,6 +20,7 @@ import org.kde.plasma.private.systemtray as SystemTray
 import org.kde.plasma.components 3.0 as PlasmaComponents
 import org.kde.kitemmodels as KItemModels
 import org.kde.plasma.private.mobileshell as MobileShell
+import org.kde.plasma.private.mobileshell.shellsettingsplugin as ShellSettings
 
 Item {
     id: root
@@ -51,9 +52,9 @@ Item {
 
     property color colorScopeColor: Kirigami.Theme.backgroundColor
 
-    readonly property real textPixelSize: 11
+    readonly property real textPixelSize: Math.round(11 * ShellSettings.Settings.statusBarScaleFactor)
-    readonly property real smallerTextPixelSize: 9
+    readonly property real smallerTextPixelSize: Math.round(9 * ShellSettings.Settings.statusBarScaleFactor)
-    readonly property real elementSpacing: Kirigami.Units.smallSpacing * 1.5
+    readonly property real elementSpacing: Math.round(Kirigami.Units.smallSpacing * 1.5)
 
     P5Support.DataSource {
         id: timeSource

components/mobileshell/qml/statusbar/indicators/BatteryIndicator.qml

@@ -42,7 +42,6 @@ RowLayout {
             Layout.alignment: Qt.AlignVCenter
 
             height: batteryRepeater.height
-            width: childrenRect.width
 
             PW.BatteryIcon {
                 id: battery

components/shellsettingsplugin/mobileshellsettings.cpp

@@ -24,7 +24,6 @@ MobileShellSettings::MobileShellSettings(QObject *parent)
     , m_config{KSharedConfig::openConfig(CONFIG_FILE, KConfig::SimpleConfig)}
 {
     m_configWatcher = KConfigWatcher::create(m_config);
-
     connect(m_configWatcher.data(), &KConfigWatcher::configChanged, this, [this](const KConfigGroup &group, const QByteArrayList &names) -> void {
         Q_UNUSED(names)
         if (group.name() == GENERAL_CONFIG_GROUP) {
@@ -32,6 +31,7 @@ MobileShellSettings::MobileShellSettings(QObject *parent)
             Q_EMIT vibrationDurationChanged();
             Q_EMIT animationsEnabledChanged();
             Q_EMIT dateInStatusBarChanged();
+            Q_EMIT statusBarScaleFactorChanged();
             Q_EMIT navigationPanelEnabledChanged();
             Q_EMIT alwaysShowKeyboardToggleOnNavigationPanelChanged();
             Q_EMIT keyboardButtonEnabledChanged();
@@ -95,6 +95,19 @@ void MobileShellSettings::setDateInStatusBar(bool dateInStatusBar)
     m_config->sync();
 }
 
+float MobileShellSettings::statusBarScaleFactor() const
+{
+    auto group = KConfigGroup{m_config, GENERAL_CONFIG_GROUP};
+    return group.readEntry("statusBarScaleFactor", 1.0);
+}
+
+void MobileShellSettings::setStatusBarScaleFactor(float statusBarScaleFactor)
+{
+    auto group = KConfigGroup{m_config, GENERAL_CONFIG_GROUP};
+    group.writeEntry("statusBarScaleFactor", statusBarScaleFactor, KConfigGroup::Notify);
+    m_config->sync();
+}
+
 bool MobileShellSettings::navigationPanelEnabled() const
 {
     auto group = KConfigGroup{m_config, GENERAL_CONFIG_GROUP};

components/shellsettingsplugin/mobileshellsettings.h

@@ -31,6 +31,7 @@ class MobileShellSettings : public QObject
 
     // status bar
     Q_PROPERTY(bool dateInStatusBar READ dateInStatusBar WRITE setDateInStatusBar NOTIFY dateInStatusBarChanged)
+    Q_PROPERTY(float statusBarScaleFactor READ statusBarScaleFactor WRITE setStatusBarScaleFactor NOTIFY statusBarScaleFactorChanged)
 
     // navigation panel
     Q_PROPERTY(bool navigationPanelEnabled READ navigationPanelEnabled WRITE setNavigationPanelEnabled NOTIFY navigationPanelEnabledChanged)
@@ -108,6 +109,20 @@ public:
      */
     void setDateInStatusBar(bool dateInStatusBar);
 
+    /**
+     * Scale factor for status bar height.
+     *
+     * Status bar height will be multiplied by this value.
+     */
+    float statusBarScaleFactor() const;
+
+    /**
+     * Set the scale factor for the status bar's height.
+     *
+     * @param statusBarScaleFactor Scale factor for status bar height.
+     */
+    void setStatusBarScaleFactor(float statusBarScaleFactor);
+
     /**
      * Whether the navigation panel is enabled.
      *
@@ -183,6 +198,7 @@ Q_SIGNALS:
     void keyboardButtonEnabledChanged();
     void animationsEnabledChanged();
     void dateInStatusBarChanged();
+    void statusBarScaleFactorChanged();
     void taskSwitcherPreviewsEnabledChanged();
     void actionDrawerTopLeftModeChanged();
     void actionDrawerTopRightModeChanged();

shell/contents/lockscreen/LockScreen.qml

@@ -8,6 +8,7 @@ import QtQuick.Layouts
 
 import org.kde.plasma.core as PlasmaCore
 import org.kde.notificationmanager as Notifications
+import org.kde.plasma.private.mobileshell as MobileShell
 import org.kde.plasma.private.mobileshell.dpmsplugin as DPMS
 import org.kde.plasma.components 3.0 as PC3
 
@@ -99,7 +100,7 @@ Item {
             id: headerBar
             z: 1
             anchors.fill: parent
-            statusBarHeight: Kirigami.Units.gridUnit * 1.25
+            statusBarHeight: MobileShell.Constants.topPanelHeight
             openFactor: flickableLoader.item ? flickableLoader.item.openFactor : 0
             notificationsModel: root.notifModel
             onPasswordRequested: root.askPassword()