more work on popups

This commit is contained in:
kossLAN 2025-08-11 14:26:12 -04:00
parent 9cc386b5b5
commit ec04d07e24
Signed by: kossLAN
SSH key fingerprint: SHA256:bdV0x+wdQHGJ6LgmstH3KV8OpWY+OOFmJcPcB0wQPV8
6 changed files with 134 additions and 125 deletions

View file

@ -63,7 +63,6 @@ Variants {
Layout.alignment: Qt.AlignRight
SysTray {
id: sysTray
bar: root
Layout.fillHeight: true
}
@ -77,8 +76,8 @@ Variants {
// Layout.bottomMargin: 2
// }
// BatteryIndicator {
// id: batteryIndicator
// PowerMenu {
// bar: root
// Layout.fillHeight: true
// }

View file

@ -30,13 +30,13 @@ Scope {
if (lastActiveItem != null && lastActiveItem != activeItem) {
lastActiveItem.targetVisible = false;
}
}
function setItem(item: PopupItem) {
if (activeItem != null) {
lastActiveItem = activeItem;
}
}
function setItem(item: PopupItem) {
activeItem = item;
}
@ -48,10 +48,19 @@ Scope {
function onHidden(item: PopupItem) {
if (item == lastActiveItem) {
console.log("triggered");
lastActiveItem = null;
}
}
property real scaleMul: lastActiveItem && lastActiveItem.targetVisible ? 1 : 0
Behavior on scaleMul {
SmoothedAnimation {
velocity: 5
}
}
LazyLoader {
id: popupLoader
activeAsync: root.shownItem != null
@ -84,18 +93,34 @@ Scope {
}
}
// HyprlandWindow.opacity: root.scaleMul
HyprlandWindow.visibleMask: Region {
id: mask
item: parentItem
}
Connections {
target: root
function onScaleMulChanged() {
mask.changed();
}
}
StyledRectangle {
id: parentItem
width: targetWidth
height: targetHeight
x: targetX
y: root.gaps
clip: true
transform: Scale {
origin.x: parentItem.targetX
origin.y: 0
xScale: 1
yScale: root.scaleMul
}
readonly property var targetWidth: root.shownItem?.implicitWidth ?? 0
readonly property var targetHeight: root.shownItem?.implicitHeight ?? 0
@ -107,11 +132,16 @@ Scope {
let owner = root.shownItem.owner;
let bar = root.bar;
let isCentered = root.shownItem.centered;
let xPos = owner.mapToItem(bar.contentItem, 0, bar.height, owner.width, 0).x;
let rightEdge = xPos + targetWidth;
let maxRightEdge = popup.width;
if (isCentered) {
return xPos - (targetWidth / 2) + (owner.width / 2);
}
if (rightEdge > maxRightEdge) {
// touching right edge, reposition
// console.log("touching right edge");
@ -129,31 +159,39 @@ Scope {
}
}
// TODO: Make a close animation, a little complicated, will need to track if an animation is running
// TODO: Make a close animation, a little complicated, will need to track if an animation is running
// and stop unload from occuring until its done, in the LazyLoader.
Behavior on x {
enabled: root.lastActiveItem != null
SmoothedAnimation {
duration: 200
easing.type: Easing.InOutQuad
}
}
Behavior on width {
enabled: root.lastActiveItem != null
SmoothedAnimation {
duration: 300
duration: 200
easing.type: Easing.InOutQuad
}
}
Behavior on height {
enabled: root.lastActiveItem != null
SmoothedAnimation {
duration: 300
duration: 200
easing.type: Easing.InOutQuad
}
}
Behavior on x {
enabled: root.lastActiveItem != null
SmoothedAnimation {
duration: 300
easing.type: Easing.InOutQuad
}
}
// SmoothedAnimation on height {
// duration: 200
// easing.type: Easing.InOutQuad
// to: parentItem.targetHeight
// onToChanged: restart()
// }
}
}
}

View file

@ -1,4 +1,5 @@
import QtQuick
import qs.widgets
Item {
id: root
@ -46,8 +47,9 @@ Item {
implicitWidth: children[0].implicitWidth
}
required property var popup
required property var popup
required property var owner
property bool centered: false
property bool show: false
signal closed
@ -61,10 +63,4 @@ Item {
velocity: 5
}
}
function snapOpacity(opacity: real) {
opacityAnimation.enabled = false;
targetOpacity = opacity;
opacityAnimation.enabled = true;
}
}

View file

@ -1,100 +0,0 @@
pragma ComponentBehavior: Bound
import QtQuick
import QtQuick.Layouts
import Qt5Compat.GraphicalEffects
import Quickshell.Widgets
import Quickshell.Services.UPower
import "../../widgets" as Widgets
import "../.."
// todo: redo the tray icon handling
Item {
id: root
implicitWidth: height + 8 // for margin
visible: UPower.displayDevice.isLaptopBattery
required property var popup
Widgets.StyledMouseArea {
id: batteryButton
hoverEnabled: true
onClicked: {
if (root.popup.content == powerMenu) {
root.popup.hide();
return;
}
root.popup.set(this, powerMenu);
}
anchors {
fill: parent
margins: 1
}
Item {
implicitWidth: parent.height
implicitHeight: parent.height
anchors.centerIn: parent
layer.enabled: true
layer.effect: OpacityMask {
source: Rectangle {
width: root.width
height: root.height
color: "white"
}
maskSource: IconImage {
implicitSize: root.width
source: "root:resources/battery/battery.svg"
}
}
Rectangle {
id: batteryBackground
color: Qt.color(ShellSettings.colors["surface"]).lighter(4)
opacity: 0.75
anchors {
fill: parent
margins: 2
}
}
Rectangle {
id: batteryPercentage
width: (parent.width - 4) * UPower.displayDevice.percentage
color: ShellSettings.colors["inverse_surface"]
anchors {
left: batteryBackground.left
top: batteryBackground.top
bottom: batteryBackground.bottom
}
}
}
}
Item {
id: powerMenu
visible: false
implicitWidth: 250
implicitHeight: 80
RowLayout {
anchors.fill: parent
// ComboBox {
// model: ScriptModel {
// values: ["Power Save", "Balanced", "Performance"]
// }
//
// currentIndex: PowerProfiles.profile
// onCurrentIndexChanged: {
// PowerProfiles.profile = this.currentIndex;
// console.log(PowerProfile.toString(PowerProfiles.profile));
// }
// }
}
}
}

View file

@ -0,0 +1,72 @@
pragma ComponentBehavior: Bound
import QtQuick
import Qt5Compat.GraphicalEffects
import Quickshell.Widgets
import Quickshell.Services.UPower
import qs.widgets
import qs.bar
import qs
// todo: redo the tray icon handling
StyledMouseArea {
id: root
implicitWidth: height + 8 // for margin
visible: UPower.displayDevice.isLaptopBattery
onClicked: showMenu = !showMenu
required property var bar
property bool showMenu: false
Item {
implicitWidth: parent.height
implicitHeight: parent.height
anchors.centerIn: parent
layer.enabled: true
layer.effect: OpacityMask {
source: Rectangle {
width: root.width
height: root.height
color: "white"
}
maskSource: IconImage {
implicitSize: root.width
source: "root:resources/battery/battery.svg"
}
}
Rectangle {
id: batteryBackground
color: Qt.color(ShellSettings.colors["surface"]).lighter(4)
opacity: 0.75
anchors {
fill: parent
margins: 2
}
}
Rectangle {
id: batteryPercentage
width: (parent.width - 4) * UPower.displayDevice.percentage
color: ShellSettings.colors["inverse_surface"]
anchors {
left: batteryBackground.left
top: batteryBackground.top
bottom: batteryBackground.bottom
}
}
}
property PopupItem menu: PopupItem {
owner: root
popup: root.bar.popup
show: root.showMenu
onClosed: root.showMenu = false
centered: true
implicitWidth: 250
implicitHeight: 250
}
}

View file

@ -8,6 +8,11 @@ import Quickshell.Services.SystemTray
import "../../widgets"
import ".."
// TODO:
// 1. Get rid of leftItem/rightItem properties on menu
// 2. Load menu properly, right now its pretty buggy
// 3. Fix bug that causes close on update (nm-applet wifi networks updating)
RowLayout {
id: root
spacing: 5
@ -60,7 +65,6 @@ RowLayout {
implicitWidth: content.implicitWidth + (2 * 8)
implicitHeight: content.implicitHeight + (2 * 8)
// TODO: come up with a better way instead of having to do this
property var leftItem: false
property var rightItem: false
@ -80,8 +84,8 @@ RowLayout {
rootMenu: menu
onInteracted: {
menuOpener.menu = null;
button.showMenu = false;
menuOpener.menu = null;
}
}
}