diff --git a/package/contents/config/main.xml b/package/contents/config/main.xml
index 8cdc022..124a6a2 100644
--- a/package/contents/config/main.xml
+++ b/package/contents/config/main.xml
@@ -6,6 +6,7 @@
+
@@ -16,7 +17,7 @@
.
-
+
#ffffff
@@ -35,6 +36,27 @@
220
+
+
+ false
+
+
+
+ #80000000
+
+
+
+ 10
+
+
+
+ 0
+
+
+
+ 0
+
+
@@ -60,6 +82,27 @@
100
+
+
+ false
+
+
+
+ #80000000
+
+
+
+ 10
+
+
+
+ 0
+
+
+
+ 0
+
+
@@ -93,5 +136,26 @@
2
+
+
+ false
+
+
+
+ #80000000
+
+
+
+ 10
+
+
+
+ 0
+
+
+
+ 0
+
+
diff --git a/package/contents/ui/config/configAppearance.qml b/package/contents/ui/config/configAppearance.qml
index 6422fba..1046465 100644
--- a/package/contents/ui/config/configAppearance.qml
+++ b/package/contents/ui/config/configAppearance.qml
@@ -26,6 +26,11 @@ Item {
property bool cfg_clockBoldText
property bool cfg_clockItalicText
property int cfg_clockFontSize
+ property alias cfg_clockShadowEnabled: clockShadowCheckBox.checked
+ property color cfg_clockShadowColor
+ property int cfg_clockShadowRadius
+ property int cfg_clockShadowXOffset
+ property int cfg_clockShadowYOffset
property alias cfg_showDayDisplay: showDayDisplayCheckBox.checked
property string cfg_dayFontColor
@@ -33,6 +38,11 @@ Item {
property bool cfg_dayBoldText
property bool cfg_dayItalicText
property int cfg_dayFontSize
+ property alias cfg_dayShadowEnabled: dayShadowCheckBox.checked
+ property color cfg_dayShadowColor
+ property int cfg_dayShadowRadius
+ property int cfg_dayShadowXOffset
+ property int cfg_dayShadowYOffset
property alias cfg_showDateDisplay: showDateDisplayCheckBox.checked
property alias cfg_dateCustomDateFormat: customDateFormat.text
@@ -41,6 +51,11 @@ Item {
property bool cfg_dateBoldText
property bool cfg_dateItalicText
property int cfg_dateFontSize
+ property alias cfg_dateShadowEnabled: dateShadowCheckBox.checked
+ property color cfg_dateShadowColor
+ property int cfg_dateShadowRadius
+ property int cfg_dateShadowXOffset
+ property int cfg_dateShadowYOffset
function fixFontFamilyChange(id, comboBox) {
@@ -88,178 +103,276 @@ Item {
}
}
- QtLayouts.ColumnLayout {
- id: layout
- anchors.fill: parent
+ QtControls.ScrollView {
+ id: scrollView
QtLayouts.ColumnLayout {
- QtLayouts.Layout.fillWidth: true
- spacing: 10
+ id: layout
+ anchors.fill: parent
+ spacing: 30
- QtControls.Label {
- text: i18n("Clock Display Settings")
- font.bold: true
- font.pixelSize: 17
- }
-
- QtControls.CheckBox {
- id: use24hFormat
- text: i18n("Use 24-hour clock")
- tristate: false
- checked: cfg_clockUse24hFormat
- }
-
- QtLayouts.RowLayout {
- QtControls.Label {
- text: i18n("Separator:")
- }
-
- QtControls.TextField {
- id: clockSeparatorTextField
- maximumLength: 1
- }
- }
-
- FontConfig {
- fontModel: fontsModel
-
- colorValue: cfg_clockFontColor
- onColorValueChanged: {
- cfg_clockFontColor = colorValue
- }
-
- fontValue: cgf_clockFontFamily
- onFontValueChanged: {
- cfg_clockFontFamily = fontValue
- }
-
- boldValue: cfg_clockBoldText
- onBoldValueChanged: {
- cfg_clockBoldText = boldValue
- }
-
- italicValue: cfg_clockItalicText
- onItalicValueChanged: {
- cfg_clockItalicText = italicValue
- }
-
- pxSizeValue: cfg_clockFontSize
- onPxSizeValueChanged: {
- cfg_clockFontSize = pxSizeValue
- }
- }
- }
-
- QtLayouts.ColumnLayout {
- QtLayouts.Layout.fillWidth: true
- spacing: 10
-
- QtControls.Label {
- text: i18n("Day Display Settings")
- font.bold: true
- font.pixelSize: 17
- }
-
- QtControls.CheckBox {
- id: showDayDisplayCheckBox
- text: i18n("Show day display")
- }
-
- FontConfig {
- fontModel: fontsModel
- enabled: showDayDisplayCheckBox.checked
-
- colorValue: cfg_dayFontColor
- onColorValueChanged: {
- cfg_dayFontColor = colorValue
- }
-
- fontValue: cgf_dayFontFamily
- onFontValueChanged: {
- cfg_dayFontFamily = fontValue
- }
-
- boldValue: cfg_dayBoldText
- onBoldValueChanged: {
- cfg_dayBoldText = boldValue
- }
-
- italicValue: cfg_dayItalicText
- onItalicValueChanged: {
- cfg_dayItalicText = italicValue
- }
-
- pxSizeValue: cfg_dayFontSize
- onPxSizeValueChanged: {
- cfg_dayFontSize = pxSizeValue
- }
- }
- }
-
- QtLayouts.ColumnLayout {
- QtLayouts.Layout.fillWidth: true
- spacing: 10
-
- QtControls.Label {
- text: i18n("Date Display Settings")
- font.bold: true
- font.pixelSize: 17
- }
-
- QtControls.CheckBox {
- id: showDateDisplayCheckBox
- text: i18n("Show date display")
- }
-
- QtLayouts.RowLayout {
- enabled: showDateDisplayCheckBox.checked
+ QtLayouts.ColumnLayout {
+ QtLayouts.Layout.fillWidth: true
+ spacing: 10
QtControls.Label {
- text: i18n("Date format:")
- opacity: if (enabled) 1
- else 0.4
+ text: i18n("Clock Display Settings")
+ font.bold: true
+ font.pixelSize: 17
+ }
+
+ QtControls.CheckBox {
+ id: use24hFormat
+ text: i18n("Use 24-hour clock")
+ tristate: false
+ checked: cfg_clockUse24hFormat
}
QtLayouts.RowLayout {
- QtControls.TextField {
- id: customDateFormat
- QtLayouts.Layout.fillWidth: true
+ QtControls.Label {
+ text: i18n("Separator:")
}
- QtControls.Button {
- icon.name: "exifinfo"
- onClicked: Qt.openUrlExternally("https://doc.qt.io/qt-5/qml-qtqml-qt.html#formatDateTime-method")
+ QtControls.TextField {
+ id: clockSeparatorTextField
+ maximumLength: 1
+ }
+ }
+
+ FontConfig {
+ fontModel: fontsModel
+
+ colorValue: cfg_clockFontColor
+ onColorValueChanged: {
+ cfg_clockFontColor = colorValue
+ }
+
+ fontValue: cgf_clockFontFamily
+ onFontValueChanged: {
+ cfg_clockFontFamily = fontValue
+ }
+
+ boldValue: cfg_clockBoldText
+ onBoldValueChanged: {
+ cfg_clockBoldText = boldValue
+ }
+
+ italicValue: cfg_clockItalicText
+ onItalicValueChanged: {
+ cfg_clockItalicText = italicValue
+ }
+
+ pxSizeValue: cfg_clockFontSize
+ onPxSizeValueChanged: {
+ cfg_clockFontSize = pxSizeValue
+ }
+ }
+
+ QtControls.CheckBox {
+ id: clockShadowCheckBox
+ text: i18n("Enable shadow")
+ tristate: false
+ checked: cfg_clockShadowEnabled
+ }
+
+ ShadowConfig {
+ enabled: clockShadowCheckBox.checked
+
+ colorValue: cfg_clockShadowColor
+ onColorValueChanged: {
+ cfg_clockShadowColor = colorValue
+ }
+
+ radiusValue: cfg_clockShadowRadius
+ onRadiusValueChanged: {
+ cfg_clockShadowRadius = radiusValue
+ }
+
+ offsetXValue: cfg_clockShadowXOffset
+ onOffsetXValueChanged: {
+ cfg_clockShadowXOffset = offsetXValue
+ }
+
+ offsetYValue: cfg_clockShadowYOffset
+ onOffsetYValueChanged: {
+ cfg_clockShadowYOffset = offsetYValue
}
}
}
- FontConfig {
- fontModel: fontsModel
- enabled: showDateDisplayCheckBox.checked
+ QtLayouts.ColumnLayout {
+ QtLayouts.Layout.fillWidth: true
+ spacing: 10
- colorValue: cfg_dateFontColor
- onColorValueChanged: {
- cfg_dateFontColor = colorValue
+ QtControls.Label {
+ text: i18n("Day Display Settings")
+ font.bold: true
+ font.pixelSize: 17
}
- fontValue: cgf_dateFontFamily
- onFontValueChanged: {
- cfg_dateFontFamily = fontValue
+ QtControls.CheckBox {
+ id: showDayDisplayCheckBox
+ text: i18n("Show day display")
}
- boldValue: cfg_dateBoldText
- onBoldValueChanged: {
- cfg_dateBoldText = boldValue
+ FontConfig {
+ fontModel: fontsModel
+ enabled: showDayDisplayCheckBox.checked
+
+ colorValue: cfg_dayFontColor
+ onColorValueChanged: {
+ cfg_dayFontColor = colorValue
+ }
+
+ fontValue: cgf_dayFontFamily
+ onFontValueChanged: {
+ cfg_dayFontFamily = fontValue
+ }
+
+ boldValue: cfg_dayBoldText
+ onBoldValueChanged: {
+ cfg_dayBoldText = boldValue
+ }
+
+ italicValue: cfg_dayItalicText
+ onItalicValueChanged: {
+ cfg_dayItalicText = italicValue
+ }
+
+ pxSizeValue: cfg_dayFontSize
+ onPxSizeValueChanged: {
+ cfg_dayFontSize = pxSizeValue
+ }
}
- italicValue: cfg_dateItalicText
- onItalicValueChanged: {
- cfg_dateItalicText = italicValue
+ QtControls.CheckBox {
+ id: dayShadowCheckBox
+ text: i18n("Enable shadow")
+ tristate: false
+ checked: cfg_dayShadowEnabled
}
- pxSizeValue: cfg_dateFontSize
- onPxSizeValueChanged: {
- cfg_dateFontSize = pxSizeValue
+ ShadowConfig {
+ enabled: dayShadowCheckBox.checked
+
+ colorValue: cfg_dayShadowColor
+ onColorValueChanged: {
+ cfg_dayShadowColor = colorValue
+ }
+
+ radiusValue: cfg_dayShadowRadius
+ onRadiusValueChanged: {
+ cfg_dayShadowRadius = radiusValue
+ }
+
+ offsetXValue: cfg_dayShadowXOffset
+ onOffsetXValueChanged: {
+ cfg_dayShadowXOffset = offsetXValue
+ }
+
+ offsetYValue: cfg_clockShadowYOffset
+ onOffsetYValueChanged: {
+ cfg_dayShadowYOffset = offsetYValue
+ }
+ }
+ }
+
+ QtLayouts.ColumnLayout {
+ QtLayouts.Layout.fillWidth: true
+ spacing: 10
+
+ QtControls.Label {
+ text: i18n("Date Display Settings")
+ font.bold: true
+ font.pixelSize: 17
+ }
+
+ QtControls.CheckBox {
+ id: showDateDisplayCheckBox
+ text: i18n("Show date display")
+ }
+
+ QtLayouts.RowLayout {
+ enabled: showDateDisplayCheckBox.checked
+
+ QtControls.Label {
+ text: i18n("Date format:")
+ opacity: if (enabled) 1
+ else 0.4
+ }
+
+ QtLayouts.RowLayout {
+ QtControls.TextField {
+ id: customDateFormat
+ QtLayouts.Layout.fillWidth: true
+ }
+
+ QtControls.Button {
+ icon.name: "exifinfo"
+ onClicked: Qt.openUrlExternally("https://doc.qt.io/qt-5/qml-qtqml-qt.html#formatDateTime-method")
+ }
+ }
+ }
+
+ FontConfig {
+ fontModel: fontsModel
+ enabled: showDateDisplayCheckBox.checked
+
+ colorValue: cfg_dateFontColor
+ onColorValueChanged: {
+ cfg_dateFontColor = colorValue
+ }
+
+ fontValue: cgf_dateFontFamily
+ onFontValueChanged: {
+ cfg_dateFontFamily = fontValue
+ }
+
+ boldValue: cfg_dateBoldText
+ onBoldValueChanged: {
+ cfg_dateBoldText = boldValue
+ }
+
+ italicValue: cfg_dateItalicText
+ onItalicValueChanged: {
+ cfg_dateItalicText = italicValue
+ }
+
+ pxSizeValue: cfg_dateFontSize
+ onPxSizeValueChanged: {
+ cfg_dateFontSize = pxSizeValue
+ }
+ }
+
+ QtControls.CheckBox {
+ id: dateShadowCheckBox
+ text: i18n("Enable shadow")
+ tristate: false
+ checked: cfg_dateShadowEnabled
+ }
+
+ ShadowConfig {
+ enabled: dateShadowCheckBox.checked
+
+ colorValue: cfg_dateShadowColor
+ onColorValueChanged: {
+ cfg_dateShadowColor = colorValue
+ }
+
+ radiusValue: cfg_dateShadowRadius
+ onRadiusValueChanged: {
+ cfg_dateShadowRadius = radiusValue
+ }
+
+ offsetXValue: cfg_dateShadowXOffset
+ onOffsetXValueChanged: {
+ cfg_dateShadowXOffset = offsetXValue
+ }
+
+ offsetYValue: cfg_dateShadowYOffset
+ onOffsetYValueChanged: {
+ cfg_dateShadowYOffset = offsetYValue
+ }
}
}
}
diff --git a/package/contents/ui/lib/ShadowConfig.qml b/package/contents/ui/lib/ShadowConfig.qml
new file mode 100644
index 0000000..5fc28e7
--- /dev/null
+++ b/package/contents/ui/lib/ShadowConfig.qml
@@ -0,0 +1,77 @@
+import QtQuick 2.4
+import QtQuick.Controls 2.12 as QtControls
+import QtQuick.Layouts 1.15 as QtLayouts
+import QtLocation 5.12
+import QtQuick.Dialogs 1.2
+
+import "."
+
+QtLayouts.RowLayout {
+
+ property color colorValue
+ property int radiusValue
+ property int offsetXValue
+ property int offsetYValue
+
+
+ QtControls.Label {
+ text: i18n("Shadow style:")
+ opacity: if (enabled) 1
+ else 0.4
+ }
+
+ ColorButton {
+ id: shadowColorButton
+ value: colorValue
+
+ onValueChanged: {
+ colorValue = value
+ }
+ }
+
+ QtControls.Label {
+ text: i18n("Radius")
+ opacity: if (enabled) 1
+ else 0.4
+ }
+
+ QtControls.SpinBox {
+ id: radiusSpinBox
+ from: 0
+ to: 25
+ value: radiusValue
+
+ onValueChanged: {
+ radiusValue = value
+ }
+ }
+
+ QtControls.Label {
+ text: i18n("Offset")
+ opacity: if (enabled) 1
+ else 0.4
+ }
+
+ QtControls.SpinBox {
+ id: offsetXSpinBox
+ from: 0
+ to: 25
+ value: offsetXValue
+
+ onValueChanged: {
+ offsetXValue = value
+ }
+ }
+
+ QtControls.SpinBox {
+ id: offsetYSpinBox
+ from: 0
+ to: 25
+ value: offsetYValue
+
+ onValueChanged: {
+ offsetYValue = value
+ }
+ }
+
+}
diff --git a/package/contents/ui/main.qml b/package/contents/ui/main.qml
index 50eaa81..390218d 100644
--- a/package/contents/ui/main.qml
+++ b/package/contents/ui/main.qml
@@ -5,6 +5,7 @@
import QtQuick 2.12
import QtQuick.Layouts 1.12
+import QtGraphicalEffects 1.12
import org.kde.plasma.core 2.0 as PlasmaCore
import org.kde.plasma.plasmoid 2.0
@@ -67,7 +68,7 @@ Item {
height: Math.max(textMetricsClockLabel.height, textMetricsDayLabel.height)
Layout.alignment: Qt.AlignCenter
- PlasmaComponents.Label {
+ Text {
id: clockLabel
anchors.centerIn: parent
@@ -80,9 +81,18 @@ Item {
font.bold: plasmoid.configuration.clockBoldText
font.italic: plasmoid.configuration.clockItalicText
font.pixelSize: plasmoid.configuration.clockFontSize
+
+ layer.enabled: plasmoid.configuration.clockShadowEnabled
+ layer.effect: DropShadow {
+ color: plasmoid.configuration.clockShadowColor
+ radius: plasmoid.configuration.clockShadowRadius
+ horizontalOffset: plasmoid.configuration.clockShadowXOffset
+ verticalOffset: plasmoid.configuration.clockShadowYOffset
+ samples: 10
+ }
}
- PlasmaComponents.Label {
+ Text {
id: dayLabel
visible: plasmoid.configuration.showDayDisplay
anchors.centerIn: parent
@@ -95,10 +105,19 @@ Item {
font.bold: plasmoid.configuration.daykBoldText
font.italic: plasmoid.configuration.dayItalicText
font.pixelSize: plasmoid.configuration.dayFontSize
+
+ layer.enabled: plasmoid.configuration.dayShadowEnabled
+ layer.effect: DropShadow {
+ color: plasmoid.configuration.dayShadowColor
+ radius: plasmoid.configuration.dayShadowRadius
+ horizontalOffset: plasmoid.configuration.dayShadowXOffset
+ verticalOffset: plasmoid.configuration.dayShadowYOffset
+ samples: 10
+ }
}
}
- PlasmaComponents.Label {
+ Text {
id: dateLabel
visible: plasmoid.configuration.showDateDisplay
Layout.alignment: Qt.AlignCenter
@@ -113,6 +132,15 @@ Item {
font.pixelSize: plasmoid.configuration.dateFontSize
font.capitalization: Font.AllUppercase
font.letterSpacing: plasmoid.configuration.dateLetterSpacing
+
+ layer.enabled: plasmoid.configuration.dateShadowEnabled
+ layer.effect: DropShadow {
+ color: plasmoid.configuration.dateShadowColor
+ radius: plasmoid.configuration.dateShadowRadius
+ horizontalOffset: plasmoid.configuration.dateShadowXOffset
+ verticalOffset: plasmoid.configuration.dateShadowYOffset
+ samples: 10
+ }
}
}
}