mirror of
https://invent.kde.org/marcoa/shift-shell.git
synced 2026-07-31 00:34:45 +00:00
actiondrawer: Draw our own background
Draw our own background in the action drawer instead of using the svg, because it loads faster when visible: true/false is set, and we do a bunch of resizing animations.
This commit is contained in:
parent
c4f11d2f01
commit
19ea9f5164
2 changed files with 62 additions and 8 deletions
|
|
@ -57,10 +57,42 @@ MobileShell.BaseItem {
|
||||||
rightPadding: Kirigami.Units.smallSpacing
|
rightPadding: Kirigami.Units.smallSpacing
|
||||||
bottomPadding: Kirigami.Units.smallSpacing * 4
|
bottomPadding: Kirigami.Units.smallSpacing * 4
|
||||||
|
|
||||||
background: KSvg.FrameSvgItem {
|
background: Item {
|
||||||
enabledBorders: KSvg.FrameSvgItem.BottomBorder
|
Rectangle {
|
||||||
imagePath: "widgets/background"
|
id: background
|
||||||
opacity: brightnessPressedValue
|
anchors.fill: parent
|
||||||
|
anchors.bottomMargin: shadow.height
|
||||||
|
color: Kirigami.Theme.backgroundColor
|
||||||
|
opacity: brightnessPressedValue
|
||||||
|
}
|
||||||
|
|
||||||
|
Rectangle {
|
||||||
|
id: separator
|
||||||
|
anchors.bottom: background.bottom
|
||||||
|
anchors.left: parent.left
|
||||||
|
anchors.right: parent.right
|
||||||
|
antialiasing: true
|
||||||
|
|
||||||
|
// Only show separator on dark background
|
||||||
|
visible: (Kirigami.ColorUtils.brightnessForColor(background.color)) === Kirigami.ColorUtils.Dark ? 1 : 0
|
||||||
|
height: 1
|
||||||
|
color: Kirigami.ColorUtils.tintWithAlpha(Kirigami.Theme.textColor, Kirigami.Theme.backgroundColor, 0.9)
|
||||||
|
}
|
||||||
|
|
||||||
|
Rectangle {
|
||||||
|
id: shadow
|
||||||
|
anchors.top: background.bottom
|
||||||
|
anchors.left: parent.left
|
||||||
|
anchors.right: parent.right
|
||||||
|
height: Kirigami.Units.largeSpacing
|
||||||
|
opacity: 0.1
|
||||||
|
|
||||||
|
gradient: Gradient {
|
||||||
|
orientation: Gradient.Vertical
|
||||||
|
GradientStop { position: 0.0; color: 'black' }
|
||||||
|
GradientStop { position: 1.0; color: 'transparent' }
|
||||||
|
}
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
contentItem: Item {
|
contentItem: Item {
|
||||||
|
|
|
||||||
|
|
@ -4,6 +4,7 @@
|
||||||
import QtQuick
|
import QtQuick
|
||||||
import QtQuick.Controls as QQC2
|
import QtQuick.Controls as QQC2
|
||||||
import QtQuick.Layouts
|
import QtQuick.Layouts
|
||||||
|
import QtQuick.Effects
|
||||||
|
|
||||||
import org.kde.kirigami 2.12 as Kirigami
|
import org.kde.kirigami 2.12 as Kirigami
|
||||||
import org.kde.ksvg 1.0 as KSvg
|
import org.kde.ksvg 1.0 as KSvg
|
||||||
|
|
@ -43,10 +44,31 @@ MobileShell.BaseItem {
|
||||||
rightPadding: Kirigami.Units.smallSpacing * 4
|
rightPadding: Kirigami.Units.smallSpacing * 4
|
||||||
bottomPadding: Kirigami.Units.smallSpacing * 4
|
bottomPadding: Kirigami.Units.smallSpacing * 4
|
||||||
|
|
||||||
background: KSvg.FrameSvgItem {
|
background: Item {
|
||||||
enabledBorders: KSvg.FrameSvgItem.AllBorders
|
Rectangle {
|
||||||
imagePath: "widgets/background"
|
id: background
|
||||||
opacity: brightnessPressedValue
|
anchors.fill: parent
|
||||||
|
anchors.margins: Kirigami.Units.largeSpacing
|
||||||
|
color: Kirigami.Theme.backgroundColor
|
||||||
|
opacity: brightnessPressedValue
|
||||||
|
visible: false
|
||||||
|
|
||||||
|
radius: Kirigami.Units.cornerRadius
|
||||||
|
|
||||||
|
// Only show border on dark background
|
||||||
|
border.color: Kirigami.ColorUtils.tintWithAlpha(Kirigami.Theme.textColor, Kirigami.Theme.backgroundColor, 0.9)
|
||||||
|
border.width: (Kirigami.ColorUtils.brightnessForColor(color)) === Kirigami.ColorUtils.Dark ? 1 : 0
|
||||||
|
border.pixelAligned: false
|
||||||
|
}
|
||||||
|
|
||||||
|
MultiEffect {
|
||||||
|
anchors.fill: background
|
||||||
|
source: background
|
||||||
|
blurMax: 16
|
||||||
|
shadowEnabled: true
|
||||||
|
shadowOpacity: 0.5
|
||||||
|
shadowColor: Qt.darker(Kirigami.Theme.backgroundColor, 1.9)
|
||||||
|
}
|
||||||
}
|
}
|
||||||
|
|
||||||
contentItem: Item {
|
contentItem: Item {
|
||||||
|
|
|
||||||
Loading…
Reference in a new issue