Dark Theme Support Eagle

adesh777 · adesh777 · commit a143159b0342 · 2023-11-26T11:32:08.000+05:30
diff --git a/Component/Footer.qml b/Component/Footer.qml
@@ -5,16 +5,17 @@ import Style 1.0
 Image{
     id:root
     width: parent.width
-    source: "qrc:/Icons/green.png"
-    sourceSize: Qt.size(root.width , 134)
+    source: Style.isDark ? "qrc:/Icons/dark/bottom_dark.png" : "qrc:/Icons/green.png"
+    sourceSize: Qt.size(root.width , Style.isDark ? 150 : 134)
     signal settingsClicked()
     signal musicClicked()
     signal callingClicked()
     signal homeClicked()
     signal mapClicked()
     signal chargeClicked()
     Image{
-        source: "qrc:/Icons/white.png"
+        visible: !Style.isDark
+        source: Style.isDark ? "qrc:/Icons/dark/bottom_dark2.png" : "qrc:/Icons/white.png"
         sourceSize.height: 116
         width: parent.width
         anchors.horizontalCenter: parent.horizontalCenter
@@ -53,6 +54,7 @@ Image{
     RowLayout{
         anchors.horizontalCenter: parent.horizontalCenter
         anchors.verticalCenter: parent.verticalCenter
+        anchors.verticalCenterOffset: 12
         width: parent.width * 0.9
         Item{
             Layout.preferredWidth: 75
diff --git a/Component/Header.qml b/Component/Header.qml
@@ -4,13 +4,13 @@ import QtQuick.Layouts 1.3
 import Style 1.0
 
 Image{
-    source: "qrc:/Icons/topbar.svg"
+    source: Style.isDark ? "qrc:/Icons/dark/top_dark.png" : "qrc:/Icons/topbar.svg"
     RowLayout{
         anchors.horizontalCenter: parent.horizontalCenter
         anchors.verticalCenter: parent.verticalCenter
         width: parent.width * 0.85
         PrefsLabel{
-            text: qsTr("23rd January")
+            text: new Date().toLocaleDateString()
         }
         Item{
             Layout.fillWidth: true //2BD150
@@ -118,13 +118,12 @@ Image{
         }
 
         RowLayout{
-            spacing: 10
             IconButton{
                 id:wifiIcon
                 checkable: false
                 roundIcon: true
-                iconWidth: 37
-                iconHeight: 37
+                iconWidth: 32
+                iconHeight: 32
                 setIcon: getWifiIcon(3)
             }
             IconButton{
@@ -133,7 +132,7 @@ Image{
             }
         }
         PrefsLabel{
-            text: qsTr("04:36 PM")
+            text: new Date().toLocaleTimeString(Qt.locale(), "hh:mm AP")
         }
     }
 
diff --git a/Component/IconWithLabel.qml b/Component/IconWithLabel.qml
@@ -36,6 +36,7 @@ Button {
         }
         PrefsLabel{
             z:2
+            color: control.textColor
             font.pixelSize: Style.paragraph
             text: control.text
         }
diff --git a/Component/InfoPopup.qml b/Component/InfoPopup.qml
@@ -17,8 +17,9 @@ Pane{
     height: 130
     background: Rectangle{
         anchors.fill: parent
-        color: palette.base
+        color : Style.isDark ? palette.dark : palette.light
         radius: 15
+
         Rectangle{
             anchors.left: parent.left
             anchors.verticalCenter: parent.verticalCenter
diff --git a/Component/PrefsButton.qml b/Component/PrefsButton.qml
@@ -18,8 +18,8 @@ Button {
     property real iconFactor: 0.8
     property bool mirror: false
 
-    implicitWidth: 46
-    implicitHeight: 46
+    implicitWidth: 55
+    implicitHeight: 55
     SystemPalette { id: myPalette; colorGroup: SystemPalette.Active }
 
     contentItem:ColumnLayout{
diff --git a/Component/Toast.qml b/Component/Toast.qml
@@ -23,7 +23,7 @@ Popup{
         padding:0
         background: Rectangle{
             anchors.fill: parent
-            color: palette.base
+            color : Style.isDark ? palette.dark : palette.light
             radius: 15
             Rectangle{
                 anchors.left: parent.left
diff --git a/EagleTheme.pro.user b/EagleTheme.pro.user
@@ -1,6 +1,6 @@
 <?xml version="1.0" encoding="UTF-8"?>
 <!DOCTYPE QtCreatorProject>
-<!-- Written by QtCreator 11.0.3, 2023-11-25T14:57:40. -->
+<!-- Written by QtCreator 11.0.3, 2023-11-26T02:33:20. -->
 <qtcreator>
  <data>
   <variable>EnvironmentId</variable>
diff --git a/Icons/dark/background.png b/Icons/dark/background.png
diff --git a/Icons/dark/stars.png b/Icons/dark/stars.png
diff --git a/Icons/topIcons/eva_bluetooth-fill.svg b/Icons/topIcons/eva_bluetooth-fill.svg
@@ -1,5 +1,5 @@
 <svg width="37" height="37" viewBox="0 0 37 37" fill="none" xmlns="http://www.w3.org/2000/svg">
-<g opacity="0.8">
-<path d="M21.1855 18.5715L27.4427 12.7389C27.6371 12.56 27.7884 12.3405 27.8854 12.0966C27.9823 11.8526 28.0225 11.5904 28.003 11.3292C27.9835 11.0679 27.9048 10.8143 27.7726 10.5869C27.6405 10.3595 27.4583 10.1641 27.2393 10.015L19.934 5.0443C19.6601 4.85561 19.3388 4.74438 19.0051 4.72267C18.6714 4.70097 18.3381 4.76962 18.0413 4.92119C17.7537 5.06802 17.5118 5.28851 17.3411 5.55939C17.1704 5.83026 17.0772 6.14146 17.0714 6.46012V16.0015L12.0813 9.84576C11.8116 9.5274 11.4244 9.32748 11.0049 9.28996C10.5854 9.25244 10.1679 9.3804 9.84434 9.6457C9.52073 9.911 9.31751 10.2919 9.27937 10.7046C9.24124 11.1173 9.37131 11.528 9.64098 11.8464L15.0691 18.5715L9.59405 25.389C9.33827 25.7079 9.22105 26.1133 9.26793 26.5169C9.31482 26.9205 9.52202 27.2895 9.84434 27.5435C10.1295 27.7333 10.4705 27.8253 10.8142 27.8051C11.0492 27.804 11.2809 27.7509 11.4921 27.6496C11.7033 27.5484 11.8887 27.4016 12.0344 27.2203L17.0714 20.9722V30.6521C17.0755 31.1229 17.2685 31.573 17.6084 31.9045C17.9482 32.2359 18.4074 32.4219 18.886 32.4219C19.2609 32.4232 19.627 32.3103 19.934 32.0987L27.1924 27.2049C27.4088 27.0544 27.5894 26.8596 27.7217 26.6337C27.8541 26.4079 27.935 26.1564 27.9589 25.8968C27.9795 25.6393 27.9425 25.3806 27.8506 25.1386C27.7588 24.8967 27.6142 24.6775 27.427 24.4964L21.1855 18.5715ZM20.2 8.96857L24.1107 11.6309L20.2 15.2628V8.96857ZM20.2 28.1898V21.9264L24.0638 25.589L20.2 28.1898Z" fill="black"/>
+<g opacity="1">
+<path d="M21.1855 18.5715L27.4427 12.7389C27.6371 12.56 27.7884 12.3405 27.8854 12.0966C27.9823 11.8526 28.0225 11.5904 28.003 11.3292C27.9835 11.0679 27.9048 10.8143 27.7726 10.5869C27.6405 10.3595 27.4583 10.1641 27.2393 10.015L19.934 5.0443C19.6601 4.85561 19.3388 4.74438 19.0051 4.72267C18.6714 4.70097 18.3381 4.76962 18.0413 4.92119C17.7537 5.06802 17.5118 5.28851 17.3411 5.55939C17.1704 5.83026 17.0772 6.14146 17.0714 6.46012V16.0015L12.0813 9.84576C11.8116 9.5274 11.4244 9.32748 11.0049 9.28996C10.5854 9.25244 10.1679 9.3804 9.84434 9.6457C9.52073 9.911 9.31751 10.2919 9.27937 10.7046C9.24124 11.1173 9.37131 11.528 9.64098 11.8464L15.0691 18.5715L9.59405 25.389C9.33827 25.7079 9.22105 26.1133 9.26793 26.5169C9.31482 26.9205 9.52202 27.2895 9.84434 27.5435C10.1295 27.7333 10.4705 27.8253 10.8142 27.8051C11.0492 27.804 11.2809 27.7509 11.4921 27.6496C11.7033 27.5484 11.8887 27.4016 12.0344 27.2203L17.0714 20.9722V30.6521C17.0755 31.1229 17.2685 31.573 17.6084 31.9045C17.9482 32.2359 18.4074 32.4219 18.886 32.4219C19.2609 32.4232 19.627 32.3103 19.934 32.0987L27.1924 27.2049C27.4088 27.0544 27.5894 26.8596 27.7217 26.6337C27.8541 26.4079 27.935 26.1564 27.9589 25.8968C27.9795 25.6393 27.9425 25.3806 27.8506 25.1386C27.7588 24.8967 27.6142 24.6775 27.427 24.4964L21.1855 18.5715ZM20.2 8.96857L24.1107 11.6309L20.2 15.2628V8.96857ZM20.2 28.1898V21.9264L24.0638 25.589L20.2 28.1898Z" fill="#5A5A5A"/>
 </g>
 </svg>
diff --git a/Icons/topIcons/wifi/network-cellular-signal-none-svgrepo-com.svg b/Icons/topIcons/wifi/network-cellular-signal-none-svgrepo-com.svg
@@ -1,7 +1,7 @@
-<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
+<!DOCTYPE svg PUBLIC "-//W3C//DTD SVG 1.1//EN" "http://www.w3.org/Graphics/SVG/1.1/DTD/svg11.dtd">
 <!-- Uploaded to: SVG Repo, www.svgrepo.com, Transformed by: SVG Repo Mixer Tools -->
 <svg width="64px" height="64px" viewBox="0 0 16 16" xmlns="http://www.w3.org/2000/svg" fill="#000000">
-<g id="SVGRepo_bgCarrier" stroke-width="0"/>
-<g id="SVGRepo_tracerCarrier" stroke-linecap="round" stroke-linejoin="round"/>
-<g id="SVGRepo_iconCarrier"> <path d="m 13 1 c -0.554688 0 -1 0.445312 -1 1 v 12 c 0 0.554688 0.445312 1 1 1 h 1 c 0.554688 0 1 -0.445312 1 -1 v -12 c 0 -0.554688 -0.445312 -1 -1 -1 z m -4 3 c -0.554688 0 -1 0.445312 -1 1 v 9 c 0 0.554688 0.445312 1 1 1 h 1 c 0.554688 0 1 -0.445312 1 -1 v -9 c 0 -0.554688 -0.445312 -1 -1 -1 z m -4 3 c -0.554688 0 -1 0.445312 -1 1 v 6 c 0 0.554688 0.445312 1 1 1 h 1 c 0.554688 0 1 -0.445312 1 -1 v -6 c 0 -0.554688 -0.445312 -1 -1 -1 z m -4 3 c -0.554688 0 -1 0.445312 -1 1 v 3 c 0 0.554688 0.445312 1 1 1 h 1 c 0.554688 0 1 -0.445312 1 -1 v -3 c 0 -0.554688 -0.445312 -1 -1 -1 z m 0 0" fill="#2e3434" fill-opacity="0.34902"/> </g>
-</svg>
+<g id="SVGRepo_bgCarrier" stroke-width="0"/>
+<g id="SVGRepo_tracerCarrier" stroke-linecap="round" stroke-linejoin="round"/>
+<g id="SVGRepo_iconCarrier"> <path d="m 13 1 c -0.554688 0 -1 0.445312 -1 1 v 12 c 0 0.554688 0.445312 1 1 1 h 1 c 0.554688 0 1 -0.445312 1 -1 v -12 c 0 -0.554688 -0.445312 -1 -1 -1 z m -4 3 c -0.554688 0 -1 0.445312 -1 1 v 9 c 0 0.554688 0.445312 1 1 1 h 1 c 0.554688 0 1 -0.445312 1 -1 v -9 c 0 -0.554688 -0.445312 -1 -1 -1 z m -4 3 c -0.554688 0 -1 0.445312 -1 1 v 6 c 0 0.554688 0.445312 1 1 1 h 1 c 0.554688 0 1 -0.445312 1 -1 v -6 c 0 -0.554688 -0.445312 -1 -1 -1 z m -4 3 c -0.554688 0 -1 0.445312 -1 1 v 3 c 0 0.554688 0.445312 1 1 1 h 1 c 0.554688 0 1 -0.445312 1 -1 v -3 c 0 -0.554688 -0.445312 -1 -1 -1 z m 0 0" fill="#2e3434" fill-opacity="0.34902"/> </g>
+</svg>
diff --git a/Pages/Charing.qml b/Pages/Charing.qml
@@ -195,7 +195,7 @@ EaglePage {
                                     implicitHeight: 35
                                     implicitWidth: 120
                                     text: qsTr("Direction")
-                                    backgroundColor: palette.light
+                                    backgroundColor: palette.dark
                                     setIcon:"qrc:/Icons/MapIcons/direction.svg"
                                     smallBackgroundColor: palette.dark
                                 }
@@ -206,7 +206,7 @@ EaglePage {
                                     implicitHeight: 35
                                     implicitWidth: 120
                                     text: qsTr("Save")
-                                    backgroundColor: palette.light
+                                    backgroundColor: palette.dark
                                     setIcon:"qrc:/Icons/MapIcons/saveLocation.svg"
                                     smallBackgroundColor: palette.dark
                                 }
@@ -217,7 +217,7 @@ EaglePage {
                                     implicitHeight: 35
                                     implicitWidth: 120
                                     text: qsTr("Add Stop")
-                                    backgroundColor: palette.light
+                                    backgroundColor: palette.dark
                                     setIcon:"qrc:/Icons/MapIcons/Plus.svg"
                                     smallBackgroundColor: palette.dark
                                 }
diff --git a/Pages/Display.qml b/Pages/Display.qml
@@ -51,17 +51,17 @@ EaglePage {
             RowLayout{
                 spacing: 30
                 PrefsButton{
-                    implicitHeight: 50
                     implicitWidth: 160
                     backgroundColor: "#FFFFFF"
                     textColor: "#000000"
                     text: qsTr("Light")
+                    onClicked: Style.isDark = false
                 }
                 PrefsButton{
-                    implicitHeight: 50
-                    implicitWidth: 150
+                    implicitWidth: 160
                     backgroundColor:"#000000"
                     text: qsTr("Dark")
+                    onClicked: Style.isDark = true
                 }
             }
         }
diff --git a/Pages/HomePage.qml b/Pages/HomePage.qml
@@ -15,7 +15,7 @@ Page {
         id:themeIcon
         Image{
             sourceSize: Qt.size(1120.89,596)
-            source: "qrc:/Icons/Eagle/5.png"
+            source: Style.isDark ? "qrc:/Icons/Eagle/5.png" : "qrc:/Icons/Eagle/7.png"
         }
     }
     PrefsLabel{
diff --git a/Pages/MyTrips.qml b/Pages/MyTrips.qml
@@ -102,6 +102,7 @@ EaglePage {
                 height: 220
                 radius: 10
                 radiusCorners: Qt.AlignLeft | Qt.AlignRight | Qt.AlignTop | Qt.AlignBottom
+                color: Style.isDark ? palette.dark : palette.light
                 Rectangle{
                     anchors.left: parent.left
                     anchors.verticalCenter: parent.verticalCenter
diff --git a/Pages/SystemUpdate.qml b/Pages/SystemUpdate.qml
@@ -51,6 +51,7 @@ EaglePage {
             width: parent.width * 0.78
             height: 100
             radius: 10
+            color : Style.isDark ? palette.dark : palette.light
             Rectangle{
                 anchors.left: parent.left
                 anchors.verticalCenter: parent.verticalCenter
diff --git a/Pages/TripDetails.qml b/Pages/TripDetails.qml
@@ -91,7 +91,7 @@ EaglePage {
             height: 610.5
             radius: 15
             radiusCorners: Qt.AlignLeft | Qt.AlignRight | Qt.AlignTop | Qt.AlignBottom
-
+            color : Style.isDark ? palette.dark : palette.light
             PrefsLabel{
                 id:dateLabel
                 anchors.left: parent.left
@@ -132,7 +132,7 @@ EaglePage {
                 anchors.left: time_line.right
                 anchors.leftMargin: 20
                 radiusCorners: Qt.AlignLeft | Qt.AlignRight | Qt.AlignTop | Qt.AlignBottom
-
+                color : Style.isDark ? palette.dark : palette.light
                 MapDetails{
                     id:mapview
                 }
diff --git a/StyleTheme.qml b/StyleTheme.qml
@@ -2,9 +2,10 @@ pragma Singleton
 
 import QtQuick 2.15
 QtObject {
-    readonly property color background: "#DCF3F3"
+    property bool isDark: false
+    readonly property color background: isDark ? "#00000000" : "#DCF3F3"
     readonly property color fontColor: "#FFFFFF"
-    readonly property color baseColor: systemPalette.windowText
+    readonly property color baseColor: isDark ? systemPalette.base : systemPalette.windowText
     readonly property color styleColor: "#045457"
     readonly property color grayColor: "#7C7C7C"
 
diff --git a/main.cpp b/main.cpp
@@ -10,6 +10,7 @@ int main(int argc, char *argv[])
     QCoreApplication::setApplicationName("Eagle Theme");
     QCoreApplication::setOrganizationName("TechCoderHub");
 #endif
+    qputenv("QT_QUICK_CONTROLS_STYLE", QByteArray("Basic"));
     QGuiApplication app(argc, argv);
     app.setWindowIcon(QIcon(":/app.ico"));
 
diff --git a/main.qml b/main.qml
@@ -14,6 +14,15 @@ ApplicationWindow {
     color: Style.background
     title: qsTr("Eagle Theme")
 
+    background: Item{
+        anchors.fill: parent
+        Image{
+            anchors.fill: parent
+            visible: Style.isDark
+            source: "qrc:/Icons/dark/background.png"
+        }
+    }
+
     Component.onCompleted: root.showMaximized()
 
     header: Header{}
diff --git a/qml.qrc b/qml.qrc
@@ -153,5 +153,7 @@
         <file>Icons/dark/bottom_dark.png</file>
         <file>Icons/dark/bottom_dark2.png</file>
         <file>Icons/dark/top_dark.png</file>
+        <file>Icons/dark/background.png</file>
+        <file>Icons/dark/stars.png</file>
     </qresource>
 </RCC>

Original file line number	Diff line number	Diff line change
`@@ -4,13 +4,13 @@ import QtQuick.Layouts 1.3`
`4`	`4`	`import Style 1.0`
`5`	`5`
`6`	`6`	`Image{`
`7`		`- source: "qrc:/Icons/topbar.svg"`
	`7`	`+ source: Style.isDark ? "qrc:/Icons/dark/top_dark.png" : "qrc:/Icons/topbar.svg"`
`8`	`8`	`RowLayout{`
`9`	`9`	`anchors.horizontalCenter: parent.horizontalCenter`
`10`	`10`	`anchors.verticalCenter: parent.verticalCenter`
`11`	`11`	`width: parent.width * 0.85`
`12`	`12`	`PrefsLabel{`
`13`		`- text: qsTr("23rd January")`
	`13`	`+ text: new Date().toLocaleDateString()`
`14`	`14`	`}`
`15`	`15`	`Item{`
`16`	`16`	`Layout.fillWidth: true //2BD150`
`@@ -118,13 +118,12 @@ Image{`
`118`	`118`	`}`
`119`	`119`
`120`	`120`	`RowLayout{`
`121`		`- spacing: 10`
`122`	`121`	`IconButton{`
`123`	`122`	`id:wifiIcon`
`124`	`123`	`checkable: false`
`125`	`124`	`roundIcon: true`
`126`		`- iconWidth: 37`
`127`		`- iconHeight: 37`
	`125`	`+ iconWidth: 32`
	`126`	`+ iconHeight: 32`
`128`	`127`	`setIcon: getWifiIcon(3)`
`129`	`128`	`}`
`130`	`129`	`IconButton{`
`@@ -133,7 +132,7 @@ Image{`
`133`	`132`	`}`
`134`	`133`	`}`
`135`	`134`	`PrefsLabel{`
`136`		`- text: qsTr("04:36 PM")`
	`135`	`+ text: new Date().toLocaleTimeString(Qt.locale(), "hh:mm AP")`
`137`	`136`	`}`
`138`	`137`	`}`
`139`	`138`
Original file line number	Diff line number	Diff line change
`@@ -36,6 +36,7 @@ Button {`
`36`	`36`	`}`
`37`	`37`	`PrefsLabel{`
`38`	`38`	`z:2`
	`39`	`+ color: control.textColor`
`39`	`40`	`font.pixelSize: Style.paragraph`
`40`	`41`	`text: control.text`
`41`	`42`	`}`