PreferencesDialog: Add accent color option

Author: adazem009

src/app/qml/dialogs/PreferencesDialog.qml

@@ -17,6 +17,31 @@ CustomDialog {
  ThemeEngine.reloadTheme();
  }
 
+ QtObject {
+ id: priv
+ property int accentColorIndex: -1
+
+ readonly property list<color> darkAccentColors: [
+ Qt.rgba(0.85, 0.31, 0.33, 1),
+ Qt.rgba(0.85, 0.62, 0.31, 1),
+ Qt.rgba(0.85, 0.84, 0.31, 1),
+ Qt.rgba(0.39, 0.85, 0.31, 1),
+ Qt.rgba(0.31, 0.75, 0.85, 1),
+ Qt.rgba(0.32, 0.32, 0.85, 1),
+ Qt.rgba(0.68, 0.31, 0.85, 1),
+ ]
+
+ readonly property list<color> lightAccentColors: [
+ Qt.rgba(0.75, 0.08, 0.09, 1),
+ Qt.rgba(0.75, 0.47, 0.08, 1),
+ Qt.rgba(0.75, 0.74, 0.08, 1),
+ Qt.rgba(0.17, 0.75, 0.08, 1),
+ Qt.rgba(0.08, 0.63, 0.75, 1),
+ Qt.rgba(0.08, 0.08, 0.75, 1),
+ Qt.rgba(0.54, 0.08, 0.75, 1),
+ ]
+ }
+
  contentItem: ColumnLayout {
  // Themes
  Label {
@@ -38,5 +63,47 @@ CustomDialog {
  onCheckedChanged: if(checked) ThemeEngine.theme = ThemeEngine.DarkTheme
  }
  }
+
+ RowLayout {
+ Label {
+ text: qsTr("Accent color:")
+ }
+
+ Repeater {
+ id: accentColors
+ model: ThemeEngine.theme == ThemeEngine.DarkTheme ? priv.darkAccentColors : priv.lightAccentColors
+
+ ColorButton {
+ required property color modelData
+ required property int index
+ color: modelData
+ checked: {
+ if(ThemeEngine.accentColor === modelData) {
+ priv.accentColorIndex = index;
+ return true;
+ } else {
+ return false;
+ }
+ }
+ autoExclusive: true
+ checkable: true
+ onPressed: ThemeEngine.accentColor = modelData;
+ }
+ }
+ }
+
+ Connections {
+ target: ThemeEngine
+
+ function onThemeChanged() {
+ console.log(priv.accentColorIndex, ThemeEngine.theme);
+
+ if(ThemeEngine.theme == ThemeEngine.DarkTheme) {
+ ThemeEngine.accentColor = priv.darkAccentColors[priv.accentColorIndex];
+ } else {
+ ThemeEngine.accentColor = priv.lightAccentColors[priv.accentColorIndex];
+ }
+ }
+ }
  }
 }