mirror of
https://github.com/AvengeMedia/DankMaterialShell.git
synced 2026-04-11 00:02:28 -04:00
feat: Implement Material Design 3 elevation and shadow effects
- Added global toggle for enabling M3 elevation & shadow effects - Refactored various components to sync updated specs
This commit is contained in:
@@ -98,7 +98,7 @@ Item {
|
||||
sourceComponent: IconImage {
|
||||
anchors.fill: parent
|
||||
source: root.iconPath
|
||||
backer.sourceSize: Qt.size(root.iconSize, root.iconSize)
|
||||
backer.sourceSize: Qt.size(root.iconSize * 2, root.iconSize * 2)
|
||||
mipmap: true
|
||||
asynchronous: true
|
||||
visible: status === Image.Ready
|
||||
|
||||
@@ -81,6 +81,8 @@ Rectangle {
|
||||
mipmap: true
|
||||
cache: true
|
||||
visible: false
|
||||
sourceSize.width: Math.max(width * 2, 128)
|
||||
sourceSize.height: Math.max(height * 2, 128)
|
||||
source: !root.shouldProbe ? root.imageSource : ""
|
||||
}
|
||||
|
||||
|
||||
@@ -263,10 +263,10 @@ Item {
|
||||
|
||||
layer.enabled: true
|
||||
layer.effect: MultiEffect {
|
||||
shadowEnabled: true
|
||||
shadowBlur: 0.4
|
||||
shadowColor: Theme.shadowStrong
|
||||
shadowVerticalOffset: 4
|
||||
shadowEnabled: Theme.elevationEnabled
|
||||
shadowBlur: Theme.elevationEnabled ? Math.max(0, Math.min(1, (Theme.elevationLevel2 && Theme.elevationLevel2.blurPx !== undefined ? Theme.elevationLevel2.blurPx : 8) / Theme.elevationBlurMax)) : 0
|
||||
shadowColor: Theme.elevationShadowColor(Theme.elevationLevel2)
|
||||
shadowVerticalOffset: Theme.elevationLevel2 && Theme.elevationLevel2.offsetY !== undefined ? Theme.elevationLevel2.offsetY : 4
|
||||
}
|
||||
|
||||
Column {
|
||||
|
||||
@@ -135,13 +135,14 @@ Rectangle {
|
||||
color: Theme.surface
|
||||
radius: Theme.cornerRadius
|
||||
|
||||
layer.enabled: true
|
||||
layer.enabled: Theme.elevationEnabled
|
||||
layer.effect: MultiEffect {
|
||||
shadowEnabled: true
|
||||
shadowColor: Theme.shadowStrong
|
||||
shadowBlur: 0.8
|
||||
shadowEnabled: Theme.elevationEnabled
|
||||
shadowColor: Theme.elevationShadowColor(Theme.elevationLevel2)
|
||||
shadowBlur: Theme.elevationEnabled ? Math.max(0, Math.min(1, (Theme.elevationLevel2 && Theme.elevationLevel2.blurPx !== undefined ? Theme.elevationLevel2.blurPx : 8) / Theme.elevationBlurMax)) : 0
|
||||
shadowHorizontalOffset: 0
|
||||
shadowVerticalOffset: 4
|
||||
shadowVerticalOffset: Theme.elevationLevel2 && Theme.elevationLevel2.offsetY !== undefined ? Theme.elevationLevel2.offsetY : 4
|
||||
shadowOpacity: Theme.elevationLevel2 && Theme.elevationLevel2.alpha !== undefined ? Theme.elevationLevel2.alpha : 0.25
|
||||
}
|
||||
|
||||
Rectangle {
|
||||
|
||||
@@ -257,9 +257,10 @@ PanelWindow {
|
||||
scale: shouldBeVisible ? 1 : 0.9
|
||||
|
||||
property bool childHovered: false
|
||||
property real shadowBlurPx: 10
|
||||
property real shadowSpreadPx: 0
|
||||
property real shadowBaseAlpha: 0.60
|
||||
readonly property var elev: Theme.elevationLevel3
|
||||
property real shadowBlurPx: elev && elev.blurPx !== undefined ? elev.blurPx : 12
|
||||
property real shadowSpreadPx: elev && elev.spreadPx !== undefined ? elev.spreadPx : 0
|
||||
property real shadowBaseAlpha: elev && elev.alpha !== undefined ? elev.alpha : 0.3
|
||||
readonly property real popupSurfaceAlpha: SettingsData.popupTransparency
|
||||
readonly property real effectiveShadowAlpha: shouldBeVisible ? Math.max(0, Math.min(1, shadowBaseAlpha * popupSurfaceAlpha)) : 0
|
||||
|
||||
@@ -277,12 +278,12 @@ PanelWindow {
|
||||
id: bgShadowLayer
|
||||
anchors.fill: parent
|
||||
visible: osdContainer.popupSurfaceAlpha >= 0.95
|
||||
layer.enabled: Quickshell.env("DMS_DISABLE_LAYER") !== "true" && Quickshell.env("DMS_DISABLE_LAYER") !== "1"
|
||||
layer.enabled: Theme.elevationEnabled && Quickshell.env("DMS_DISABLE_LAYER") !== "true" && Quickshell.env("DMS_DISABLE_LAYER") !== "1"
|
||||
layer.smooth: false
|
||||
layer.textureSize: Qt.size(Math.round(width * root.dpr), Math.round(height * root.dpr))
|
||||
layer.textureMirroring: ShaderEffectSource.MirrorVertically
|
||||
|
||||
readonly property int blurMax: 64
|
||||
readonly property int blurMax: Theme.elevationBlurMax
|
||||
|
||||
layer.effect: MultiEffect {
|
||||
id: shadowFx
|
||||
|
||||
@@ -493,14 +493,15 @@ Item {
|
||||
x: contentWrapper.x
|
||||
y: contentWrapper.y
|
||||
|
||||
property real shadowBlurPx: 10
|
||||
property real shadowSpreadPx: 0
|
||||
property real shadowBaseAlpha: 0.60
|
||||
readonly property var elev: Theme.elevationLevel3
|
||||
property real shadowBlurPx: elev && elev.blurPx !== undefined ? elev.blurPx : 12
|
||||
property real shadowSpreadPx: elev && elev.spreadPx !== undefined ? elev.spreadPx : 0
|
||||
property real shadowBaseAlpha: elev && elev.alpha !== undefined ? elev.alpha : 0.3
|
||||
readonly property real popupSurfaceAlpha: SettingsData.popupTransparency
|
||||
readonly property real effectiveShadowAlpha: Math.max(0, Math.min(1, shadowBaseAlpha * popupSurfaceAlpha))
|
||||
readonly property int blurMax: 64
|
||||
readonly property int blurMax: Theme.elevationBlurMax
|
||||
|
||||
layer.enabled: Quickshell.env("DMS_DISABLE_LAYER") !== "true" && Quickshell.env("DMS_DISABLE_LAYER") !== "1" && !(root.suspendShadowWhileResizing && root._resizeActive)
|
||||
layer.enabled: Theme.elevationEnabled && Quickshell.env("DMS_DISABLE_LAYER") !== "true" && Quickshell.env("DMS_DISABLE_LAYER") !== "1" && !(root.suspendShadowWhileResizing && root._resizeActive)
|
||||
layer.smooth: false
|
||||
|
||||
layer.effect: MultiEffect {
|
||||
@@ -511,10 +512,8 @@ Item {
|
||||
maskEnabled: false
|
||||
shadowBlur: Math.max(0, Math.min(1, shadowSource.shadowBlurPx / shadowSource.blurMax))
|
||||
shadowScale: 1 + (2 * shadowSource.shadowSpreadPx) / Math.max(1, Math.min(shadowSource.width, shadowSource.height))
|
||||
shadowColor: {
|
||||
const baseColor = Theme.isLightMode ? Qt.rgba(0, 0, 0, 1) : Theme.surfaceContainerHighest;
|
||||
return Theme.withAlpha(baseColor, shadowSource.effectiveShadowAlpha);
|
||||
}
|
||||
shadowVerticalOffset: parent.elev && parent.elev.offsetY !== undefined ? parent.elev.offsetY : 6
|
||||
shadowColor: Theme.elevationShadowColor(Theme.elevationLevel3)
|
||||
}
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user