summaryrefslogtreecommitdiff
diff options
context:
space:
mode:
authorATMDA <atdma2600@gmail.com>2025-11-19 21:57:55 -0500
committerATMDA <atdma2600@gmail.com>2025-11-19 21:57:55 -0500
commita243b6148b03d3effb7b86993f8ce89911e49b80 (patch)
tree58e65799991e1b902a3c369fcd3979863943fffd
parentcleanup: removed unnecessary comments (diff)
downloadcaelestia-shell-a243b6148b03d3effb7b86993f8ce89911e49b80.tar.gz
caelestia-shell-a243b6148b03d3effb7b86993f8ce89911e49b80.tar.bz2
caelestia-shell-a243b6148b03d3effb7b86993f8ce89911e49b80.zip
refactor: replaced input fields with SliderInput components
-rw-r--r--modules/controlcenter/appearance/AppearancePane.qml1122
-rw-r--r--modules/controlcenter/components/DeviceDetails.qml2
-rw-r--r--modules/controlcenter/components/SliderInput.qml207
-rw-r--r--modules/controlcenter/components/controls/SliderInput.qml179
-rw-r--r--modules/controlcenter/network/EthernetDetails.qml4
-rw-r--r--modules/controlcenter/network/WirelessDetails.qml4
-rw-r--r--modules/controlcenter/taskbar/TaskbarPane.qml106
7 files changed, 550 insertions, 1074 deletions
diff --git a/modules/controlcenter/appearance/AppearancePane.qml b/modules/controlcenter/appearance/AppearancePane.qml
index 5b7e859..dec260d 100644
--- a/modules/controlcenter/appearance/AppearancePane.qml
+++ b/modules/controlcenter/appearance/AppearancePane.qml
@@ -962,98 +962,20 @@ Item {
SectionContainer {
contentSpacing: Appearance.spacing.normal
- ColumnLayout {
+ SliderInput {
Layout.fillWidth: true
- spacing: Appearance.spacing.small
-
- RowLayout {
- Layout.fillWidth: true
- spacing: Appearance.spacing.normal
-
- StyledText {
- text: qsTr("Animation duration scale")
- font.pointSize: Appearance.font.size.normal
- }
-
- Item {
- Layout.fillWidth: true
- }
-
- StyledRect {
- Layout.preferredWidth: 70
- implicitHeight: animDurationsInput.implicitHeight + Appearance.padding.small * 2
- color: animDurationsInputHover.containsMouse || animDurationsInput.activeFocus
- ? Colours.layer(Colours.palette.m3surfaceContainer, 3)
- : Colours.layer(Colours.palette.m3surfaceContainer, 2)
- radius: Appearance.rounding.small
- border.width: 1
- border.color: animDurationsInput.activeFocus
- ? Colours.palette.m3primary
- : Qt.alpha(Colours.palette.m3outline, 0.3)
-
- Behavior on color { CAnim {} }
- Behavior on border.color { CAnim {} }
-
- MouseArea {
- id: animDurationsInputHover
- anchors.fill: parent
- hoverEnabled: true
- cursorShape: Qt.IBeamCursor
- acceptedButtons: Qt.NoButton
- }
-
- StyledTextField {
- id: animDurationsInput
- anchors.centerIn: parent
- width: parent.width - Appearance.padding.normal
- horizontalAlignment: TextInput.AlignHCenter
- validator: DoubleValidator { bottom: 0.1; top: 5.0 }
-
- Component.onCompleted: {
- text = (rootPane.animDurationsScale).toFixed(1);
- }
-
- onTextChanged: {
- if (activeFocus) {
- const val = parseFloat(text);
- if (!isNaN(val) && val >= 0.1 && val <= 5.0) {
- rootPane.animDurationsScale = val;
- rootPane.saveConfig();
- }
- }
- }
- onEditingFinished: {
- const val = parseFloat(text);
- if (isNaN(val) || val < 0.1 || val > 5.0) {
- text = (rootPane.animDurationsScale).toFixed(1);
- }
- }
- }
- }
-
- StyledText {
- text: "×"
- color: Colours.palette.m3outline
- font.pointSize: Appearance.font.size.normal
- }
- }
-
- StyledSlider {
- id: animDurationsSlider
-
- Layout.fillWidth: true
- implicitHeight: Appearance.padding.normal * 3
-
- from: 0.1
- to: 5.0
- value: rootPane.animDurationsScale
- onMoved: {
- rootPane.animDurationsScale = animDurationsSlider.value;
- if (!animDurationsInput.activeFocus) {
- animDurationsInput.text = (animDurationsSlider.value).toFixed(1);
- }
- rootPane.saveConfig();
- }
+
+ label: qsTr("Animation duration scale")
+ value: rootPane.animDurationsScale
+ from: 0.1
+ to: 5.0
+ decimals: 1
+ suffix: "×"
+ validator: DoubleValidator { bottom: 0.1; top: 5.0 }
+
+ onValueModified: (newValue) => {
+ rootPane.animDurationsScale = newValue;
+ rootPane.saveConfig();
}
}
}
@@ -1312,98 +1234,20 @@ Item {
SectionContainer {
contentSpacing: Appearance.spacing.normal
- ColumnLayout {
+ SliderInput {
Layout.fillWidth: true
- spacing: Appearance.spacing.small
-
- RowLayout {
- Layout.fillWidth: true
- spacing: Appearance.spacing.normal
-
- StyledText {
- text: qsTr("Font size scale")
- font.pointSize: Appearance.font.size.normal
- }
-
- Item {
- Layout.fillWidth: true
- }
-
- StyledRect {
- Layout.preferredWidth: 70
- implicitHeight: fontSizeInput.implicitHeight + Appearance.padding.small * 2
- color: fontSizeInputHover.containsMouse || fontSizeInput.activeFocus
- ? Colours.layer(Colours.palette.m3surfaceContainer, 3)
- : Colours.layer(Colours.palette.m3surfaceContainer, 2)
- radius: Appearance.rounding.small
- border.width: 1
- border.color: fontSizeInput.activeFocus
- ? Colours.palette.m3primary
- : Qt.alpha(Colours.palette.m3outline, 0.3)
-
- Behavior on color { CAnim {} }
- Behavior on border.color { CAnim {} }
-
- MouseArea {
- id: fontSizeInputHover
- anchors.fill: parent
- hoverEnabled: true
- cursorShape: Qt.IBeamCursor
- acceptedButtons: Qt.NoButton
- }
-
- StyledTextField {
- id: fontSizeInput
- anchors.centerIn: parent
- width: parent.width - Appearance.padding.normal
- horizontalAlignment: TextInput.AlignHCenter
- validator: DoubleValidator { bottom: 0.7; top: 1.5 }
-
- Component.onCompleted: {
- text = (rootPane.fontSizeScale).toFixed(1);
- }
-
- onTextChanged: {
- if (activeFocus) {
- const val = parseFloat(text);
- if (!isNaN(val) && val >= 0.7 && val <= 1.5) {
- rootPane.fontSizeScale = val;
- rootPane.saveConfig();
- }
- }
- }
- onEditingFinished: {
- const val = parseFloat(text);
- if (isNaN(val) || val < 0.7 || val > 1.5) {
- text = (rootPane.fontSizeScale).toFixed(1);
- }
- }
- }
- }
-
- StyledText {
- text: "×"
- color: Colours.palette.m3outline
- font.pointSize: Appearance.font.size.normal
- }
- }
-
- StyledSlider {
- id: fontSizeSlider
-
- Layout.fillWidth: true
- implicitHeight: Appearance.padding.normal * 3
-
- from: 0.7
- to: 1.5
- value: rootPane.fontSizeScale
- onMoved: {
- rootPane.fontSizeScale = fontSizeSlider.value;
- if (!fontSizeInput.activeFocus) {
- fontSizeInput.text = (fontSizeSlider.value).toFixed(1);
- }
- rootPane.saveConfig();
- }
+
+ label: qsTr("Font size scale")
+ value: rootPane.fontSizeScale
+ from: 0.7
+ to: 1.5
+ decimals: 2
+ suffix: "×"
+ validator: DoubleValidator { bottom: 0.7; top: 1.5 }
+
+ onValueModified: (newValue) => {
+ rootPane.fontSizeScale = newValue;
+ rootPane.saveConfig();
}
}
}
@@ -1417,98 +1261,20 @@ Item {
SectionContainer {
contentSpacing: Appearance.spacing.normal
- ColumnLayout {
+ SliderInput {
Layout.fillWidth: true
- spacing: Appearance.spacing.small
-
- RowLayout {
- Layout.fillWidth: true
- spacing: Appearance.spacing.normal
-
- StyledText {
- text: qsTr("Padding scale")
- font.pointSize: Appearance.font.size.normal
- }
-
- Item {
- Layout.fillWidth: true
- }
-
- StyledRect {
- Layout.preferredWidth: 70
- implicitHeight: paddingInput.implicitHeight + Appearance.padding.small * 2
- color: paddingInputHover.containsMouse || paddingInput.activeFocus
- ? Colours.layer(Colours.palette.m3surfaceContainer, 3)
- : Colours.layer(Colours.palette.m3surfaceContainer, 2)
- radius: Appearance.rounding.small
- border.width: 1
- border.color: paddingInput.activeFocus
- ? Colours.palette.m3primary
- : Qt.alpha(Colours.palette.m3outline, 0.3)
-
- Behavior on color { CAnim {} }
- Behavior on border.color { CAnim {} }
-
- MouseArea {
- id: paddingInputHover
- anchors.fill: parent
- hoverEnabled: true
- cursorShape: Qt.IBeamCursor
- acceptedButtons: Qt.NoButton
- }
-
- StyledTextField {
- id: paddingInput
- anchors.centerIn: parent
- width: parent.width - Appearance.padding.normal
- horizontalAlignment: TextInput.AlignHCenter
- validator: DoubleValidator { bottom: 0.5; top: 2.0 }
-
- Component.onCompleted: {
- text = (rootPane.paddingScale).toFixed(1);
- }
-
- onTextChanged: {
- if (activeFocus) {
- const val = parseFloat(text);
- if (!isNaN(val) && val >= 0.5 && val <= 2.0) {
- rootPane.paddingScale = val;
- rootPane.saveConfig();
- }
- }
- }
- onEditingFinished: {
- const val = parseFloat(text);
- if (isNaN(val) || val < 0.5 || val > 2.0) {
- text = (rootPane.paddingScale).toFixed(1);
- }
- }
- }
- }
-
- StyledText {
- text: "×"
- color: Colours.palette.m3outline
- font.pointSize: Appearance.font.size.normal
- }
- }
-
- StyledSlider {
- id: paddingSlider
-
- Layout.fillWidth: true
- implicitHeight: Appearance.padding.normal * 3
-
- from: 0.5
- to: 2.0
- value: rootPane.paddingScale
- onMoved: {
- rootPane.paddingScale = paddingSlider.value;
- if (!paddingInput.activeFocus) {
- paddingInput.text = (paddingSlider.value).toFixed(1);
- }
- rootPane.saveConfig();
- }
+
+ label: qsTr("Padding scale")
+ value: rootPane.paddingScale
+ from: 0.5
+ to: 2.0
+ decimals: 1
+ suffix: "×"
+ validator: DoubleValidator { bottom: 0.5; top: 2.0 }
+
+ onValueModified: (newValue) => {
+ rootPane.paddingScale = newValue;
+ rootPane.saveConfig();
}
}
}
@@ -1516,98 +1282,20 @@ Item {
SectionContainer {
contentSpacing: Appearance.spacing.normal
- ColumnLayout {
+ SliderInput {
Layout.fillWidth: true
- spacing: Appearance.spacing.small
-
- RowLayout {
- Layout.fillWidth: true
- spacing: Appearance.spacing.normal
-
- StyledText {
- text: qsTr("Rounding scale")
- font.pointSize: Appearance.font.size.normal
- }
-
- Item {
- Layout.fillWidth: true
- }
-
- StyledRect {
- Layout.preferredWidth: 70
- implicitHeight: roundingInput.implicitHeight + Appearance.padding.small * 2
- color: roundingInputHover.containsMouse || roundingInput.activeFocus
- ? Colours.layer(Colours.palette.m3surfaceContainer, 3)
- : Colours.layer(Colours.palette.m3surfaceContainer, 2)
- radius: Appearance.rounding.small
- border.width: 1
- border.color: roundingInput.activeFocus
- ? Colours.palette.m3primary
- : Qt.alpha(Colours.palette.m3outline, 0.3)
-
- Behavior on color { CAnim {} }
- Behavior on border.color { CAnim {} }
-
- MouseArea {
- id: roundingInputHover
- anchors.fill: parent
- hoverEnabled: true
- cursorShape: Qt.IBeamCursor
- acceptedButtons: Qt.NoButton
- }
-
- StyledTextField {
- id: roundingInput
- anchors.centerIn: parent
- width: parent.width - Appearance.padding.normal
- horizontalAlignment: TextInput.AlignHCenter
- validator: DoubleValidator { bottom: 0.1; top: 5.0 }
-
- Component.onCompleted: {
- text = (rootPane.roundingScale).toFixed(1);
- }
-
- onTextChanged: {
- if (activeFocus) {
- const val = parseFloat(text);
- if (!isNaN(val) && val >= 0.1 && val <= 5.0) {
- rootPane.roundingScale = val;
- rootPane.saveConfig();
- }
- }
- }
- onEditingFinished: {
- const val = parseFloat(text);
- if (isNaN(val) || val < 0.1 || val > 5.0) {
- text = (rootPane.roundingScale).toFixed(1);
- }
- }
- }
- }
-
- StyledText {
- text: "×"
- color: Colours.palette.m3outline
- font.pointSize: Appearance.font.size.normal
- }
- }
-
- StyledSlider {
- id: roundingSlider
-
- Layout.fillWidth: true
- implicitHeight: Appearance.padding.normal * 3
-
- from: 0.1
- to: 5.0
- value: rootPane.roundingScale
- onMoved: {
- rootPane.roundingScale = roundingSlider.value;
- if (!roundingInput.activeFocus) {
- roundingInput.text = (roundingSlider.value).toFixed(1);
- }
- rootPane.saveConfig();
- }
+
+ label: qsTr("Rounding scale")
+ value: rootPane.roundingScale
+ from: 0.1
+ to: 5.0
+ decimals: 1
+ suffix: "×"
+ validator: DoubleValidator { bottom: 0.1; top: 5.0 }
+
+ onValueModified: (newValue) => {
+ rootPane.roundingScale = newValue;
+ rootPane.saveConfig();
}
}
}
@@ -1615,98 +1303,20 @@ Item {
SectionContainer {
contentSpacing: Appearance.spacing.normal
- ColumnLayout {
+ SliderInput {
Layout.fillWidth: true
- spacing: Appearance.spacing.small
-
- RowLayout {
- Layout.fillWidth: true
- spacing: Appearance.spacing.normal
-
- StyledText {
- text: qsTr("Spacing scale")
- font.pointSize: Appearance.font.size.normal
- }
-
- Item {
- Layout.fillWidth: true
- }
-
- StyledRect {
- Layout.preferredWidth: 70
- implicitHeight: spacingInput.implicitHeight + Appearance.padding.small * 2
- color: spacingInputHover.containsMouse || spacingInput.activeFocus
- ? Colours.layer(Colours.palette.m3surfaceContainer, 3)
- : Colours.layer(Colours.palette.m3surfaceContainer, 2)
- radius: Appearance.rounding.small
- border.width: 1
- border.color: spacingInput.activeFocus
- ? Colours.palette.m3primary
- : Qt.alpha(Colours.palette.m3outline, 0.3)
-
- Behavior on color { CAnim {} }
- Behavior on border.color { CAnim {} }
-
- MouseArea {
- id: spacingInputHover
- anchors.fill: parent
- hoverEnabled: true
- cursorShape: Qt.IBeamCursor
- acceptedButtons: Qt.NoButton
- }
-
- StyledTextField {
- id: spacingInput
- anchors.centerIn: parent
- width: parent.width - Appearance.padding.normal
- horizontalAlignment: TextInput.AlignHCenter
- validator: DoubleValidator { bottom: 0.1; top: 2.0 }
-
- Component.onCompleted: {
- text = (rootPane.spacingScale).toFixed(1);
- }
-
- onTextChanged: {
- if (activeFocus) {
- const val = parseFloat(text);
- if (!isNaN(val) && val >= 0.1 && val <= 2.0) {
- rootPane.spacingScale = val;
- rootPane.saveConfig();
- }
- }
- }
- onEditingFinished: {
- const val = parseFloat(text);
- if (isNaN(val) || val < 0.1 || val > 2.0) {
- text = (rootPane.spacingScale).toFixed(1);
- }
- }
- }
- }
-
- StyledText {
- text: "×"
- color: Colours.palette.m3outline
- font.pointSize: Appearance.font.size.normal
- }
- }
-
- StyledSlider {
- id: spacingSlider
-
- Layout.fillWidth: true
- implicitHeight: Appearance.padding.normal * 3
-
- from: 0.1
- to: 2.0
- value: rootPane.spacingScale
- onMoved: {
- rootPane.spacingScale = spacingSlider.value;
- if (!spacingInput.activeFocus) {
- spacingInput.text = (spacingSlider.value).toFixed(1);
- }
- rootPane.saveConfig();
- }
+
+ label: qsTr("Spacing scale")
+ value: rootPane.spacingScale
+ from: 0.1
+ to: 2.0
+ decimals: 1
+ suffix: "×"
+ validator: DoubleValidator { bottom: 0.1; top: 2.0 }
+
+ onValueModified: (newValue) => {
+ rootPane.spacingScale = newValue;
+ rootPane.saveConfig();
}
}
}
@@ -1729,98 +1339,21 @@ Item {
SectionContainer {
contentSpacing: Appearance.spacing.normal
- ColumnLayout {
+ SliderInput {
Layout.fillWidth: true
- spacing: Appearance.spacing.small
-
- RowLayout {
- Layout.fillWidth: true
- spacing: Appearance.spacing.normal
-
- StyledText {
- text: qsTr("Transparency base")
- font.pointSize: Appearance.font.size.normal
- }
-
- Item {
- Layout.fillWidth: true
- }
-
- StyledRect {
- Layout.preferredWidth: 70
- implicitHeight: transparencyBaseInput.implicitHeight + Appearance.padding.small * 2
- color: transparencyBaseInputHover.containsMouse || transparencyBaseInput.activeFocus
- ? Colours.layer(Colours.palette.m3surfaceContainer, 3)
- : Colours.layer(Colours.palette.m3surfaceContainer, 2)
- radius: Appearance.rounding.small
- border.width: 1
- border.color: transparencyBaseInput.activeFocus
- ? Colours.palette.m3primary
- : Qt.alpha(Colours.palette.m3outline, 0.3)
-
- Behavior on color { CAnim {} }
- Behavior on border.color { CAnim {} }
-
- MouseArea {
- id: transparencyBaseInputHover
- anchors.fill: parent
- hoverEnabled: true
- cursorShape: Qt.IBeamCursor
- acceptedButtons: Qt.NoButton
- }
-
- StyledTextField {
- id: transparencyBaseInput
- anchors.centerIn: parent
- width: parent.width - Appearance.padding.normal
- horizontalAlignment: TextInput.AlignHCenter
- validator: IntValidator { bottom: 0; top: 100 }
-
- Component.onCompleted: {
- text = Math.round(rootPane.transparencyBase * 100).toString();
- }
-
- onTextChanged: {
- if (activeFocus) {
- const val = parseInt(text);
- if (!isNaN(val) && val >= 0 && val <= 100) {
- rootPane.transparencyBase = val / 100;
- rootPane.saveConfig();
- }
- }
- }
- onEditingFinished: {
- const val = parseInt(text);
- if (isNaN(val) || val < 0 || val > 100) {
- text = Math.round(rootPane.transparencyBase * 100).toString();
- }
- }
- }
- }
-
- StyledText {
- text: "%"
- color: Colours.palette.m3outline
- font.pointSize: Appearance.font.size.normal
- }
- }
-
- StyledSlider {
- id: baseSlider
-
- Layout.fillWidth: true
- implicitHeight: Appearance.padding.normal * 3
-
- from: 0
- to: 100
- value: rootPane.transparencyBase * 100
- onMoved: {
- rootPane.transparencyBase = baseSlider.value / 100;
- if (!transparencyBaseInput.activeFocus) {
- transparencyBaseInput.text = Math.round(baseSlider.value).toString();
- }
- rootPane.saveConfig();
- }
+
+ label: qsTr("Transparency base")
+ value: rootPane.transparencyBase * 100
+ from: 0
+ to: 100
+ suffix: "%"
+ validator: IntValidator { bottom: 0; top: 100 }
+ formatValueFunction: (val) => Math.round(val).toString()
+ parseValueFunction: (text) => parseInt(text)
+
+ onValueModified: (newValue) => {
+ rootPane.transparencyBase = newValue / 100;
+ rootPane.saveConfig();
}
}
}
@@ -1828,98 +1361,21 @@ Item {
SectionContainer {
contentSpacing: Appearance.spacing.normal
- ColumnLayout {
+ SliderInput {
Layout.fillWidth: true
- spacing: Appearance.spacing.small
-
- RowLayout {
- Layout.fillWidth: true
- spacing: Appearance.spacing.normal
-
- StyledText {
- text: qsTr("Transparency layers")
- font.pointSize: Appearance.font.size.normal
- }
-
- Item {
- Layout.fillWidth: true
- }
-
- StyledRect {
- Layout.preferredWidth: 70
- implicitHeight: transparencyLayersInput.implicitHeight + Appearance.padding.small * 2
- color: transparencyLayersInputHover.containsMouse || transparencyLayersInput.activeFocus
- ? Colours.layer(Colours.palette.m3surfaceContainer, 3)
- : Colours.layer(Colours.palette.m3surfaceContainer, 2)
- radius: Appearance.rounding.small
- border.width: 1
- border.color: transparencyLayersInput.activeFocus
- ? Colours.palette.m3primary
- : Qt.alpha(Colours.palette.m3outline, 0.3)
-
- Behavior on color { CAnim {} }
- Behavior on border.color { CAnim {} }
-
- MouseArea {
- id: transparencyLayersInputHover
- anchors.fill: parent
- hoverEnabled: true
- cursorShape: Qt.IBeamCursor
- acceptedButtons: Qt.NoButton
- }
-
- StyledTextField {
- id: transparencyLayersInput
- anchors.centerIn: parent
- width: parent.width - Appearance.padding.normal
- horizontalAlignment: TextInput.AlignHCenter
- validator: IntValidator { bottom: 0; top: 100 }
-
- Component.onCompleted: {
- text = Math.round(rootPane.transparencyLayers * 100).toString();
- }
-
- onTextChanged: {
- if (activeFocus) {
- const val = parseInt(text);
- if (!isNaN(val) && val >= 0 && val <= 100) {
- rootPane.transparencyLayers = val / 100;
- rootPane.saveConfig();
- }
- }
- }
- onEditingFinished: {
- const val = parseInt(text);
- if (isNaN(val) || val < 0 || val > 100) {
- text = Math.round(rootPane.transparencyLayers * 100).toString();
- }
- }
- }
- }
-
- StyledText {
- text: "%"
- color: Colours.palette.m3outline
- font.pointSize: Appearance.font.size.normal
- }
- }
-
- StyledSlider {
- id: layersSlider
-
- Layout.fillWidth: true
- implicitHeight: Appearance.padding.normal * 3
-
- from: 0
- to: 100
- value: rootPane.transparencyLayers * 100
- onMoved: {
- rootPane.transparencyLayers = layersSlider.value / 100;
- if (!transparencyLayersInput.activeFocus) {
- transparencyLayersInput.text = Math.round(layersSlider.value).toString();
- }
- rootPane.saveConfig();
- }
+
+ label: qsTr("Transparency layers")
+ value: rootPane.transparencyLayers * 100
+ from: 0
+ to: 100
+ suffix: "%"
+ validator: IntValidator { bottom: 0; top: 100 }
+ formatValueFunction: (val) => Math.round(val).toString()
+ parseValueFunction: (text) => parseInt(text)
+
+ onValueModified: (newValue) => {
+ rootPane.transparencyLayers = newValue / 100;
+ rootPane.saveConfig();
}
}
}
@@ -1933,92 +1389,20 @@ Item {
SectionContainer {
contentSpacing: Appearance.spacing.normal
- ColumnLayout {
+ SliderInput {
Layout.fillWidth: true
- spacing: Appearance.spacing.small
-
- RowLayout {
- Layout.fillWidth: true
- spacing: Appearance.spacing.normal
-
- StyledText {
- text: qsTr("Border rounding")
- font.pointSize: Appearance.font.size.normal
- }
-
- Item {
- Layout.fillWidth: true
- }
-
- StyledRect {
- Layout.preferredWidth: 70
- implicitHeight: borderRoundingInput.implicitHeight + Appearance.padding.small * 2
- color: borderRoundingInputHover.containsMouse || borderRoundingInput.activeFocus
- ? Colours.layer(Colours.palette.m3surfaceContainer, 3)
- : Colours.layer(Colours.palette.m3surfaceContainer, 2)
- radius: Appearance.rounding.small
- border.width: 1
- border.color: borderRoundingInput.activeFocus
- ? Colours.palette.m3primary
- : Qt.alpha(Colours.palette.m3outline, 0.3)
-
- Behavior on color { CAnim {} }
- Behavior on border.color { CAnim {} }
-
- MouseArea {
- id: borderRoundingInputHover
- anchors.fill: parent
- hoverEnabled: true
- cursorShape: Qt.IBeamCursor
- acceptedButtons: Qt.NoButton
- }
-
- StyledTextField {
- id: borderRoundingInput
- anchors.centerIn: parent
- width: parent.width - Appearance.padding.normal
- horizontalAlignment: TextInput.AlignHCenter
- validator: DoubleValidator { bottom: 0.1; top: 100 }
-
- Component.onCompleted: {
- text = (rootPane.borderRounding).toFixed(1);
- }
-
- onTextChanged: {
- if (activeFocus) {
- const val = parseFloat(text);
- if (!isNaN(val) && val >= 0.1 && val <= 100) {
- rootPane.borderRounding = val;
- rootPane.saveConfig();
- }
- }
- }
- onEditingFinished: {
- const val = parseFloat(text);
- if (isNaN(val) || val < 0.1 || val > 100) {
- text = (rootPane.borderRounding).toFixed(1);
- }
- }
- }
- }
- }
-
- StyledSlider {
- id: borderRoundingSlider
-
- Layout.fillWidth: true
- implicitHeight: Appearance.padding.normal * 3
-
- from: 0.1
- to: 100
- value: rootPane.borderRounding
- onMoved: {
- rootPane.borderRounding = borderRoundingSlider.value;
- if (!borderRoundingInput.activeFocus) {
- borderRoundingInput.text = (borderRoundingSlider.value).toFixed(1);
- }
- rootPane.saveConfig();
- }
+
+ label: qsTr("Border rounding")
+ value: rootPane.borderRounding
+ from: 0.1
+ to: 100
+ decimals: 1
+ suffix: "px"
+ validator: DoubleValidator { bottom: 0.1; top: 100 }
+
+ onValueModified: (newValue) => {
+ rootPane.borderRounding = newValue;
+ rootPane.saveConfig();
}
}
}
@@ -2026,92 +1410,20 @@ Item {
SectionContainer {
contentSpacing: Appearance.spacing.normal
- ColumnLayout {
+ SliderInput {
Layout.fillWidth: true
- spacing: Appearance.spacing.small
-
- RowLayout {
- Layout.fillWidth: true
- spacing: Appearance.spacing.normal
-
- StyledText {
- text: qsTr("Border thickness")
- font.pointSize: Appearance.font.size.normal
- }
-
- Item {
- Layout.fillWidth: true
- }
-
- StyledRect {
- Layout.preferredWidth: 70
- implicitHeight: borderThicknessInput.implicitHeight + Appearance.padding.small * 2
- color: borderThicknessInputHover.containsMouse || borderThicknessInput.activeFocus
- ? Colours.layer(Colours.palette.m3surfaceContainer, 3)
- : Colours.layer(Colours.palette.m3surfaceContainer, 2)
- radius: Appearance.rounding.small
- border.width: 1
- border.color: borderThicknessInput.activeFocus
- ? Colours.palette.m3primary
- : Qt.alpha(Colours.palette.m3outline, 0.3)
-
- Behavior on color { CAnim {} }
- Behavior on border.color { CAnim {} }
-
- MouseArea {
- id: borderThicknessInputHover
- anchors.fill: parent
- hoverEnabled: true
- cursorShape: Qt.IBeamCursor
- acceptedButtons: Qt.NoButton
- }
-
- StyledTextField {
- id: borderThicknessInput
- anchors.centerIn: parent
- width: parent.width - Appearance.padding.normal
- horizontalAlignment: TextInput.AlignHCenter
- validator: DoubleValidator { bottom: 0.1; top: 100 }
-
- Component.onCompleted: {
- text = (rootPane.borderThickness).toFixed(1);
- }
-
- onTextChanged: {
- if (activeFocus) {
- const val = parseFloat(text);
- if (!isNaN(val) && val >= 0.1 && val <= 100) {
- rootPane.borderThickness = val;
- rootPane.saveConfig();
- }
- }
- }
- onEditingFinished: {
- const val = parseFloat(text);
- if (isNaN(val) || val < 0.1 || val > 100) {
- text = (rootPane.borderThickness).toFixed(1);
- }
- }
- }
- }
- }
-
- StyledSlider {
- id: borderThicknessSlider
-
- Layout.fillWidth: true
- implicitHeight: Appearance.padding.normal * 3
-
- from: 0.1
- to: 100
- value: rootPane.borderThickness
- onMoved: {
- rootPane.borderThickness = borderThicknessSlider.value;
- if (!borderThicknessInput.activeFocus) {
- borderThicknessInput.text = (borderThicknessSlider.value).toFixed(1);
- }
- rootPane.saveConfig();
- }
+
+ label: qsTr("Border thickness")
+ value: rootPane.borderThickness
+ from: 0.1
+ to: 100
+ decimals: 1
+ suffix: "px"
+ validator: DoubleValidator { bottom: 0.1; top: 100 }
+
+ onValueModified: (newValue) => {
+ rootPane.borderThickness = newValue;
+ rootPane.saveConfig();
}
}
}
@@ -2168,186 +1480,40 @@ Item {
SectionContainer {
contentSpacing: Appearance.spacing.normal
- ColumnLayout {
+ SliderInput {
Layout.fillWidth: true
- spacing: Appearance.spacing.small
-
- RowLayout {
- Layout.fillWidth: true
- spacing: Appearance.spacing.normal
-
- StyledText {
- text: qsTr("Visualiser rounding")
- font.pointSize: Appearance.font.size.normal
- }
-
- Item {
- Layout.fillWidth: true
- }
-
- StyledRect {
- Layout.preferredWidth: 70
- implicitHeight: visualiserRoundingInput.implicitHeight + Appearance.padding.small * 2
- color: visualiserRoundingInputHover.containsMouse || visualiserRoundingInput.activeFocus
- ? Colours.layer(Colours.palette.m3surfaceContainer, 3)
- : Colours.layer(Colours.palette.m3surfaceContainer, 2)
- radius: Appearance.rounding.small
- border.width: 1
- border.color: visualiserRoundingInput.activeFocus
- ? Colours.palette.m3primary
- : Qt.alpha(Colours.palette.m3outline, 0.3)
-
- Behavior on color { CAnim {} }
- Behavior on border.color { CAnim {} }
-
- MouseArea {
- id: visualiserRoundingInputHover
- anchors.fill: parent
- hoverEnabled: true
- cursorShape: Qt.IBeamCursor
- acceptedButtons: Qt.NoButton
- }
-
- StyledTextField {
- id: visualiserRoundingInput
- anchors.centerIn: parent
- width: parent.width - Appearance.padding.normal
- horizontalAlignment: TextInput.AlignHCenter
- validator: IntValidator { bottom: 0; top: 10 }
-
- Component.onCompleted: {
- text = Math.round(rootPane.visualiserRounding).toString();
- }
-
- onTextChanged: {
- if (activeFocus) {
- const val = parseInt(text);
- if (!isNaN(val) && val >= 0 && val <= 10) {
- rootPane.visualiserRounding = val;
- rootPane.saveConfig();
- }
- }
- }
- onEditingFinished: {
- const val = parseInt(text);
- if (isNaN(val) || val < 0 || val > 10) {
- text = Math.round(rootPane.visualiserRounding).toString();
- }
- }
- }
- }
+
+ label: qsTr("Visualiser rounding")
+ value: rootPane.visualiserRounding
+ from: 0
+ to: 10
+ stepSize: 1
+ validator: IntValidator { bottom: 0; top: 10 }
+ formatValueFunction: (val) => Math.round(val).toString()
+ parseValueFunction: (text) => parseInt(text)
+
+ onValueModified: (newValue) => {
+ rootPane.visualiserRounding = Math.round(newValue);
+ rootPane.saveConfig();
}
-
- StyledSlider {
- id: visualiserRoundingSlider
-
- Layout.fillWidth: true
- implicitHeight: Appearance.padding.normal * 3
-
- from: 0
- to: 10
- stepSize: 1
- value: rootPane.visualiserRounding
- onMoved: {
- rootPane.visualiserRounding = Math.round(visualiserRoundingSlider.value);
- if (!visualiserRoundingInput.activeFocus) {
- visualiserRoundingInput.text = Math.round(visualiserRoundingSlider.value).toString();
- }
- rootPane.saveConfig();
}
}
- }
- }
SectionContainer {
contentSpacing: Appearance.spacing.normal
- ColumnLayout {
+ SliderInput {
Layout.fillWidth: true
- spacing: Appearance.spacing.small
-
- RowLayout {
- Layout.fillWidth: true
- spacing: Appearance.spacing.normal
-
- StyledText {
- text: qsTr("Visualiser spacing")
- font.pointSize: Appearance.font.size.normal
- }
-
- Item {
- Layout.fillWidth: true
- }
-
- StyledRect {
- Layout.preferredWidth: 70
- implicitHeight: visualiserSpacingInput.implicitHeight + Appearance.padding.small * 2
- color: visualiserSpacingInputHover.containsMouse || visualiserSpacingInput.activeFocus
- ? Colours.layer(Colours.palette.m3surfaceContainer, 3)
- : Colours.layer(Colours.palette.m3surfaceContainer, 2)
- radius: Appearance.rounding.small
- border.width: 1
- border.color: visualiserSpacingInput.activeFocus
- ? Colours.palette.m3primary
- : Qt.alpha(Colours.palette.m3outline, 0.3)
-
- Behavior on color { CAnim {} }
- Behavior on border.color { CAnim {} }
-
- MouseArea {
- id: visualiserSpacingInputHover
- anchors.fill: parent
- hoverEnabled: true
- cursorShape: Qt.IBeamCursor
- acceptedButtons: Qt.NoButton
- }
-
- StyledTextField {
- id: visualiserSpacingInput
- anchors.centerIn: parent
- width: parent.width - Appearance.padding.normal
- horizontalAlignment: TextInput.AlignHCenter
- validator: DoubleValidator { bottom: 0; top: 2 }
-
- Component.onCompleted: {
- text = (rootPane.visualiserSpacing).toFixed(1);
- }
-
- onTextChanged: {
- if (activeFocus) {
- const val = parseFloat(text);
- if (!isNaN(val) && val >= 0 && val <= 2) {
- rootPane.visualiserSpacing = val;
- rootPane.saveConfig();
- }
- }
- }
- onEditingFinished: {
- const val = parseFloat(text);
- if (isNaN(val) || val < 0 || val > 2) {
- text = (rootPane.visualiserSpacing).toFixed(1);
- }
- }
- }
- }
- }
-
- StyledSlider {
- id: visualiserSpacingSlider
-
- Layout.fillWidth: true
- implicitHeight: Appearance.padding.normal * 3
-
- from: 0
- to: 2
- value: rootPane.visualiserSpacing
- onMoved: {
- rootPane.visualiserSpacing = visualiserSpacingSlider.value;
- if (!visualiserSpacingInput.activeFocus) {
- visualiserSpacingInput.text = (visualiserSpacingSlider.value).toFixed(1);
- }
- rootPane.saveConfig();
- }
+
+ label: qsTr("Visualiser spacing")
+ value: rootPane.visualiserSpacing
+ from: 0
+ to: 2
+ validator: DoubleValidator { bottom: 0; top: 2 }
+
+ onValueModified: (newValue) => {
+ rootPane.visualiserSpacing = newValue;
+ rootPane.saveConfig();
}
}
}
diff --git a/modules/controlcenter/components/DeviceDetails.qml b/modules/controlcenter/components/DeviceDetails.qml
index d2e8835..8cc9177 100644
--- a/modules/controlcenter/components/DeviceDetails.qml
+++ b/modules/controlcenter/components/DeviceDetails.qml
@@ -12,7 +12,7 @@ import QtQuick.Layouts
Item {
id: root
- required property Session session
+ property Session session
property var device: null
property Component headerComponent: null
diff --git a/modules/controlcenter/components/SliderInput.qml b/modules/controlcenter/components/SliderInput.qml
new file mode 100644
index 0000000..3d7cd4d
--- /dev/null
+++ b/modules/controlcenter/components/SliderInput.qml
@@ -0,0 +1,207 @@
+pragma ComponentBehavior: Bound
+
+import qs.components
+import qs.components.controls
+import qs.components.effects
+import qs.services
+import qs.config
+import QtQuick
+import QtQuick.Layouts
+
+ColumnLayout {
+ id: root
+
+ property string label: ""
+ property real value: 0
+ property real from: 0
+ property real to: 100
+ property real stepSize: 0
+ property var validator: null
+ property string suffix: "" // Optional suffix text (e.g., "×", "px")
+ property int decimals: 1 // Number of decimal places to show (default: 1)
+ property var formatValueFunction: null // Optional custom format function
+ property var parseValueFunction: null // Optional custom parse function
+
+ function formatValue(val: real): string {
+ if (formatValueFunction) {
+ return formatValueFunction(val);
+ }
+ // Default format function
+ // Check if it's an IntValidator (IntValidator doesn't have a 'decimals' property)
+ if (validator && validator.bottom !== undefined && validator.decimals === undefined) {
+ return Math.round(val).toString();
+ }
+ // For DoubleValidator or no validator, use the decimals property
+ return val.toFixed(root.decimals);
+ }
+
+ function parseValue(text: string): real {
+ if (parseValueFunction) {
+ return parseValueFunction(text);
+ }
+ // Default parse function
+ if (validator && validator.bottom !== undefined) {
+ // Check if it's an integer validator
+ if (validator.top !== undefined && validator.top === Math.floor(validator.top)) {
+ return parseInt(text);
+ }
+ }
+ return parseFloat(text);
+ }
+
+ signal valueModified(real newValue)
+
+ property bool _initialized: false
+
+ spacing: Appearance.spacing.small
+
+ Component.onCompleted: {
+ // Set initialized flag after a brief delay to allow component to fully load
+ Qt.callLater(() => {
+ _initialized = true;
+ });
+ }
+
+ RowLayout {
+ Layout.fillWidth: true
+ spacing: Appearance.spacing.normal
+
+ StyledText {
+ visible: root.label !== ""
+ text: root.label
+ font.pointSize: Appearance.font.size.normal
+ }
+
+ Item {
+ Layout.fillWidth: true
+ }
+
+ StyledRect {
+ Layout.preferredWidth: 70
+ implicitHeight: inputField.implicitHeight + Appearance.padding.small * 2
+ color: inputHover.containsMouse || inputField.activeFocus
+ ? Colours.layer(Colours.palette.m3surfaceContainer, 3)
+ : Colours.layer(Colours.palette.m3surfaceContainer, 2)
+ radius: Appearance.rounding.small
+ border.width: 1
+ border.color: inputField.activeFocus
+ ? Colours.palette.m3primary
+ : Qt.alpha(Colours.palette.m3outline, 0.3)
+
+ Behavior on color { CAnim {} }
+ Behavior on border.color { CAnim {} }
+
+ MouseArea {
+ id: inputHover
+ anchors.fill: parent
+ hoverEnabled: true
+ cursorShape: Qt.IBeamCursor
+ acceptedButtons: Qt.NoButton
+ }
+
+ StyledTextField {
+ id: inputField
+ anchors.centerIn: parent
+ width: parent.width - Appearance.padding.normal
+ horizontalAlignment: TextInput.AlignHCenter
+ validator: root.validator
+
+ Component.onCompleted: {
+ // Initialize text without triggering valueModified signal
+ text = root.formatValue(root.value);
+ }
+
+ onTextChanged: {
+ if (activeFocus) {
+ const val = root.parseValue(text);
+ if (!isNaN(val)) {
+ // Validate against validator bounds if available
+ let isValid = true;
+ if (root.validator) {
+ if (root.validator.bottom !== undefined && val < root.validator.bottom) {
+ isValid = false;
+ }
+ if (root.validator.top !== undefined && val > root.validator.top) {
+ isValid = false;
+ }
+ }
+
+ if (isValid) {
+ root.valueModified(val);
+ }
+ }
+ }
+ }
+
+ onEditingFinished: {
+ const val = root.parseValue(text);
+ let isValid = true;
+ if (root.validator) {
+ if (root.validator.bottom !== undefined && val < root.validator.bottom) {
+ isValid = false;
+ }
+ if (root.validator.top !== undefined && val > root.validator.top) {
+ isValid = false;
+ }
+ }
+
+ if (isNaN(val) || !isValid) {
+ text = root.formatValue(root.value);
+ }
+ }
+ }
+ }
+
+ StyledText {
+ visible: root.suffix !== ""
+ text: root.suffix
+ color: Colours.palette.m3outline
+ font.pointSize: Appearance.font.size.normal
+ }
+ }
+
+ StyledSlider {
+ id: slider
+
+ Layout.fillWidth: true
+ implicitHeight: Appearance.padding.normal * 3
+
+ from: root.from
+ to: root.to
+ stepSize: root.stepSize
+
+ // Use Binding to allow slider to move freely during dragging
+ Binding {
+ target: slider
+ property: "value"
+ value: root.value
+ when: !slider.pressed
+ }
+
+ onValueChanged: {
+ // Update input field text in real-time as slider moves during dragging
+ // Always update when slider value changes (during dragging or external updates)
+ if (!inputField.activeFocus) {
+ const newValue = root.stepSize > 0 ? Math.round(value / root.stepSize) * root.stepSize : value;
+ inputField.text = root.formatValue(newValue);
+ }
+ }
+
+ onMoved: {
+ const newValue = root.stepSize > 0 ? Math.round(value / root.stepSize) * root.stepSize : value;
+ root.valueModified(newValue);
+ if (!inputField.activeFocus) {
+ inputField.text = root.formatValue(newValue);
+ }
+ }
+ }
+
+ // Update input field when value changes externally (slider is already bound)
+ onValueChanged: {
+ // Only update if component is initialized to avoid issues during creation
+ if (root._initialized && !inputField.activeFocus) {
+ inputField.text = root.formatValue(root.value);
+ }
+ }
+}
+
diff --git a/modules/controlcenter/components/controls/SliderInput.qml b/modules/controlcenter/components/controls/SliderInput.qml
new file mode 100644
index 0000000..a114f7f
--- /dev/null
+++ b/modules/controlcenter/components/controls/SliderInput.qml
@@ -0,0 +1,179 @@
+pragma ComponentBehavior: Bound
+
+import ".."
+import qs.components
+import qs.components.controls
+import qs.components.effects
+import QtQuick
+import QtQuick.Layouts
+
+ColumnLayout {
+ id: root
+
+ property string label: ""
+ property real value: 0
+ property real from: 0
+ property real to: 100
+ property real stepSize: 0
+ property var validator: null
+ property string suffix: "" // Optional suffix text (e.g., "×", "px")
+ property var formatValueFunction: null // Optional custom format function
+ property var parseValueFunction: null // Optional custom parse function
+
+ function formatValue(val: real): string {
+ if (formatValueFunction) {
+ return formatValueFunction(val);
+ }
+ // Default format function
+ if (validator && validator.bottom !== undefined) {
+ // Check if it's an integer validator
+ if (validator.top !== undefined && validator.top === Math.floor(validator.top)) {
+ return Math.round(val).toString();
+ }
+ }
+ return val.toFixed(1);
+ }
+
+ function parseValue(text: string): real {
+ if (parseValueFunction) {
+ return parseValueFunction(text);
+ }
+ // Default parse function
+ if (validator && validator.bottom !== undefined) {
+ // Check if it's an integer validator
+ if (validator.top !== undefined && validator.top === Math.floor(validator.top)) {
+ return parseInt(text);
+ }
+ }
+ return parseFloat(text);
+ }
+
+ signal valueChanged(real newValue)
+
+ spacing: Appearance.spacing.small
+
+ RowLayout {
+ Layout.fillWidth: true
+ spacing: Appearance.spacing.normal
+
+ StyledText {
+ visible: root.label !== ""
+ text: root.label
+ font.pointSize: Appearance.font.size.normal
+ }
+
+ Item {
+ Layout.fillWidth: true
+ }
+
+ StyledRect {
+ Layout.preferredWidth: 70
+ implicitHeight: inputField.implicitHeight + Appearance.padding.small * 2
+ color: inputHover.containsMouse || inputField.activeFocus
+ ? Colours.layer(Colours.palette.m3surfaceContainer, 3)
+ : Colours.layer(Colours.palette.m3surfaceContainer, 2)
+ radius: Appearance.rounding.small
+ border.width: 1
+ border.color: inputField.activeFocus
+ ? Colours.palette.m3primary
+ : Qt.alpha(Colours.palette.m3outline, 0.3)
+
+ Behavior on color { CAnim {} }
+ Behavior on border.color { CAnim {} }
+
+ MouseArea {
+ id: inputHover
+ anchors.fill: parent
+ hoverEnabled: true
+ cursorShape: Qt.IBeamCursor
+ acceptedButtons: Qt.NoButton
+ }
+
+ StyledTextField {
+ id: inputField
+ anchors.centerIn: parent
+ width: parent.width - Appearance.padding.normal
+ horizontalAlignment: TextInput.AlignHCenter
+ validator: root.validator
+
+ Component.onCompleted: {
+ text = root.formatValue(root.value);
+ }
+
+ onTextChanged: {
+ if (activeFocus) {
+ const val = root.parseValue(text);
+ if (!isNaN(val)) {
+ // Validate against validator bounds if available
+ let isValid = true;
+ if (root.validator) {
+ if (root.validator.bottom !== undefined && val < root.validator.bottom) {
+ isValid = false;
+ }
+ if (root.validator.top !== undefined && val > root.validator.top) {
+ isValid = false;
+ }
+ }
+
+ if (isValid) {
+ root.valueChanged(val);
+ }
+ }
+ }
+ }
+
+ onEditingFinished: {
+ const val = root.parseValue(text);
+ let isValid = true;
+ if (root.validator) {
+ if (root.validator.bottom !== undefined && val < root.validator.bottom) {
+ isValid = false;
+ }
+ if (root.validator.top !== undefined && val > root.validator.top) {
+ isValid = false;
+ }
+ }
+
+ if (isNaN(val) || !isValid) {
+ text = root.formatValue(root.value);
+ }
+ }
+ }
+ }
+
+ StyledText {
+ visible: root.suffix !== ""
+ text: root.suffix
+ color: Colours.palette.m3outline
+ font.pointSize: Appearance.font.size.normal
+ }
+ }
+
+ StyledSlider {
+ id: slider
+
+ Layout.fillWidth: true
+ implicitHeight: Appearance.padding.normal * 3
+
+ from: root.from
+ to: root.to
+ stepSize: root.stepSize
+ value: root.value
+
+ onMoved: {
+ const newValue = root.stepSize > 0 ? Math.round(value / root.stepSize) * root.stepSize : value;
+ root.valueChanged(newValue);
+ if (!inputField.activeFocus) {
+ inputField.text = root.formatValue(newValue);
+ }
+ }
+ }
+
+ // Update input field when value changes externally (slider is already bound)
+ onValueChanged: {
+ if (!inputField.activeFocus) {
+ inputField.text = root.formatValue(root.value);
+ }
+ }
+}
+
diff --git a/modules/controlcenter/network/EthernetDetails.qml b/modules/controlcenter/network/EthernetDetails.qml
index ad078ec..1cd6c0a 100644
--- a/modules/controlcenter/network/EthernetDetails.qml
+++ b/modules/controlcenter/network/EthernetDetails.qml
@@ -15,8 +15,8 @@ DeviceDetails {
id: root
required property Session session
- readonly property var ethernetDevice: session.ethernet.active
-
+ readonly property var ethernetDevice: root.session.ethernet.active
+
device: ethernetDevice
Component.onCompleted: {
diff --git a/modules/controlcenter/network/WirelessDetails.qml b/modules/controlcenter/network/WirelessDetails.qml
index cf16400..47d42c2 100644
--- a/modules/controlcenter/network/WirelessDetails.qml
+++ b/modules/controlcenter/network/WirelessDetails.qml
@@ -17,8 +17,8 @@ DeviceDetails {
id: root
required property Session session
- readonly property var network: session.network.active
-
+ readonly property var network: root.session.network.active
+
device: network
Component.onCompleted: {
diff --git a/modules/controlcenter/taskbar/TaskbarPane.qml b/modules/controlcenter/taskbar/TaskbarPane.qml
index f452b07..38c1179 100644
--- a/modules/controlcenter/taskbar/TaskbarPane.qml
+++ b/modules/controlcenter/taskbar/TaskbarPane.qml
@@ -1,6 +1,7 @@
pragma ComponentBehavior: Bound
import ".."
+import "../components"
import qs.components
import qs.components.controls
import qs.components.effects
@@ -520,98 +521,21 @@ Item {
SectionContainer {
contentSpacing: Appearance.spacing.normal
- ColumnLayout {
+ SliderInput {
Layout.fillWidth: true
- spacing: Appearance.spacing.small
-
- RowLayout {
- Layout.fillWidth: true
- spacing: Appearance.spacing.normal
-
- StyledText {
- text: qsTr("Drag threshold")
- font.pointSize: Appearance.font.size.normal
- }
-
- Item {
- Layout.fillWidth: true
- }
-
- StyledRect {
- Layout.preferredWidth: 70
- implicitHeight: dragThresholdInput.implicitHeight + Appearance.padding.small * 2
- color: dragThresholdInputHover.containsMouse || dragThresholdInput.activeFocus
- ? Colours.layer(Colours.palette.m3surfaceContainer, 3)
- : Colours.layer(Colours.palette.m3surfaceContainer, 2)
- radius: Appearance.rounding.small
- border.width: 1
- border.color: dragThresholdInput.activeFocus
- ? Colours.palette.m3primary
- : Qt.alpha(Colours.palette.m3outline, 0.3)
-
- Behavior on color { CAnim {} }
- Behavior on border.color { CAnim {} }
-
- MouseArea {
- id: dragThresholdInputHover
- anchors.fill: parent
- hoverEnabled: true
- cursorShape: Qt.IBeamCursor
- acceptedButtons: Qt.NoButton
- }
-
- StyledTextField {
- id: dragThresholdInput
- anchors.centerIn: parent
- width: parent.width - Appearance.padding.normal
- horizontalAlignment: TextInput.AlignHCenter
- validator: IntValidator { bottom: 0; top: 100 }
-
- Component.onCompleted: {
- text = root.dragThreshold.toString();
- }
-
- onTextChanged: {
- if (activeFocus) {
- const val = parseInt(text);
- if (!isNaN(val) && val >= 0 && val <= 100) {
- root.dragThreshold = val;
- root.saveConfig();
- }
- }
- }
- onEditingFinished: {
- const val = parseInt(text);
- if (isNaN(val) || val < 0 || val > 100) {
- text = root.dragThreshold.toString();
- }
- }
- }
- }
-
- StyledText {
- text: "px"
- color: Colours.palette.m3outline
- font.pointSize: Appearance.font.size.normal
- }
- }
-
- StyledSlider {
- id: dragThresholdSlider
-
- Layout.fillWidth: true
- implicitHeight: Appearance.padding.normal * 3
-
- from: 0
- to: 100
- value: root.dragThreshold
- onMoved: {
- root.dragThreshold = Math.round(dragThresholdSlider.value);
- if (!dragThresholdInput.activeFocus) {
- dragThresholdInput.text = Math.round(dragThresholdSlider.value).toString();
- }
- root.saveConfig();
- }
+
+ label: qsTr("Drag threshold")
+ value: root.dragThreshold
+ from: 0
+ to: 100
+ suffix: "px"
+ validator: IntValidator { bottom: 0; top: 100 }
+ formatValueFunction: (val) => Math.round(val).toString()
+ parseValueFunction: (text) => parseInt(text)
+
+ onValueModified: (newValue) => {
+ root.dragThreshold = Math.round(newValue);
+ root.saveConfig();
}
}
}