decouple background layer plasma shadows svg

--the multilayered background first layer is not
decoupled and is not the parent layer for all the
rest layer. This way we can really hide it without
influence the rest background layers.
pull/20/head
Michail Vourlakos 5 years ago
parent 0d941d05f2
commit 148e3956b1

@ -242,22 +242,12 @@ BackgroundProperties{
id: shadowsSvgItem id: shadowsSvgItem
width: root.isVertical ? background.thickness + totals.shadowsThickness : totals.visualLength width: root.isVertical ? background.thickness + totals.shadowsThickness : totals.visualLength
height: root.isVertical ? totals.visualLength : background.thickness + totals.shadowsThickness height: root.isVertical ? totals.visualLength : background.thickness + totals.shadowsThickness
enabledBorders: latteView && latteView.effects ? latteView.effects.enabledBorders : PlasmaCore.FrameSvg.NoBorder
imagePath: "widgets/panel-background" imagePath: "widgets/panel-background"
prefix: "shadow" prefix: "shadow"
opacity: hideShadow || !root.useThemePanel || (root.forceTransparentPanel && !root.forcePanelForBusyBackground) ? 0 : 1
visible: (opacity == 0) ? false : true visible: (opacity == 0) ? false : true
opacity: {
if ((root.forceTransparentPanel && !root.forcePanelForBusyBackground)
|| !root.useThemePanel)
return 0;
else
return 1;
}
enabledBorders: latteView && latteView.effects && !hideShadow ? latteView.effects.enabledBorders : PlasmaCore.FrameSvg.NoBorder
//! set true by default in order to avoid crash on startup because imagePath is set to "" //! set true by default in order to avoid crash on startup because imagePath is set to ""
readonly property bool themeHasShadow: themeExtended ? themeExtended.hasShadow : true readonly property bool themeHasShadow: themeExtended ? themeExtended.hasShadow : true
@ -287,305 +277,306 @@ BackgroundProperties{
enabled: !LatteCore.WindowSystem.compositingActive enabled: !LatteCore.WindowSystem.compositingActive
NumberAnimation { duration: 0 } NumberAnimation { duration: 0 }
} }
}
//! Layer 2: Provide visual solidness. Plasma themes by design may provide a panel-background svg that is not //! Layer 2: Provide visual solidness. Plasma themes by design may provide a panel-background svg that is not
//! solid. That means that user can not gain full solidness in such cases. This layer is responsible //! solid. That means that user can not gain full solidness in such cases. This layer is responsible
//! to solve the previous mentioned plasma theme limitation. //! to solve the previous mentioned plasma theme limitation.
Colorizer.CustomBackground { Colorizer.CustomBackground {
id: backgroundLowestRectangle id: backgroundLowestRectangle
anchors.fill: solidBackground anchors.fill: solidBackground
opacity: normalizedOpacity opacity: normalizedOpacity
backgroundColor: colorizerManager.backgroundColor backgroundColor: colorizerManager.backgroundColor
roundness: overlayedBackground.roundness roundness: overlayedBackground.roundness
visible: LatteCore.WindowSystem.compositingActive && solidBackground.exceedsThemeOpacityLimits visible: LatteCore.WindowSystem.compositingActive && solidBackground.exceedsThemeOpacityLimits
readonly property real normalizedOpacity: visible ? Math.min(1, (appliedOpacity - solidBackground.themeMaxOpacity)/(1-solidBackground.themeMaxOpacity)) : 0 readonly property real normalizedOpacity: visible ? Math.min(1, (appliedOpacity - solidBackground.themeMaxOpacity)/(1-solidBackground.themeMaxOpacity)) : 0
readonly property real appliedOpacity: visible ? solidBackground.appliedOpacity : 0 readonly property real appliedOpacity: visible ? solidBackground.appliedOpacity : 0
Behavior on opacity{ Behavior on opacity{
enabled: LatteCore.WindowSystem.compositingActive enabled: LatteCore.WindowSystem.compositingActive
NumberAnimation { duration: barLine.animationTime } NumberAnimation { duration: barLine.animationTime }
} }
Behavior on opacity{ Behavior on opacity{
enabled: !LatteCore.WindowSystem.compositingActive enabled: !LatteCore.WindowSystem.compositingActive
NumberAnimation { duration: 0 } NumberAnimation { duration: 0 }
}
} }
}
//! Layer 3: Original Plasma Theme "panel-background" svg. It is used for calculations and also to draw //! Layer 3: Original Plasma Theme "panel-background" svg. It is used for calculations and also to draw
//! the original background when to special settings and options exist from the user. It is also //! the original background when to special settings and options exist from the user. It is also
//! doing one very important job which is to calculate the Effects Rectangle which is used from //! doing one very important job which is to calculate the Effects Rectangle which is used from
//! the compositor to provide blurriness and from Mask calculations to provide the View Local Geometry //! the compositor to provide blurriness and from Mask calculations to provide the View Local Geometry
PlasmaCore.FrameSvgItem{ PlasmaCore.FrameSvgItem{
id: solidBackground id: solidBackground
anchors.leftMargin: LatteCore.WindowSystem.compositingActive ? shadows.left : 0 anchors.leftMargin: LatteCore.WindowSystem.compositingActive ? shadows.left : 0
anchors.rightMargin: LatteCore.WindowSystem.compositingActive ? shadows.right : 0 anchors.rightMargin: LatteCore.WindowSystem.compositingActive ? shadows.right : 0
anchors.topMargin: LatteCore.WindowSystem.compositingActive ? shadows.top : 0 anchors.topMargin: LatteCore.WindowSystem.compositingActive ? shadows.top : 0
anchors.bottomMargin: LatteCore.WindowSystem.compositingActive ? shadows.bottom : 0 anchors.bottomMargin: LatteCore.WindowSystem.compositingActive ? shadows.bottom : 0
anchors.fill:parent anchors.fill: shadowsSvgItem
opacity: normalizedOpacity opacity: normalizedOpacity
readonly property bool exceedsThemeOpacityLimits: appliedOpacity > themeMaxOpacity readonly property bool exceedsThemeOpacityLimits: appliedOpacity > themeMaxOpacity
readonly property bool forceSolidness: root.forceSolidPanel || !LatteCore.WindowSystem.compositingActive readonly property bool forceSolidness: root.forceSolidPanel || !LatteCore.WindowSystem.compositingActive
//! must be normalized to plasma theme maximum opacity //! must be normalized to plasma theme maximum opacity
readonly property real normalizedOpacity: Math.min(1, appliedOpacity / themeMaxOpacity) readonly property real normalizedOpacity: Math.min(1, appliedOpacity / themeMaxOpacity)
readonly property real appliedOpacity: overlayedBackground.backgroundOpacity > 0 && !paintInstantly ? 0 : overlayedBackground.midOpacity readonly property real appliedOpacity: overlayedBackground.backgroundOpacity > 0 && !paintInstantly ? 0 : overlayedBackground.midOpacity
readonly property real themeMaxOpacity: themeExtendedBackground ? themeExtendedBackground.maxOpacity : 1 readonly property real themeMaxOpacity: themeExtendedBackground ? themeExtendedBackground.maxOpacity : 1
//! When switching from overlaied background to regular one this must be done //! When switching from overlaied background to regular one this must be done
//! instantly otherwise the transition is not smooth //! instantly otherwise the transition is not smooth
readonly property bool paintInstantly: (root.hasExpandedApplet && root.plasmaBackgroundForPopups) readonly property bool paintInstantly: (root.hasExpandedApplet && root.plasmaBackgroundForPopups)
|| root.plasmaStyleBusyForTouchingBusyVerticalView || root.plasmaStyleBusyForTouchingBusyVerticalView
property rect efGeometry: Qt.rect(-1,-1,0,0) property rect efGeometry: Qt.rect(-1,-1,0,0)
imagePath: "widgets/panel-background" imagePath: "widgets/panel-background"
property int paddingsWidth: margins.left+margins.right property int paddingsWidth: margins.left+margins.right
property int paddingsHeight: margins.top + margins.bottom property int paddingsHeight: margins.top + margins.bottom
onWidthChanged: updateEffectsArea(); onWidthChanged: updateEffectsArea();
onHeightChanged: updateEffectsArea(); onHeightChanged: updateEffectsArea();
onImagePathChanged: solidBackground.adjustPrefix(); onImagePathChanged: solidBackground.adjustPrefix();
Component.onCompleted: { Component.onCompleted: {
root.updateEffectsArea.connect(updateEffectsArea); root.updateEffectsArea.connect(updateEffectsArea);
adjustPrefix(); adjustPrefix();
} }
Component.onDestruction: { Component.onDestruction: {
root.updateEffectsArea.disconnect(updateEffectsArea); root.updateEffectsArea.disconnect(updateEffectsArea);
} }
//! Fix for FrameSvgItem QML version not updating its margins after a theme change //! Fix for FrameSvgItem QML version not updating its margins after a theme change
//! with this hack we enforce such update. I could use the repaintNeeded signal but //! with this hack we enforce such update. I could use the repaintNeeded signal but
//! it is called more often than the themeChanged one. //! it is called more often than the themeChanged one.
Connections { Connections {
target: themeExtended target: themeExtended
onThemeChanged: { onThemeChanged: {
solidBackground.adjustPrefix(); solidBackground.adjustPrefix();
plasmoid.configuration.panelShadows = !plasmoid.configuration.panelShadows; plasmoid.configuration.panelShadows = !plasmoid.configuration.panelShadows;
plasmoid.configuration.panelShadows = !plasmoid.configuration.panelShadows; plasmoid.configuration.panelShadows = !plasmoid.configuration.panelShadows;
updateEffectsArea(); updateEffectsArea();
}
} }
}
Connections { Connections {
target: latteView ? latteView.visibility : null target: latteView ? latteView.visibility : null
onIsHiddenChanged: solidBackground.updateEffectsArea(); onIsHiddenChanged: solidBackground.updateEffectsArea();
} }
Connections{ Connections{
target: plasmoid target: plasmoid
onLocationChanged: solidBackground.adjustPrefix(); onLocationChanged: solidBackground.adjustPrefix();
} }
function updateEffectsArea() { function updateEffectsArea() {
if (!updateEffectsAreaTimer.running) { if (!updateEffectsAreaTimer.running) {
invUpdateEffectsArea(); invUpdateEffectsArea();
updateEffectsAreaTimer.start(); updateEffectsAreaTimer.start();
}
} }
}
function invUpdateEffectsArea(){ function invUpdateEffectsArea(){
if (!latteView) if (!latteView)
return; return;
if (!LatteCore.WindowSystem.compositingActive) { if (!LatteCore.WindowSystem.compositingActive) {
//! NOCOMPOSITING mode is a special case and Effects Area is also used for //! NOCOMPOSITING mode is a special case and Effects Area is also used for
//! different calculations for View::mask() //! different calculations for View::mask()
var rootGeometry = mapToItem(root, 0, 0); var rootGeometry = mapToItem(root, 0, 0);
efGeometry.x = rootGeometry.x; efGeometry.x = rootGeometry.x;
efGeometry.y = rootGeometry.y; efGeometry.y = rootGeometry.y;
efGeometry.width = width; efGeometry.width = width;
efGeometry.height = height; efGeometry.height = height;
} else {
if (latteView.visibility.isHidden) {
//! valid hide mask
efGeometry.x = -1;
efGeometry.y = -1;
efGeometry.width = 1;
efGeometry.height = 1;
} else { } else {
if (latteView.visibility.isHidden) { if (!root.behaveAsPlasmaPanel) {
//! valid hide mask var rootGeometry = mapToItem(root, 0, 0);
efGeometry.x = -1; efGeometry.x = rootGeometry.x;
efGeometry.y = -1; efGeometry.y = rootGeometry.y;
efGeometry.width = 1;
efGeometry.height = 1;
} else { } else {
if (!root.behaveAsPlasmaPanel) { efGeometry.x = 0;
var rootGeometry = mapToItem(root, 0, 0); efGeometry.y = 0;
efGeometry.x = rootGeometry.x;
efGeometry.y = rootGeometry.y;
} else {
efGeometry.x = 0;
efGeometry.y = 0;
}
efGeometry.width = width;
efGeometry.height = height;
} }
}
latteView.effects.rect = efGeometry;
//! needed both for NOCOMPOSITING environments AND efGeometry.width = width;
//! View::localGeometry calculations efGeometry.height = height;
visibilityManager.updateMaskArea(); }
}
Timer {
id: updateEffectsAreaTimer
interval: 16 //! 60Hz or 60calls/sec
onTriggered: solidBackground.invUpdateEffectsArea();
} }
onRepaintNeeded: { latteView.effects.rect = efGeometry;
if (root.behaveAsPlasmaPanel)
adjustPrefix();
}
enabledBorders: latteView && latteView.effects ? latteView.effects.enabledBorders : PlasmaCore.FrameSvg.NoBorder //! needed both for NOCOMPOSITING environments AND
//! View::localGeometry calculations
visibilityManager.updateMaskArea();
}
Behavior on opacity{ Timer {
enabled: LatteCore.WindowSystem.compositingActive && !solidBackground.paintInstantly id: updateEffectsAreaTimer
NumberAnimation { duration: barLine.animationTime } interval: 16 //! 60Hz or 60calls/sec
} onTriggered: solidBackground.invUpdateEffectsArea();
}
Behavior on opacity{ onRepaintNeeded: {
enabled: !LatteCore.WindowSystem.compositingActive if (root.behaveAsPlasmaPanel)
NumberAnimation { duration: 0 } adjustPrefix();
} }
function adjustPrefix() { enabledBorders: latteView && latteView.effects ? latteView.effects.enabledBorders : PlasmaCore.FrameSvg.NoBorder
if (!plasmoid) {
return "";
}
var pre;
switch (plasmoid.location) {
case PlasmaCore.Types.LeftEdge:
pre = "west";
break;
case PlasmaCore.Types.TopEdge:
pre = "north";
break;
case PlasmaCore.Types.RightEdge:
pre = "east";
break;
case PlasmaCore.Types.BottomEdge:
pre = "south";
break;
default:
prefix = "";
}
prefix = [pre, ""]; Behavior on opacity{
} enabled: LatteCore.WindowSystem.compositingActive && !solidBackground.paintInstantly
NumberAnimation { duration: barLine.animationTime }
} }
//! Layer 4: Plasma theme design does not provide a way to colorize the background. This layer Behavior on opacity{
//! solves this by providing a custom background layer that respects the Colorizer palette enabled: !LatteCore.WindowSystem.compositingActive
Colorizer.CustomBackground { NumberAnimation { duration: 0 }
id: overlayedBackground }
anchors.fill: solidBackground
readonly property bool busyBackground: root.forcePanelForBusyBackground function adjustPrefix() {
&& (solidBackground.opacity === 0 || !solidBackground.paintInstantly) if (!plasmoid) {
readonly property bool coloredView: colorizerManager.mustBeShown && colorizerManager.applyTheme !== theme return "";
}
var pre;
switch (plasmoid.location) {
case PlasmaCore.Types.LeftEdge:
pre = "west";
break;
case PlasmaCore.Types.TopEdge:
pre = "north";
break;
case PlasmaCore.Types.RightEdge:
pre = "east";
break;
case PlasmaCore.Types.BottomEdge:
pre = "south";
break;
default:
prefix = "";
}
prefix = [pre, ""];
}
}
backgroundOpacity: { //! Layer 4: Plasma theme design does not provide a way to colorize the background. This layer
if (busyBackground && !forceSolidness) { //! solves this by providing a custom background layer that respects the Colorizer palette
return plasmoid.configuration.panelTransparency / 100; Colorizer.CustomBackground {
} id: overlayedBackground
anchors.fill: solidBackground
if (coloredView || customShadowedRectangleIsEnabled) { readonly property bool busyBackground: root.forcePanelForBusyBackground
return midOpacity; && (solidBackground.opacity === 0 || !solidBackground.paintInstantly)
} readonly property bool coloredView: colorizerManager.mustBeShown && colorizerManager.applyTheme !== theme
return 0; backgroundOpacity: {
if (busyBackground && !forceSolidness) {
return plasmoid.configuration.panelTransparency / 100;
} }
backgroundColor: colorizerManager.backgroundColor if (coloredView || customShadowedRectangleIsEnabled) {
borderColor: backgroundColor /*disabled in favor of Layer 5*/ return midOpacity;
borderWidth: 1 /*disabled in favor of Layer 5*/
shadowColor: customShadowColor
shadowSize: {
if (!customShadowIsEnabled) {
return 0;
}
//! WORKAROUND: Kirigami.ShadowedRectangle does not respect the specified shadowed size
//! when the shadow size is bigger than background thickness. In such case the ShadowedRectangle
//! produced shadowed is much bigger than the specified one
var minaxis = Math.min(solidBackground.height, solidBackground.width)
return customShadow > minaxis ? minaxis : customShadow;
} }
roundness: { return 0;
if (customRadiusIsEnabled) { }
return customRadius;
}
return themeExtendedBackground ? themeExtendedBackground.roundness : 0 backgroundColor: colorizerManager.backgroundColor
borderColor: backgroundColor /*disabled in favor of Layer 5*/
borderWidth: 1 /*disabled in favor of Layer 5*/
shadowColor: customShadowColor
shadowSize: {
if (!customShadowIsEnabled) {
return 0;
} }
property real midOpacity: { //! WORKAROUND: Kirigami.ShadowedRectangle does not respect the specified shadowed size
if (forceSolidness) { //! when the shadow size is bigger than background thickness. In such case the ShadowedRectangle
return 1; //! produced shadowed is much bigger than the specified one
} else if (!root.userShowPanelBackground || root.forcePanelForBusyBackground || root.forceTransparentPanel) { var minaxis = Math.min(solidBackground.height, solidBackground.width)
return 0; return customShadow > minaxis ? minaxis : customShadow;
} else { }
return plasmoid.configuration.panelTransparency / 100;
} roundness: {
if (customRadiusIsEnabled) {
return customRadius;
} }
readonly property bool forceSolidness: root.forceSolidPanel || !LatteCore.WindowSystem.compositingActive return themeExtendedBackground ? themeExtendedBackground.roundness : 0
}
Behavior on backgroundOpacity{ property real midOpacity: {
enabled: LatteCore.WindowSystem.compositingActive if (forceSolidness) {
NumberAnimation { duration: barLine.animationTime } return 1;
} else if (!root.userShowPanelBackground || root.forcePanelForBusyBackground || root.forceTransparentPanel) {
return 0;
} else {
return plasmoid.configuration.panelTransparency / 100;
} }
}
Behavior on backgroundOpacity{ readonly property bool forceSolidness: root.forceSolidPanel || !LatteCore.WindowSystem.compositingActive
enabled: !LatteCore.WindowSystem.compositingActive
NumberAnimation { duration: 0 }
}
Behavior on backgroundColor{ Behavior on backgroundOpacity{
enabled: LatteCore.WindowSystem.compositingActive enabled: LatteCore.WindowSystem.compositingActive
ColorAnimation { duration: barLine.animationTime } NumberAnimation { duration: barLine.animationTime }
} }
Behavior on backgroundColor{ Behavior on backgroundOpacity{
enabled: !LatteCore.WindowSystem.compositingActive enabled: !LatteCore.WindowSystem.compositingActive
ColorAnimation { duration: 0 } NumberAnimation { duration: 0 }
}
} }
//! Layer 5: Plasma theme design does not provide a way to draw background outline on demand. This layer Behavior on backgroundColor{
//! solves this by providing a custom background layer that only draws an outline on top of all enabled: LatteCore.WindowSystem.compositingActive
//! previous layers ColorAnimation { duration: barLine.animationTime }
Loader{ }
anchors.fill: solidBackground
active: root.panelOutline && !(root.hasExpandedApplet && root.plasmaBackgroundForPopups) Behavior on backgroundColor{
sourceComponent: Colorizer.CustomBackground{ enabled: !LatteCore.WindowSystem.compositingActive
backgroundColor: "transparent" ColorAnimation { duration: 0 }
borderColor: colorizerManager.outlineColor
borderWidth: themeExtended ? themeExtended.outlineWidth : 1
roundness: overlayedBackground.roundness
}
} }
}
//! CustomBackground debugger //! Layer 5: Plasma theme design does not provide a way to draw background outline on demand. This layer
/*Colorizer.CustomBackground { //! solves this by providing a custom background layer that only draws an outline on top of all
anchors.fill: solidBackground //! previous layers
Loader{
anchors.fill: solidBackground
active: root.panelOutline && !(root.hasExpandedApplet && root.plasmaBackgroundForPopups)
sourceComponent: Colorizer.CustomBackground{
backgroundColor: "transparent" backgroundColor: "transparent"
borderWidth: 1 borderColor: colorizerManager.outlineColor
borderColor: "red" borderWidth: themeExtended ? themeExtended.outlineWidth : 1
roundness: overlayedBackground.roundness roundness: overlayedBackground.roundness
}*/ }
} }
//! CustomBackground debugger
/*Colorizer.CustomBackground {
anchors.fill: solidBackground
backgroundColor: "transparent"
borderWidth: 1
borderColor: "red"
roundness: overlayedBackground.roundness
}*/
//BEGIN states //BEGIN states
//user set Panel Positions //user set Panel Positions
//0-Center, 1-Left, 2-Right, 3-Top, 4-Bottom //0-Center, 1-Left, 2-Right, 3-Top, 4-Bottom

Loading…
Cancel
Save