From 64c1b5be0bf6652344065795572fca6688834e39 Mon Sep 17 00:00:00 2001 From: end-4 <97237370+end-4@users.noreply.github.com> Date: Tue, 18 Nov 2025 23:25:29 +0100 Subject: [PATCH] actioncenter: stack view setup --- .../actionCenter/ActionCenterBodySliders.qml | 6 +- .../actionCenter/ActionCenterContent.qml | 30 ++++++--- .../actionCenter/ActionCenterContext.qml | 12 ++++ .../toggles/ActionCenterToggleButton.qml | 66 +++++++++---------- .../ii/modules/waffle/looks/FluentIcon.qml | 2 +- 5 files changed, 68 insertions(+), 48 deletions(-) create mode 100644 dots/.config/quickshell/ii/modules/waffle/actionCenter/ActionCenterContext.qml diff --git a/dots/.config/quickshell/ii/modules/waffle/actionCenter/ActionCenterBodySliders.qml b/dots/.config/quickshell/ii/modules/waffle/actionCenter/ActionCenterBodySliders.qml index 65cfd9f8f..d42385ee6 100644 --- a/dots/.config/quickshell/ii/modules/waffle/actionCenter/ActionCenterBodySliders.qml +++ b/dots/.config/quickshell/ii/modules/waffle/actionCenter/ActionCenterBodySliders.qml @@ -18,7 +18,7 @@ ColumnLayout { WPanelIconButton { color: colBackground - property real animationValue: root.brightnessMonitor.brightness + property real animationValue: root.brightnessMonitor?.brightness ?? 0 rotation: animationValue * 180 scale: 0.8 + animationValue * 0.2 iconName: "weather-sunny" @@ -30,9 +30,9 @@ ColumnLayout { WSlider { Layout.fillWidth: true - value: root.brightnessMonitor.brightness + value: root.brightnessMonitor?.brightness ?? 0 onMoved: { - root.brightnessMonitor.setBrightness(value) + root.brightnessMonitor?.setBrightness(value) } } diff --git a/dots/.config/quickshell/ii/modules/waffle/actionCenter/ActionCenterContent.qml b/dots/.config/quickshell/ii/modules/waffle/actionCenter/ActionCenterContent.qml index 0fa99b7d0..8519f5351 100644 --- a/dots/.config/quickshell/ii/modules/waffle/actionCenter/ActionCenterContent.qml +++ b/dots/.config/quickshell/ii/modules/waffle/actionCenter/ActionCenterContent.qml @@ -1,4 +1,5 @@ import QtQuick +import QtQuick.Controls import QtQuick.Layouts import Quickshell import qs @@ -10,19 +11,28 @@ import qs.modules.waffle.looks WBarAttachedPanelContent { id: root - contentItem: ColumnLayout { - anchors.centerIn: parent - spacing: 0 + contentItem: StackView { + implicitWidth: currentItem.implicitWidth + implicitHeight: currentItem.implicitHeight - ActionCenterBody {} + initialItem: ColumnLayout { + anchors.centerIn: parent + spacing: 0 - Rectangle { - Layout.fillHeight: false - Layout.fillWidth: true - color: Looks.colors.bgPanelSeparator - implicitHeight: 1 + ActionCenterBody {} + + Rectangle { + Layout.fillHeight: false + Layout.fillWidth: true + color: Looks.colors.bgPanelSeparator + implicitHeight: 1 + } + + ActionCenterFooter {} } - ActionCenterFooter {} + Component.onCompleted: { + ActionCenterContext.stackView = this + } } } diff --git a/dots/.config/quickshell/ii/modules/waffle/actionCenter/ActionCenterContext.qml b/dots/.config/quickshell/ii/modules/waffle/actionCenter/ActionCenterContext.qml new file mode 100644 index 000000000..7c75ba4c9 --- /dev/null +++ b/dots/.config/quickshell/ii/modules/waffle/actionCenter/ActionCenterContext.qml @@ -0,0 +1,12 @@ +pragma Singleton +pragma ComponentBehavior: Bound +import QtQuick +import QtQuick.Controls +import Quickshell + +Singleton { + id: root + + property StackView stackView + +} diff --git a/dots/.config/quickshell/ii/modules/waffle/actionCenter/toggles/ActionCenterToggleButton.qml b/dots/.config/quickshell/ii/modules/waffle/actionCenter/toggles/ActionCenterToggleButton.qml index d723f8af0..3f2dc224b 100644 --- a/dots/.config/quickshell/ii/modules/waffle/actionCenter/toggles/ActionCenterToggleButton.qml +++ b/dots/.config/quickshell/ii/modules/waffle/actionCenter/toggles/ActionCenterToggleButton.qml @@ -1,5 +1,6 @@ pragma ComponentBehavior: Bound import QtQuick +import QtQuick.Controls import QtQuick.Layouts import Quickshell import qs @@ -9,6 +10,7 @@ import qs.modules.common.models.quickToggles import qs.modules.common.functions import qs.modules.common.widgets import qs.modules.waffle.looks +import qs.modules.waffle.actionCenter // It should be perfectly fine to use just a Column here, but somehow // using ColumnLayout prevents weird opening anim stutter @@ -25,6 +27,7 @@ ColumnLayout { property var mainAction: toggleModel?.mainAction ?? null property var altAction: toggleModel?.hasMenu ? (() => root.openMenu()) : (toggleModel?.altAction ?? null) property bool hasMenu: toggleModel?.hasMenu ?? false + property Item menu property color colBackground: toggled ? Looks.colors.accent : Looks.colors.bg2 property color colBackgroundHovered: toggled ? Looks.colors.accentHover : Looks.colors.bg2Hover @@ -46,54 +49,26 @@ ColumnLayout { anchors.fill: parent spacing: 0 - WButton { - Layout.fillHeight: true - Layout.fillWidth: true - inset: 0 - backgroundOpacity: 0.8 - checked: root.toggled - border.width: 1 - border.color: root.colBorder + ToggleFragment { topLeftRadius: Looks.radius.medium bottomLeftRadius: Looks.radius.medium topRightRadius: root.hasMenu ? 0 : Looks.radius.medium bottomRightRadius: root.hasMenu ? 0 : Looks.radius.medium + iconName: root.icon onClicked: root.mainAction && root.mainAction() - contentItem: Item { - anchors.centerIn: parent - FluentIcon { - anchors.centerIn: parent - icon: root.icon - implicitSize: 18 - monochrome: true - filled: root.toggled - color: root.colForeground - } - } } FadeLoader { Layout.fillHeight: true Layout.fillWidth: true shown: root.hasMenu - sourceComponent: WButton { - inset: 0 - backgroundOpacity: 0.8 - checked: root.toggled - border.width: 1 - border.color: root.colBorder + sourceComponent: ToggleFragment { topLeftRadius: 0 bottomLeftRadius: 0 topRightRadius: Looks.radius.medium bottomRightRadius: Looks.radius.medium - contentItem: Item { - anchors.centerIn: parent - FluentIcon { - anchors.centerIn: parent - icon: "chevron-right" - implicitSize: 18 - monochrome: true - color: root.colForeground - } + iconName: "chevron-right" + onClicked: { + ActionCenterContext.stackView.push(root.menu) } } } @@ -115,6 +90,29 @@ ColumnLayout { elide: Text.ElideRight text: root.name } + } + component ToggleFragment: WButton { + id: toggleFragment + required property string iconName + Layout.fillHeight: true + Layout.fillWidth: true + inset: 0 + backgroundOpacity: 0.8 + checked: root.toggled + border.width: 1 + border.color: root.colBorder + + contentItem: Item { + anchors.centerIn: parent + FluentIcon { + anchors.centerIn: parent + icon: toggleFragment.iconName + implicitSize: 18 + monochrome: true + filled: root.toggled + color: root.colForeground + } + } } } diff --git a/dots/.config/quickshell/ii/modules/waffle/looks/FluentIcon.qml b/dots/.config/quickshell/ii/modules/waffle/looks/FluentIcon.qml index e4a44d19a..29b34fd97 100644 --- a/dots/.config/quickshell/ii/modules/waffle/looks/FluentIcon.qml +++ b/dots/.config/quickshell/ii/modules/waffle/looks/FluentIcon.qml @@ -14,7 +14,7 @@ Kirigami.Icon { implicitWidth: implicitSize implicitHeight: implicitSize - source: `${Looks.iconsPath}/${root.icon}${filled ? "-filled" : ""}.svg` + source: icon === "" ? "" : `${Looks.iconsPath}/${root.icon}${filled ? "-filled" : ""}.svg` fallback: root.icon roundToIconSize: false color: Looks.colors.fg