From e92187293e4afa046ca05bd80796c1fa193097e5 Mon Sep 17 00:00:00 2001 From: ATMDA Date: Wed, 12 Nov 2025 15:58:42 -0500 Subject: controlcenter: refactoring into components --- components/controls/SwitchRow.qml | 47 +++++++++++++++++++++++++++++++++++++++ 1 file changed, 47 insertions(+) create mode 100644 components/controls/SwitchRow.qml (limited to 'components/controls/SwitchRow.qml') diff --git a/components/controls/SwitchRow.qml b/components/controls/SwitchRow.qml new file mode 100644 index 0000000..a486ee2 --- /dev/null +++ b/components/controls/SwitchRow.qml @@ -0,0 +1,47 @@ +import ".." +import qs.components +import qs.components.effects +import qs.services +import qs.config +import QtQuick +import QtQuick.Layouts + +StyledRect { + id: root + + required property string label + required property bool checked + property var onToggled: function(checked) {} + + Layout.fillWidth: true + implicitHeight: row.implicitHeight + Appearance.padding.large * 2 + radius: Appearance.rounding.normal + color: Colours.tPalette.m3surfaceContainer + + Behavior on implicitHeight { + Anim {} + } + + RowLayout { + id: row + + anchors.left: parent.left + anchors.right: parent.right + anchors.verticalCenter: parent.verticalCenter + anchors.margins: Appearance.padding.large + spacing: Appearance.spacing.normal + + StyledText { + Layout.fillWidth: true + text: root.label + } + + StyledSwitch { + checked: root.checked + onToggled: { + root.onToggled(checked); + } + } + } +} + -- cgit v1.2.3-freya From e21a1519b0b59da0847f8c215201720fef3d854e Mon Sep 17 00:00:00 2001 From: ATMDA Date: Wed, 12 Nov 2025 16:06:16 -0500 Subject: controlcenter: refactoring into components --- components/controls/SwitchRow.qml | 2 + .../controlcenter/appearance/AppearancePane.qml | 78 ++++------------------ modules/controlcenter/launcher/LauncherPane.qml | 45 ++++--------- 3 files changed, 27 insertions(+), 98 deletions(-) (limited to 'components/controls/SwitchRow.qml') diff --git a/components/controls/SwitchRow.qml b/components/controls/SwitchRow.qml index a486ee2..0ec7aa5 100644 --- a/components/controls/SwitchRow.qml +++ b/components/controls/SwitchRow.qml @@ -11,6 +11,7 @@ StyledRect { required property string label required property bool checked + property bool enabled: true property var onToggled: function(checked) {} Layout.fillWidth: true @@ -38,6 +39,7 @@ StyledRect { StyledSwitch { checked: root.checked + enabled: root.enabled onToggled: { root.onToggled(checked); } diff --git a/modules/controlcenter/appearance/AppearancePane.qml b/modules/controlcenter/appearance/AppearancePane.qml index cfe5b56..68e2e2d 100644 --- a/modules/controlcenter/appearance/AppearancePane.qml +++ b/modules/controlcenter/appearance/AppearancePane.qml @@ -263,38 +263,11 @@ RowLayout { root.collapseAllSections(themeModeSection); } - StyledRect { - Layout.fillWidth: true - implicitHeight: modeToggle.implicitHeight + Appearance.padding.large * 2 - - radius: Appearance.rounding.normal - color: Colours.tPalette.m3surfaceContainer - - Behavior on implicitHeight { - Anim {} - } - - RowLayout { - id: modeToggle - - anchors.left: parent.left - anchors.right: parent.right - anchors.verticalCenter: parent.verticalCenter - anchors.margins: Appearance.padding.large - - spacing: Appearance.spacing.normal - - StyledText { - Layout.fillWidth: true - text: qsTr("Dark mode") - } - - StyledSwitch { - checked: !Colours.currentLight - onToggled: { - Colours.setMode(checked ? "dark" : "light"); - } - } + SwitchRow { + label: qsTr("Dark mode") + checked: !Colours.currentLight + onToggled: checked => { + Colours.setMode(checked ? "dark" : "light"); } } } @@ -803,39 +776,14 @@ RowLayout { } } - StyledRect { - Layout.fillWidth: true - implicitHeight: fontSizeScaleRow.implicitHeight + Appearance.padding.large * 2 - radius: Appearance.rounding.normal - color: Colours.tPalette.m3surfaceContainer - - Behavior on implicitHeight { - Anim {} - } - - RowLayout { - id: fontSizeScaleRow - anchors.left: parent.left - anchors.right: parent.right - anchors.verticalCenter: parent.verticalCenter - anchors.margins: Appearance.padding.large - spacing: Appearance.spacing.normal - - StyledText { - Layout.fillWidth: true - text: qsTr("Font size scale") - } - - CustomSpinBox { - id: fontSizeScaleSpinBox - min: 0.1 - max: 5 - value: root.fontSizeScale - onValueModified: value => { - root.fontSizeScale = value; - root.saveConfig(); - } - } + SpinBoxRow { + label: qsTr("Font size scale") + min: 0.1 + max: 5 + value: root.fontSizeScale + onValueModified: value => { + root.fontSizeScale = value; + root.saveConfig(); } } } diff --git a/modules/controlcenter/launcher/LauncherPane.qml b/modules/controlcenter/launcher/LauncherPane.qml index 82e145a..9b2570a 100644 --- a/modules/controlcenter/launcher/LauncherPane.qml +++ b/modules/controlcenter/launcher/LauncherPane.qml @@ -22,6 +22,7 @@ RowLayout { required property Session session property var selectedApp: null + property bool hideFromLauncherChecked: false anchors.fill: parent @@ -45,7 +46,7 @@ RowLayout { function updateToggleState() { if (!root.selectedApp || !configFile.loaded) { - hideFromLauncherSwitch.checked = false; + root.hideFromLauncherChecked = false; return; } @@ -54,16 +55,16 @@ RowLayout { const appId = root.selectedApp.id || root.selectedApp.entry?.id; if (config.launcher && config.launcher.hiddenApps) { - hideFromLauncherSwitch.checked = config.launcher.hiddenApps.includes(appId); + root.hideFromLauncherChecked = config.launcher.hiddenApps.includes(appId); } else { - hideFromLauncherSwitch.checked = false; + root.hideFromLauncherChecked = false; } } catch (e) { console.error("Failed to update toggle state:", e); } } - function saveHiddenApps() { + function saveHiddenApps(isHidden) { if (!configFile.loaded || !root.selectedApp) { return; } @@ -76,7 +77,6 @@ RowLayout { if (!config.launcher.hiddenApps) config.launcher.hiddenApps = []; const hiddenApps = config.launcher.hiddenApps; - const isHidden = hideFromLauncherSwitch.checked; if (isHidden) { // Add to hiddenApps if not already there @@ -288,35 +288,14 @@ RowLayout { anchors.top: parent.top spacing: Appearance.spacing.normal - StyledRect { - Layout.fillWidth: true + SwitchRow { Layout.topMargin: Appearance.spacing.normal - implicitHeight: hideToggleRow.implicitHeight + Appearance.padding.large * 2 - color: Colours.tPalette.m3surfaceContainer - radius: Appearance.rounding.normal - - RowLayout { - id: hideToggleRow - anchors.left: parent.left - anchors.right: parent.right - anchors.verticalCenter: parent.verticalCenter - anchors.margins: Appearance.padding.large - spacing: Appearance.spacing.normal - - StyledText { - Layout.fillWidth: true - text: qsTr("Hide from launcher") - font.pointSize: Appearance.font.size.normal - } - - StyledSwitch { - id: hideFromLauncherSwitch - checked: false - enabled: root.selectedApp !== null && configFile.loaded - onToggled: { - root.saveHiddenApps(); - } - } + label: qsTr("Hide from launcher") + checked: root.hideFromLauncherChecked + enabled: root.selectedApp !== null && configFile.loaded + onToggled: checked => { + root.hideFromLauncherChecked = checked; + root.saveHiddenApps(checked); } } -- cgit v1.2.3-freya From 4ada7ea608711aa21f8bfc51698e7a3ec261aeeb Mon Sep 17 00:00:00 2001 From: ATMDA Date: Sat, 15 Nov 2025 17:16:52 -0500 Subject: controlcenter: corrected certain containers not respecting transparency layers --- components/SectionContainer.qml | 2 +- components/controls/FilledSlider.qml | 2 +- components/controls/SpinBoxRow.qml | 2 +- components/controls/StyledSlider.qml | 2 +- components/controls/SwitchRow.qml | 2 +- modules/controlcenter/audio/AudioPane.qml | 4 ++-- modules/controlcenter/launcher/LauncherPane.qml | 4 ++-- modules/launcher/Content.qml | 2 +- 8 files changed, 10 insertions(+), 10 deletions(-) (limited to 'components/controls/SwitchRow.qml') diff --git a/components/SectionContainer.qml b/components/SectionContainer.qml index d41254b..f7dfef4 100644 --- a/components/SectionContainer.qml +++ b/components/SectionContainer.qml @@ -15,7 +15,7 @@ StyledRect { implicitHeight: contentColumn.implicitHeight + Appearance.padding.large * 2 radius: Appearance.rounding.normal - color: Colours.tPalette.m3surfaceContainer + color: Colours.layer(Colours.palette.m3surfaceContainer, 2) ColumnLayout { id: contentColumn diff --git a/components/controls/FilledSlider.qml b/components/controls/FilledSlider.qml index 78b8a5c..80dd44c 100644 --- a/components/controls/FilledSlider.qml +++ b/components/controls/FilledSlider.qml @@ -15,7 +15,7 @@ Slider { orientation: Qt.Vertical background: StyledRect { - color: Colours.tPalette.m3surfaceContainer + color: Colours.layer(Colours.palette.m3surfaceContainer, 2) radius: Appearance.rounding.full StyledRect { diff --git a/components/controls/SpinBoxRow.qml b/components/controls/SpinBoxRow.qml index 2507b80..4902627 100644 --- a/components/controls/SpinBoxRow.qml +++ b/components/controls/SpinBoxRow.qml @@ -19,7 +19,7 @@ StyledRect { Layout.fillWidth: true implicitHeight: row.implicitHeight + Appearance.padding.large * 2 radius: Appearance.rounding.normal - color: Colours.tPalette.m3surfaceContainer + color: Colours.layer(Colours.palette.m3surfaceContainer, 2) Behavior on implicitHeight { Anim {} diff --git a/components/controls/StyledSlider.qml b/components/controls/StyledSlider.qml index 92c8aa8..55e8c8d 100644 --- a/components/controls/StyledSlider.qml +++ b/components/controls/StyledSlider.qml @@ -32,7 +32,7 @@ Slider { implicitWidth: parent.width - root.handle.x - root.handle.implicitWidth - root.implicitHeight / 6 - color: Colours.tPalette.m3surfaceContainer + color: Colours.layer(Colours.palette.m3surfaceContainer, 2) radius: Appearance.rounding.full topLeftRadius: root.implicitHeight / 15 bottomLeftRadius: root.implicitHeight / 15 diff --git a/components/controls/SwitchRow.qml b/components/controls/SwitchRow.qml index 0ec7aa5..7fa3e1b 100644 --- a/components/controls/SwitchRow.qml +++ b/components/controls/SwitchRow.qml @@ -17,7 +17,7 @@ StyledRect { Layout.fillWidth: true implicitHeight: row.implicitHeight + Appearance.padding.large * 2 radius: Appearance.rounding.normal - color: Colours.tPalette.m3surfaceContainer + color: Colours.layer(Colours.palette.m3surfaceContainer, 2) Behavior on implicitHeight { Anim {} diff --git a/modules/controlcenter/audio/AudioPane.qml b/modules/controlcenter/audio/AudioPane.qml index 005de3a..1c0c770 100644 --- a/modules/controlcenter/audio/AudioPane.qml +++ b/modules/controlcenter/audio/AudioPane.qml @@ -127,7 +127,7 @@ RowLayout { Layout.fillWidth: true - color: Qt.alpha(Colours.tPalette.m3surfaceContainer, Audio.sink?.id === modelData.id ? Colours.tPalette.m3surfaceContainer.a : 0) + color: Audio.sink?.id === modelData.id ? Colours.layer(Colours.palette.m3surfaceContainer, 2) : "transparent" radius: Appearance.rounding.normal StateLayer { @@ -205,7 +205,7 @@ RowLayout { Layout.fillWidth: true - color: Qt.alpha(Colours.tPalette.m3surfaceContainer, Audio.source?.id === modelData.id ? Colours.tPalette.m3surfaceContainer.a : 0) + color: Audio.source?.id === modelData.id ? Colours.layer(Colours.palette.m3surfaceContainer, 2) : "transparent" radius: Appearance.rounding.normal StateLayer { diff --git a/modules/controlcenter/launcher/LauncherPane.qml b/modules/controlcenter/launcher/LauncherPane.qml index 12abc1e..dc7a7a7 100644 --- a/modules/controlcenter/launcher/LauncherPane.qml +++ b/modules/controlcenter/launcher/LauncherPane.qml @@ -218,7 +218,7 @@ RowLayout { Layout.topMargin: Appearance.spacing.normal Layout.bottomMargin: Appearance.spacing.small - color: Colours.tPalette.m3surfaceContainer + color: Colours.layer(Colours.palette.m3surfaceContainer, 2) radius: Appearance.rounding.full implicitHeight: Math.max(searchIcon.implicitHeight, searchField.implicitHeight, clearIcon.implicitHeight) @@ -317,7 +317,7 @@ RowLayout { readonly property bool isSelected: root.selectedApp === modelData - color: Qt.alpha(Colours.tPalette.m3surfaceContainer, isSelected ? Colours.tPalette.m3surfaceContainer.a : 0) + color: isSelected ? Colours.layer(Colours.palette.m3surfaceContainer, 2) : "transparent" radius: Appearance.rounding.normal StateLayer { diff --git a/modules/launcher/Content.qml b/modules/launcher/Content.qml index f674569..c085976 100644 --- a/modules/launcher/Content.qml +++ b/modules/launcher/Content.qml @@ -47,7 +47,7 @@ Item { StyledRect { id: searchWrapper - color: Colours.tPalette.m3surfaceContainer + color: Colours.layer(Colours.palette.m3surfaceContainer, 2) radius: Appearance.rounding.full anchors.left: parent.left -- cgit v1.2.3-freya