Merge pull request #629 from MrDowntempo/feat/lock-keys-tweaks

Feat/lock keys tweaks

Assets/Translations/de.json

@@ -1290,6 +1290,18 @@
         "show-scroll-lock": {
           "description": "Scroll-Lock-Status anzeigen.",
           "label": "Rollenfeststelltaste"
+        },
+        "indicator-style": {
+          "circle": "Kreisbuchstaben",
+          "circle-dash": "Gestrichelte Kreisbuchstaben",
+          "circle-dot": "Punktierte Kreisbuchstaben",
+          "description": "Symbolstil für die Feststelltastenanzeigen",
+          "hex": "Sechseck-Buchstaben",
+          "label": "Indikatorstil",
+          "large": "Große Buchstaben",
+          "small": "Kleinbuchstaben",
+          "square": "Quadratische Buchstaben",
+          "square-round": "Abgerundete quadratische Buchstaben"
         }
       }
     }

Assets/Translations/en.json

@@ -1262,6 +1262,18 @@
         }
       },
       "lock-keys": {
+        "indicator-style": {
+          "label": "Indicator Style",
+          "description": "Icon style for the lock key indicators",
+          "large": "Large Letters",
+          "small": "Small Letters",
+          "square": "Square Letters",
+          "square-round": "Rounded Squre Letters",
+          "circle": "Circle Letters",
+          "circle-dash": "Dashed Circle Letters",
+          "circle-dot": "Dotted Circle Letters",
+          "hex": "Hexagon Letters"
+        },
         "show-caps-lock": {
           "label": "Caps Lock",
           "description": "Display caps lock status."

Assets/Translations/es.json

@@ -1273,6 +1273,18 @@
         "show-scroll-lock": {
           "description": "Mostrar el estado de Bloq Despl.",
           "label": "Bloq Despl"
+        },
+        "indicator-style": {
+          "circle": "Letras circulares",
+          "circle-dash": "Letras de círculo discontinuo",
+          "circle-dot": "Letras de círculo punteado",
+          "description": "Estilo de icono para los indicadores de las teclas de bloqueo",
+          "hex": "Letras hexagonales",
+          "label": "Estilo del indicador",
+          "large": "Letras grandes",
+          "small": "Letras minúsculas",
+          "square": "Letras cuadradas",
+          "square-round": "Letras cuadradas redondeadas"
         }
       }
     }

Assets/Translations/fr.json

@@ -1273,6 +1273,18 @@
         "show-scroll-lock": {
           "description": "Afficher l'état du verrouillage du défilement.",
           "label": "Verr Maj"
+        },
+        "indicator-style": {
+          "circle": "Lettres circulaires",
+          "circle-dash": "Lettres en cercle pointillé",
+          "circle-dot": "Lettres en pointillés dans un cercle",
+          "description": "Style d'icône pour les indicateurs de la touche de verrouillage",
+          "hex": "Lettres hexagonales",
+          "label": "Style d'indicateur",
+          "large": "Grandes lettres",
+          "small": "Petites lettres",
+          "square": "Lettres carrées",
+          "square-round": "Lettres carrées arrondies"
         }
       }
     }

Assets/Translations/pt.json

@@ -1273,6 +1273,18 @@
         "show-scroll-lock": {
           "description": "Exibir o status do Scroll Lock.",
           "label": "Scroll Lock"
+        },
+        "indicator-style": {
+          "circle": "Letras Circulares",
+          "circle-dash": "Letras em Círculo Tracejadas",
+          "circle-dot": "Letras de Círculo Pontilhado",
+          "description": "Estilo de ícone para os indicadores da tecla de bloqueio.",
+          "hex": "Letras Hexagonais",
+          "label": "Estilo do Indicador",
+          "large": "Letras grandes",
+          "small": "Letras minúsculas",
+          "square": "Letras Quadradas",
+          "square-round": "Letras Quadradas Arredondadas"
         }
       }
     }

Assets/Translations/zh-CN.json

@@ -1273,6 +1273,18 @@
         "show-scroll-lock": {
           "description": "显示滚动锁定状态。",
           "label": "滚动锁定"
+        },
+        "indicator-style": {
+          "hex": "六边形字母",
+          "large": "大写字母",
+          "small": "小写字母",
+          "square": "方块字",
+          "square-round": "圆角方形字母",
+          "circle": "圆圈字母",
+          "circle-dash": "虚线圆圈字母",
+          "circle-dot": "虚线圆圈字母",
+          "description": "锁键指示器的图标样式",
+          "label": "指标样式"
         }
       }
     }

Modules/Bar/Widgets/LockKeys.qml

@@ -30,6 +30,7 @@ Rectangle {
   readonly property string barPosition: Settings.data.bar.position
   readonly property bool isVertical: barPosition === "left" || barPosition === "right"
 
+  readonly property string iconStyle: (widgetSettings.indicatorStyle !== undefined) ? widgetSettings.indicatorStyle : widgetMetadata.indicatorStyle
   readonly property bool showCaps: (widgetSettings.showCapsLock !== undefined) ? widgetSettings.showCapsLock : widgetMetadata.showCapsLock
   readonly property bool showNum: (widgetSettings.showNumLock !== undefined) ? widgetSettings.showNumLock : widgetMetadata.showNumLock
   readonly property bool showScroll: (widgetSettings.showScrollLock !== undefined) ? widgetSettings.showScrollLock : widgetMetadata.showScrollLock
@@ -50,6 +51,8 @@ Rectangle {
     implicitWidth: rowLayout.visible ? rowLayout.implicitWidth : colLayout.implicitWidth
     implicitHeight: rowLayout.visible ? rowLayout.implicitHeight : colLayout.implicitHeight
 
+    readonly property var indicatorStyle: root.getIndicatorStyle(root.iconStyle)
+
     RowLayout {
       id: rowLayout
       visible: !root.isVertical
@@ -57,17 +60,17 @@ Rectangle {
 
       NIcon {
         visible: root.showCaps
-        icon: "letter-c"
+        icon: layout.indicatorStyle[0]
         color: LockKeysService.capsLockOn ? Color.mTertiary : Qt.alpha(Color.mOnSurfaceVariant, 0.3)
       }
       NIcon {
         visible: root.showNum
-        icon: "letter-n"
+        icon: layout.indicatorStyle[1]
         color: LockKeysService.numLockOn ? Color.mTertiary : Qt.alpha(Color.mOnSurfaceVariant, 0.3)
       }
       NIcon {
         visible: root.showScroll
-        icon: "letter-s"
+        icon: layout.indicatorStyle[2]
         color: LockKeysService.scrollLockOn ? Color.mTertiary : Qt.alpha(Color.mOnSurfaceVariant, 0.3)
       }
     }
@@ -79,19 +82,42 @@ Rectangle {
 
       NIcon {
         visible: root.showCaps
-        icon: "letter-c"
+        icon: layout.indicatorStyle[0]
         color: LockKeysService.capsLockOn ? Color.mTertiary : Qt.alpha(Color.mOnSurfaceVariant, 0.3)
       }
       NIcon {
         visible: root.showNum
-        icon: "letter-n"
+        icon: layout.indicatorStyle[1]
         color: LockKeysService.numLockOn ? Color.mTertiary : Qt.alpha(Color.mOnSurfaceVariant, 0.3)
       }
       NIcon {
         visible: root.showScroll
-        icon: "letter-s"
+        icon: layout.indicatorStyle[2]
         color: LockKeysService.scrollLockOn ? Color.mTertiary : Qt.alpha(Color.mOnSurfaceVariant, 0.3)
       }
     }
   }
+
+  function getIndicatorStyle(styleName) {
+    switch (styleName) {
+      case "large":
+        return ["letter-c", "letter-n", "letter-s"]
+      case "small":
+        return ["letter-c-small", "letter-n-small", "letter-s-small"]
+      case "square":
+        return ["square-letter-c", "square-letter-n", "square-letter-s"]
+      case "square-round":
+        return ["square-rounded-letter-c", "square-rounded-letter-n", "square-rounded-letter-s"]
+      case "circle":
+        return ["circle-letter-c", "circle-letter-n", "circle-letter-s"]
+      case "circle-dash":
+        return ["circle-dashed-letter-c", "circle-dashed-letter-n", "circle-dashed-letter-s"]
+      case "circle-dot":
+        return ["circle-dotted-letter-c", "circle-dotted-letter-n", "circle-dotted-letter-s"]
+      case "hex":
+        return ["hexagon-letter-c", "hexagon-letter-n", "hexagon-letter-s"]
+      default:
+        return ["letter-c", "letter-n", "letter-s"]
+    }
+  }
 }

Modules/Settings/Bar/WidgetSettings/LockKeysSettings.qml

@@ -14,18 +14,53 @@ ColumnLayout {
   property var widgetMetadata: null
 
   // Local state
+  property string valueIndicatorStyle: widgetData.indicatorStyle !== undefined ? widgetData.indicatorStyle : widgetMetadata.indicatorStyle
   property bool valueShowCapsLock: widgetData.showCapsLock !== undefined ? widgetData.showCapsLock : widgetMetadata.showCapsLock
   property bool valueShowNumLock: widgetData.showNumLock !== undefined ? widgetData.showNumLock : widgetMetadata.showNumLock
   property bool valueShowScrollLock: widgetData.showScrollLock !== undefined ? widgetData.showScrollLock : widgetMetadata.showScrollLock
 
   function saveSettings() {
     var settings = Object.assign({}, widgetData || {})
+    settings.indicatorStyle = valueIndicatorStyle
     settings.showCapsLock = valueShowCapsLock
     settings.showNumLock = valueShowNumLock
     settings.showScrollLock = valueShowScrollLock
     return settings
   }
 
+  NComboBox {
+    Layout.fillWidth: true
+    label: I18n.tr("bar.widget-settings.lock-keys.indicator-style.label")
+    description: I18n.tr("bar.widget-settings.lock-keys.indicator-style.description")
+    model: [{
+      "key": "large",
+      "name": I18n.tr("bar.widget-settings.lock-keys.indicator-style.large")
+    }, {
+      "key": "small",
+      "name": I18n.tr("bar.widget-settings.lock-keys.indicator-style.small")
+    }, {
+      "key": "square",
+      "name": I18n.tr("bar.widget-settings.lock-keys.indicator-style.square")
+    }, {
+      "key": "square-round",
+      "name": I18n.tr("bar.widget-settings.lock-keys.indicator-style.square-round")
+    }, {
+      "key": "circle",
+      "name": I18n.tr("bar.widget-settings.lock-keys.indicator-style.circle")
+    }, {
+      "key": "circle-dash",
+      "name": I18n.tr("bar.widget-settings.lock-keys.indicator-style.circle-dash")
+    }, {
+      "key": "circle-dot",
+      "name": I18n.tr("bar.widget-settings.lock-keys.indicator-style.circle-dot")
+    }, {
+      "key": "hex",
+      "name": I18n.tr("bar.widget-settings.lock-keys.indicator-style.hex")
+    }]
+    currentKey: valueIndicatorStyle
+    onSelected: key => valueIndicatorStyle = key
+  }
+
   NToggle {
     label: I18n.tr("bar.widget-settings.lock-keys.show-caps-lock.label")
     description: I18n.tr("bar.widget-settings.lock-keys.show-caps-lock.description")

Services/BarWidgetRegistry.qml

@@ -101,6 +101,7 @@ Singleton {
                                   },
                                   "LockKeys": {
                                     "allowUserSettings": true,
+                                    "indicatorStyle": "large",
                                     "showCapsLock": true,
                                     "showNumLock": true,
                                     "showScrollLock": true