nova-shell/modules/Osd.qml
2026-04-12 16:08:23 +02:00

119 lines
3.3 KiB
QML

import QtQuick
import Quickshell
import Quickshell.Wayland
import "." as M
// OSD overlay — slides out from the bar, centered on screen.
PanelWindow {
id: root
required property var screen
visible: _winVisible
color: "transparent"
property bool _winVisible: false
property bool _shown: M.OsdState.visible
on_ShownChanged: {
if (_shown) {
_winVisible = true;
hideAnim.stop();
showAnim.start();
} else {
showAnim.stop();
hideAnim.start();
}
}
WlrLayershell.layer: WlrLayer.Overlay
WlrLayershell.exclusiveZone: 0
WlrLayershell.namespace: "nova-osd"
mask: Region {}
anchors.top: true
anchors.left: true
margins.top: 0
margins.left: Math.round((screen.width - implicitWidth) / 2)
implicitWidth: 200
implicitHeight: 48
ParallelAnimation {
id: showAnim
NumberAnimation { target: content; property: "opacity"; to: 1; duration: 150; easing.type: Easing.OutCubic }
NumberAnimation { target: content; property: "y"; to: 0; duration: 200; easing.type: Easing.OutCubic }
}
ParallelAnimation {
id: hideAnim
NumberAnimation { target: content; property: "opacity"; to: 0; duration: 250; easing.type: Easing.InCubic }
NumberAnimation { target: content; property: "y"; to: -content.height; duration: 250; easing.type: Easing.InCubic }
onFinished: root._winVisible = false
}
Item {
id: content
anchors.left: parent.left
anchors.right: parent.right
height: root.implicitHeight
opacity: 0
y: -height
Rectangle {
anchors.fill: parent
color: M.Theme.base00
opacity: Math.max(M.Theme.barOpacity, 0.85)
topLeftRadius: 0
topRightRadius: 0
bottomLeftRadius: M.Theme.radius
bottomRightRadius: M.Theme.radius
}
Row {
anchors.centerIn: parent
spacing: 10
Text {
text: M.OsdState.icon
color: M.Theme.base0D
font.pixelSize: M.Theme.fontSize + 6
font.family: M.Theme.iconFontFamily
anchors.verticalCenter: parent.verticalCenter
}
Item {
width: 120
height: 6
anchors.verticalCenter: parent.verticalCenter
Rectangle {
anchors.fill: parent
color: M.Theme.base02
radius: 3
}
Rectangle {
width: parent.width * Math.min(1, Math.max(0, M.OsdState.value))
height: parent.height
color: M.Theme.base0D
radius: 3
Behavior on width {
NumberAnimation { duration: 120; easing.type: Easing.OutCubic }
}
}
}
Text {
text: Math.round(M.OsdState.value * 100) + "%"
color: M.Theme.base05
font.pixelSize: M.Theme.fontSize
font.family: M.Theme.fontFamily
anchors.verticalCenter: parent.verticalCenter
width: 32
}
}
}
}