diff options
Diffstat (limited to 'modules/controlcenter/appearance/sections/BackgroundSection.qml')
| -rw-r--r-- | modules/controlcenter/appearance/sections/BackgroundSection.qml | 200 |
1 files changed, 196 insertions, 4 deletions
diff --git a/modules/controlcenter/appearance/sections/BackgroundSection.qml b/modules/controlcenter/appearance/sections/BackgroundSection.qml index 8754e73..d5c16d4 100644 --- a/modules/controlcenter/appearance/sections/BackgroundSection.qml +++ b/modules/controlcenter/appearance/sections/BackgroundSection.qml @@ -19,7 +19,23 @@ CollapsibleSection { showBackground: true SwitchRow { - label: qsTr("Desktop clock") + label: qsTr("Background enabled") + checked: rootPane.backgroundEnabled + onToggled: checked => { + rootPane.backgroundEnabled = checked; + rootPane.saveConfig(); + } + } + + StyledText { + Layout.topMargin: Appearance.spacing.normal + text: qsTr("Desktop Clock") + font.pointSize: Appearance.font.size.larger + font.weight: 500 + } + + SwitchRow { + label: qsTr("Desktop Clock enabled") checked: rootPane.desktopClockEnabled onToggled: checked => { rootPane.desktopClockEnabled = checked; @@ -27,15 +43,191 @@ CollapsibleSection { } } + SectionContainer { + id: posContainer + + contentSpacing: Appearance.spacing.small + z: 1 + + readonly property var pos: (rootPane.desktopClockPosition || "top-left").split('-') + readonly property string currentV: pos[0] + readonly property string currentH: pos[1] + + function updateClockPos(v, h) { + rootPane.desktopClockPosition = v + "-" + h; + rootPane.saveConfig(); + } + + StyledText { + text: qsTr("Positioning") + font.pointSize: Appearance.font.size.larger + font.weight: 500 + } + + SplitButtonRow { + label: qsTr("Vertical Position") + enabled: rootPane.desktopClockEnabled + + menuItems: [ + MenuItem { text: qsTr("Top"); icon: "vertical_align_top"; property string val: "top" }, + MenuItem { text: qsTr("Middle"); icon: "vertical_align_center"; property string val: "middle" }, + MenuItem { text: qsTr("Bottom"); icon: "vertical_align_bottom"; property string val: "bottom" } + ] + + Component.onCompleted: { + for(let i=0; i < menuItems.length; i++) { + if(menuItems[i].val === posContainer.currentV) active = menuItems[i]; + } + } + + // The signal from SplitButtonRow + onSelected: item => posContainer.updateClockPos(item.val, posContainer.currentH) + } + + SplitButtonRow { + label: qsTr("Horizontal Position") + enabled: rootPane.desktopClockEnabled + expandedZ: 99 + + menuItems: [ + MenuItem { text: qsTr("Left"); icon: "align_horizontal_left"; property string val: "left" }, + MenuItem { text: qsTr("Center"); icon: "align_horizontal_center"; property string val: "center" }, + MenuItem { text: qsTr("Right"); icon: "align_horizontal_right"; property string val: "right" } + ] + + Component.onCompleted: { + for(let i=0; i < menuItems.length; i++) { + if(menuItems[i].val === posContainer.currentH) active = menuItems[i]; + } + } + + onSelected: item => posContainer.updateClockPos(posContainer.currentV, item.val) + } + } + SwitchRow { - label: qsTr("Background enabled") - checked: rootPane.backgroundEnabled + label: qsTr("Invert colors") + checked: rootPane.desktopClockInvertColors onToggled: checked => { - rootPane.backgroundEnabled = checked; + rootPane.desktopClockInvertColors = checked; rootPane.saveConfig(); } } + SectionContainer { + contentSpacing: Appearance.spacing.small + + StyledText { + text: qsTr("Shadow") + font.pointSize: Appearance.font.size.larger + font.weight: 500 + } + + SwitchRow { + label: qsTr("Enabled") + checked: rootPane.desktopClockShadowEnabled + onToggled: checked => { + rootPane.desktopClockShadowEnabled = checked; + rootPane.saveConfig(); + } + } + + SectionContainer { + contentSpacing: Appearance.spacing.normal + + SliderInput { + Layout.fillWidth: true + + label: qsTr("Opacity") + value: rootPane.desktopClockShadowOpacity * 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.desktopClockShadowOpacity = newValue / 100; + rootPane.saveConfig(); + } + } + } + + SectionContainer { + contentSpacing: Appearance.spacing.normal + + SliderInput { + Layout.fillWidth: true + + label: qsTr("Blur") + value: rootPane.desktopClockShadowBlur * 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.desktopClockShadowBlur = newValue / 100; + rootPane.saveConfig(); + } + } + } + } + + SectionContainer { + contentSpacing: Appearance.spacing.small + + StyledText { + text: qsTr("Background") + font.pointSize: Appearance.font.size.larger + font.weight: 500 + } + + SwitchRow { + label: qsTr("Enabled") + checked: rootPane.desktopClockBackgroundEnabled + onToggled: checked => { + rootPane.desktopClockBackgroundEnabled = checked; + rootPane.saveConfig(); + } + } + + SwitchRow { + label: qsTr("Blur enabled") + checked: rootPane.desktopClockBackgroundBlur + onToggled: checked => { + rootPane.desktopClockBackgroundBlur = checked; + rootPane.saveConfig(); + } + } + + SectionContainer { + contentSpacing: Appearance.spacing.normal + + SliderInput { + Layout.fillWidth: true + + label: qsTr("Opacity") + value: rootPane.desktopClockBackgroundOpacity * 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.desktopClockBackgroundOpacity = newValue / 100; + rootPane.saveConfig(); + } + } + } + } + + StyledText { Layout.topMargin: Appearance.spacing.normal text: qsTr("Visualiser") |