NowPlaying
Code Issues

feat: add configurable text and separator spacing

Browse Source
This commit is contained in:
ruinivist
2026-05-23 12:23:38 +00:00
parent 0ebd29ea02
commit a0a675bc99
5 changed files with 120 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files
README.md
+10
View File
@@ -92,6 +92,16 @@ Enable the repository pre-commit hook:
make hooks-install
```
## Customization
The widget appearance can be tuned from the Plasma widget settings, including:
- title/artist vertical spacing
- NOW/PLAYING label vertical spacing
- separator gap from labels
- separator gap from track text
- separator height percentage
## Release Upload
Required GitHub repository secrets:
package/contents/config/main.xml
+20
View File
@@ -41,5 +41,25 @@
<label>Enable text shadow</label>
<default>false</default>
</entry>
<entry name="trackTextVerticalSpacing" type="Int">
<label>Track text vertical spacing</label>
<default>5</default>
</entry>
<entry name="labelVerticalSpacing" type="Int">
<label>Now Playing label vertical spacing</label>
<default>0</default>
</entry>
<entry name="separatorGapLabel" type="Int">
<label>Separator gap from label rail</label>
<default>4</default>
</entry>
<entry name="separatorGapTrack" type="Int">
<label>Separator gap from track text</label>
<default>4</default>
</entry>
<entry name="separatorHeight" type="Int">
<label>Separator height percent</label>
<default>90</default>
</entry>
</group>
</kcfg>
package/contents/ui/Representation.qml
+24 -9
View File
@@ -15,6 +15,11 @@ MouseArea {
property int configuredBackgroundRadius: 0
property string configuredForegroundColor: "white"
property bool configuredTextShadowEnabled: false
property int configuredTrackTextVerticalSpacing: 5
property int configuredLabelVerticalSpacing: 0
property int configuredSeparatorGapLabel: 4
property int configuredSeparatorGapTrack: 4
property int configuredSeparatorHeight: 90
readonly property double buttonSize: 16
readonly property string effectiveLabelVisibilityMode: configuredLabelVisibilityMode === "always" || configuredLabelVisibilityMode === "never" ? configuredLabelVisibilityMode : "auto"
readonly property bool labelsOnRight: configuredLabelPlacement === "right"
@@ -22,10 +27,14 @@ MouseArea {
readonly property bool usesCustomBackground: configuredBackgroundStyle === "custom"
readonly property int hideModeHorizontalPadding: 8
readonly property int labelRailWidth: 100
readonly property int separatorPadding: 4
readonly property string effectiveBackgroundColor: configuredBackgroundColor || "transparent"
readonly property int effectiveBackgroundRadius: Math.max(0, configuredBackgroundRadius)
readonly property string effectiveForegroundColor: configuredForegroundColor || "white"
readonly property int effectiveTrackTextVerticalSpacing: configuredTrackTextVerticalSpacing
readonly property int effectiveLabelVerticalSpacing: configuredLabelVerticalSpacing
readonly property int effectiveSeparatorGapLabel: Math.max(0, configuredSeparatorGapLabel)
readonly property int effectiveSeparatorGapTrack: Math.max(0, configuredSeparatorGapTrack)
readonly property int effectiveSeparatorHeight: Math.max(0, Math.min(100, configuredSeparatorHeight))
readonly property bool hasTrackInfo: player.ready && (((player.title || "").trim().length > 0) || ((player.artists || "").trim().length > 0))
readonly property bool nowPlayingLabelsVisible: {
if (effectiveLabelVisibilityMode === "always")
@@ -104,7 +113,7 @@ MouseArea {
id: nowPlayingLabels
Layout.alignment: mediaControlsMouseArea.labelsOnRight ? Qt.AlignLeft : Qt.AlignRight
spacing: 0
spacing: mediaControlsMouseArea.effectiveLabelVerticalSpacing
visible: mediaControlsMouseArea.nowPlayingLabelsVisible
ShadowedLabel {
@@ -218,21 +227,27 @@ MouseArea {
}
Rectangle {
id: separator
Item {
id: separatorContainer
visible: mediaControlsMouseArea.nowPlayingLabelsVisible && !mediaControlsMouseArea.hideNowPlayingArea
Layout.fillHeight: true
Layout.leftMargin: visible ? mediaControlsMouseArea.separatorPadding : 0
Layout.rightMargin: visible ? mediaControlsMouseArea.separatorPadding : 0
Layout.topMargin: visible ? mediaControlsMouseArea.separatorPadding : 0
Layout.bottomMargin: visible ? mediaControlsMouseArea.separatorPadding : 0
Layout.leftMargin: visible ? mediaControlsMouseArea.effectiveSeparatorGapLabel : 0
Layout.rightMargin: visible ? mediaControlsMouseArea.effectiveSeparatorGapTrack : 0
Layout.minimumWidth: visible ? 1 : 0
Layout.preferredWidth: visible ? 1 : 0
Layout.maximumWidth: visible ? 1 : 0
Rectangle {
anchors.horizontalCenter: parent.horizontalCenter
anchors.verticalCenter: parent.verticalCenter
width: 1
height: Math.round(parent.height * mediaControlsMouseArea.effectiveSeparatorHeight / 100)
color: mediaControlsMouseArea.effectiveForegroundColor
}
}
ColumnLayout {
id: infoColumn
@@ -240,6 +255,7 @@ MouseArea {
Layout.minimumWidth: 0
Layout.leftMargin: mediaControlsMouseArea.hideNowPlayingArea ? mediaControlsMouseArea.hideModeHorizontalPadding : 0
Layout.rightMargin: mediaControlsMouseArea.hideNowPlayingArea ? mediaControlsMouseArea.hideModeHorizontalPadding : 0
spacing: mediaControlsMouseArea.effectiveTrackTextVerticalSpacing
ShadowedLabel {
Layout.fillWidth: true
@@ -255,7 +271,6 @@ MouseArea {
}
ShadowedLabel {
Layout.maximumWidth: 300
Layout.fillWidth: true
Layout.alignment: mediaControlsMouseArea.labelsOnRight ? Qt.AlignRight : Qt.AlignLeft
shadowEnabled: mediaControlsMouseArea.configuredTextShadowEnabled
package/contents/ui/configGeneral.qml
+45
View File
@@ -17,6 +17,11 @@ KCM.SimpleKCM {
property alias cfg_backgroundRadius: backgroundRadiusSpinBox.value
property alias cfg_foregroundColor: foregroundColorField.text
property alias cfg_textShadowEnabled: textShadowCheckBox.checked
property alias cfg_trackTextVerticalSpacing: trackTextVerticalSpacingSpinBox.value
property alias cfg_labelVerticalSpacing: labelVerticalSpacingSpinBox.value
property alias cfg_separatorGapLabel: separatorGapLabelSpinBox.value
property alias cfg_separatorGapTrack: separatorGapTrackSpinBox.value
property alias cfg_separatorHeight: separatorHeightSpinBox.value
readonly property var availableFonts: Qt.fontFamilies()
readonly property var labelVisibilityOptions: [{
"text": i18n("Auto hide when idle"),
@@ -187,6 +192,46 @@ KCM.SimpleKCM {
text: i18n("Enable")
}
QQC2.SpinBox {
id: trackTextVerticalSpacingSpinBox
Kirigami.FormData.label: i18n("Title/artist spacing:")
from: -12
to: 24
}
QQC2.SpinBox {
id: labelVerticalSpacingSpinBox
Kirigami.FormData.label: i18n("NOW/PLAYING spacing:")
from: -12
to: 24
}
QQC2.SpinBox {
id: separatorGapLabelSpinBox
Kirigami.FormData.label: i18n("Separator gap from labels:")
from: 0
to: 24
}
QQC2.SpinBox {
id: separatorGapTrackSpinBox
Kirigami.FormData.label: i18n("Separator gap from track:")
from: 0
to: 24
}
QQC2.SpinBox {
id: separatorHeightSpinBox
Kirigami.FormData.label: i18n("Separator height (%):")
from: 0
to: 100
}
}
Dialogs.ColorDialog {
package/contents/ui/main.qml
+20
View File
@@ -27,6 +27,16 @@ PlasmoidItem {
property string configuredForegroundColor: plasmoid.configuration.foregroundColor
// qmllint disable missing-property
property bool configuredTextShadowEnabled: plasmoid.configuration.textShadowEnabled
// qmllint disable missing-property
property int configuredTrackTextVerticalSpacing: plasmoid.configuration.trackTextVerticalSpacing
// qmllint disable missing-property
property int configuredLabelVerticalSpacing: plasmoid.configuration.labelVerticalSpacing
// qmllint disable missing-property
property int configuredSeparatorGapLabel: plasmoid.configuration.separatorGapLabel
// qmllint disable missing-property
property int configuredSeparatorGapTrack: plasmoid.configuration.separatorGapTrack
// qmllint disable missing-property
property int configuredSeparatorHeight: plasmoid.configuration.separatorHeight
readonly property int resolvedBackgroundHints: {
if (configuredBackgroundStyle === "default")
return PlasmaCore.Types.DefaultBackground | PlasmaCore.Types.ConfigurableBackground;
@@ -61,6 +71,11 @@ PlasmoidItem {
configuredBackgroundRadius: root.configuredBackgroundRadius
configuredForegroundColor: root.configuredForegroundColor
configuredTextShadowEnabled: root.configuredTextShadowEnabled
configuredTrackTextVerticalSpacing: root.configuredTrackTextVerticalSpacing
configuredLabelVerticalSpacing: root.configuredLabelVerticalSpacing
configuredSeparatorGapLabel: root.configuredSeparatorGapLabel
configuredSeparatorGapTrack: root.configuredSeparatorGapTrack
configuredSeparatorHeight: root.configuredSeparatorHeight
}
compactRepresentation: Representation {
@@ -76,6 +91,11 @@ PlasmoidItem {
configuredBackgroundRadius: root.configuredBackgroundRadius
configuredForegroundColor: root.configuredForegroundColor
configuredTextShadowEnabled: root.configuredTextShadowEnabled
configuredTrackTextVerticalSpacing: root.configuredTrackTextVerticalSpacing
configuredLabelVerticalSpacing: root.configuredLabelVerticalSpacing
configuredSeparatorGapLabel: root.configuredSeparatorGapLabel
configuredSeparatorGapTrack: root.configuredSeparatorGapTrack
configuredSeparatorHeight: root.configuredSeparatorHeight
}
}