Salastil/DankMaterialShell
1
0
Fork 0
mirror of https://github.com/AvengeMedia/DankMaterialShell.git synced 2026-10-18 09:14:01 -04:00
Code Packages Releases Activity

refactor(media): re-add wallpaper blur to island media & misc tweaks

Browse Source 
- New Wallpaper on/off toggle in the Media Player tab for Dashboard and Island Media
This commit is contained in:
purian23
2026-09-03 01:28:05 -04:00
parent 1d2ba798b0
commit ab1e57dda5
9 changed files with 117 additions and 46 deletions
Download Patch File Download Diff File Expand all files Collapse all files
quickshell/Common/SettingsData.qml
+1
View File
@@ -509,6 +509,7 @@ Singleton {
property bool mediaAdaptiveWidthEnabled: true
property bool audioVisualizerEnabled: true
property bool mediaUseAlbumArtAccent: false
property bool mediaWallpaperEnabled: true
property bool appleMusicAnimatedArtEnabled: false
property string audioScrollMode: "volume"
property int audioWheelScrollAmount: 5
quickshell/Common/settings/SettingsSpec.js
+1
View File
@@ -228,6 +228,7 @@ var SPEC = {
mediaAdaptiveWidthEnabled: { def: true },
audioVisualizerEnabled: { def: true },
mediaUseAlbumArtAccent: { def: false },
mediaWallpaperEnabled: { def: true },
appleMusicAnimatedArtEnabled: { def: false },
audioScrollMode: { def: "volume" },
audioWheelScrollAmount: { def: 5 },
quickshell/Modules/DankDash/MediaPlayerDashChrome.qml
+7 -3
View File
@@ -17,10 +17,14 @@ Item {
implicitHeight: playerContent.height + playerContent.anchors.topMargin * 2
MediaArtBackdrop {
Loader {
anchors.fill: parent
activePlayer: root.player.activePlayer
onArtReady: root.player.maybeFinishSwitch()
active: root.player.wallpaperEnabled
sourceComponent: MediaArtBackdrop {
activePlayer: root.player.activePlayer
onArtReady: root.player.maybeFinishSwitch()
}
}
MediaPlayerEmptyState {
quickshell/Modules/DankDash/MediaPlayerIslandChrome.qml
+63 -40
View File
@@ -3,6 +3,7 @@ pragma ComponentBehavior: Bound
import QtQuick
import Quickshell.Services.Mpris
import Quickshell.Services.Pipewire
import Quickshell.Widgets
import qs.Common
import qs.Services
import qs.Widgets
@@ -35,6 +36,11 @@ Item {
readonly property real cardMargin: 18
readonly property real artSize: 150
readonly property real seekBlockHeight: 42
readonly property real seekbarHeight: 22
readonly property real seekWidthRatio: 0.9
readonly property real seekGapTop: 32
readonly property real seekGapBottom: 16
readonly property real seekTopMargin: root.seekGapTop - root.seekbarHeight / 2
readonly property real transportHeight: 56
readonly property real groupButtonSize: 44
readonly property real groupOuterRadius: root.groupButtonSize / 2
@@ -53,7 +59,7 @@ Item {
}
return 0;
}
readonly property real baseHeight: root.cardMargin * 2 + root.artSize + root.seekBlockHeight + root.transportHeight + Theme.spacingM * 2
readonly property real baseHeight: root.cardMargin * 2 + root.artSize + root.seekTopMargin + root.seekBlockHeight + root.seekGapBottom + root.transportHeight
implicitHeight: root.baseHeight + (root.panel !== "" ? Theme.spacingM + root.panelHeight : 0)
@@ -73,6 +79,18 @@ Item {
root.panel = "";
}
Loader {
anchors.fill: parent
active: root.player.wallpaperEnabled
sourceComponent: MediaArtBackdrop {
radius: 30
stableHeight: root.baseHeight
activePlayer: root.activePlayer
onArtReady: root.player.maybeFinishSwitch()
}
}
MediaPlayerEmptyState {
anchors.centerIn: parent
visible: root.player.showNoPlayerNow
@@ -111,58 +129,63 @@ Item {
artUrl: root.artUrl
}
Row {
ClippingRectangle {
id: buttonGroup
anchors {
right: parent.right
top: parent.top
}
spacing: Theme.spacingXXS
width: buttonRow.width
height: root.groupButtonSize
color: "transparent"
radius: root.groupOuterRadius
GroupButton {
id: volumeButton
Row {
id: buttonRow
panelId: "volume"
topLeftRadius: root.groupOuterRadius
bottomLeftRadius: root.groupOuterRadius
iconName: root.player.getVolumeIcon()
enabled: root.player.volumeAvailable
spacing: Theme.spacingXXS
MouseArea {
anchors.fill: parent
acceptedButtons: Qt.NoButton
onWheel: wheelEvent => {
wheelEvent.accepted = true;
root.player.adjustVolume((wheelEvent.angleDelta.y > 0 ? 1 : -1) * AudioService.wheelVolumeStep);
GroupButton {
id: volumeButton
panelId: "volume"
iconName: root.player.getVolumeIcon()
enabled: root.player.volumeAvailable
MouseArea {
anchors.fill: parent
acceptedButtons: Qt.NoButton
onWheel: wheelEvent => {
wheelEvent.accepted = true;
root.player.adjustVolume((wheelEvent.angleDelta.y > 0 ? 1 : -1) * AudioService.wheelVolumeStep);
}
}
}
}
GroupButton {
id: outputButton
GroupButton {
id: outputButton
panelId: "devices"
iconName: root.player.getAudioDeviceIcon(AudioService.sink)
panelId: "devices"
iconName: root.player.getAudioDeviceIcon(AudioService.sink)
MouseArea {
anchors.fill: parent
acceptedButtons: Qt.NoButton
onWheel: wheelEvent => {
wheelEvent.accepted = true;
AudioService.cycleAudioOutputDirection(wheelEvent.angleDelta.y < 0);
MouseArea {
anchors.fill: parent
acceptedButtons: Qt.NoButton
onWheel: wheelEvent => {
wheelEvent.accepted = true;
AudioService.cycleAudioOutputDirection(wheelEvent.angleDelta.y < 0);
}
}
}
}
GroupButton {
id: sourceButton
GroupButton {
id: sourceButton
panelId: "players"
topRightRadius: root.groupOuterRadius
bottomRightRadius: root.groupOuterRadius
visible: (root.player.allPlayers?.length || 0) > 0
iconName: "assistant_device"
panelId: "players"
visible: (root.player.allPlayers?.length || 0) > 0
iconName: "assistant_device"
}
}
}
@@ -215,17 +238,17 @@ Item {
id: seekBlock
anchors {
left: parent.left
right: parent.right
horizontalCenter: parent.horizontalCenter
top: header.bottom
topMargin: Theme.spacingM
topMargin: root.seekTopMargin
}
width: Math.round(parent.width * root.seekWidthRatio)
height: root.seekBlockHeight
DankSeekbar {
anchors.top: parent.top
width: parent.width
height: 22
height: root.seekbarHeight
activePlayer: root.activePlayer
stableLength: root.player.stableLength
accentColor: root.accent
@@ -268,7 +291,7 @@ Item {
anchors {
horizontalCenter: parent.horizontalCenter
top: seekBlock.bottom
topMargin: Theme.spacingM
topMargin: root.seekGapBottom
}
height: root.transportHeight
spacing: Theme.spacingS
quickshell/Modules/DankDash/MediaPlayerTab.qml
+1
View File
@@ -23,6 +23,7 @@ Item {
property bool live: Window.window?.visible ?? false
property bool menusEnabled: true
property string chrome: "dash"
property bool wallpaperEnabled: SettingsData.mediaWallpaperEnabled
readonly property bool islandChrome: chrome === "island"
readonly property color accent: MediaAccentService.accent
quickshell/Modules/DankIsland/IslandContentHost.qml
+1
View File
@@ -188,6 +188,7 @@ Item {
id: mediaExpandedLoader
activity: "media"
height: Math.max(target.height, root.height)
active: root.mediaSurfaceActive && (root.expanded || root.expandedFade > 0)
asynchronous: false
sourceComponent: root.mediaExpandedComponent
quickshell/Modules/Settings/MediaPlayerTab.qml
+9
View File
@@ -73,6 +73,15 @@ Item {
onToggled: checked => SettingsData.set("mediaAdaptiveWidthEnabled", checked)
}
SettingsToggleRow {
settingKey: "mediaWallpaper"
tags: ["wallpaper", "art", "album", "backdrop", "background", "blur"]
text: I18n.tr("Wallpaper")
description: I18n.tr("Blur the album art behind the media player")
checked: SettingsData.mediaWallpaperEnabled
onToggled: checked => SettingsData.set("mediaWallpaperEnabled", checked)
}
SettingsToggleRow {
settingKey: "mediaAlbumArtAccent"
tags: ["album", "art", "accent", "colors"]
quickshell/Widgets/MediaArtBackdrop.qml
+7 -3
View File
@@ -12,6 +12,10 @@ Item {
property real radius: Theme.cornerRadius
property real artOpacity: 0.7
property real surfaceTint: 0.3
property real stableHeight: 0
readonly property bool pinned: root.stableHeight > 0
readonly property real anchorHeight: root.pinned ? root.stableHeight : root.height
signal artReady
@@ -101,8 +105,7 @@ Item {
Image {
id: layerImg
anchors.centerIn: parent
width: Math.max(parent.width, parent.height) * 1.1
width: Math.max(parent.width, root.anchorHeight) * 1.1
height: width
fillMode: Image.PreserveAspectCrop
asynchronous: true
@@ -115,7 +118,8 @@ Item {
}
MultiEffect {
anchors.centerIn: parent
x: (parent.width - width) / 2
y: root.pinned ? 0 : (parent.height - height) / 2
width: layerImg.width
height: layerImg.height
source: layerImg
quickshell/translations/settings_search_index.json
+27
View File
@@ -6988,6 +6988,33 @@
],
"description": "Use colors extracted from album art instead of system theme colors"
},
{
"section": "mediaWallpaper",
"label": "Wallpaper",
"tabIndex": 16,
"category": "Media Player",
"keywords": [
"album",
"art",
"audio",
"backdrop",
"background",
"behind",
"bg",
"blur",
"desktop",
"image",
"media",
"mpris",
"music",
"picture",
"playback",
"player",
"spotify",
"wallpaper"
],
"description": "Blur the album art behind the media player"
},
{
"section": "mediaWaveProgress",
"label": "Wave Progress Bars",