diff --git a/example/MainPage.qml b/example/MainPage.qml
index c540f4f3..dc44fc92 100644
--- a/example/MainPage.qml
+++ b/example/MainPage.qml
@@ -54,6 +54,10 @@ FluWindow {
text:"Rectangle"
page:"qrc:/T_Rectangle.qml"
}
+ ListElement{
+ text:"Theme"
+ page:"qrc:/T_Theme.qml"
+ }
ListElement{
text:"Awesome"
page:"qrc:/T_Awesome.qml"
diff --git a/example/T_Theme.qml b/example/T_Theme.qml
new file mode 100644
index 00000000..b351f324
--- /dev/null
+++ b/example/T_Theme.qml
@@ -0,0 +1,46 @@
+import QtQuick 2.15
+import QtQuick.Layouts 1.15
+import QtQuick.Window 2.15
+import QtGraphicalEffects 1.15
+import FluentUI 1.0
+
+Item {
+
+ ColumnLayout{
+ spacing: 5
+
+ FluText{
+ text:"Theme"
+ fontStyle: FluText.TitleLarge
+ }
+ RowLayout{
+ Layout.topMargin: 20
+
+
+ Repeater{
+ model: [FluColors._Yellow,FluColors._Orange,FluColors._Red,FluColors._Magenta,FluColors._Purple,FluColors._Blue,FluColors._Teal,FluColors._Green]
+ delegate: Rectangle{
+ width: 42
+ height: 42
+ radius: 4
+ color: mouse_item.containsMouse ? Qt.lighter(modelData.normal,1.1) : modelData.normal
+ FluIcon {
+ anchors.centerIn: parent
+ icon: FluentIcons.FA_check
+ iconSize: 15
+ visible: modelData === FluTheme.primaryColor
+ color: FluApp.isDark ? Qt.rgba(0,0,0,1) : Qt.rgba(1,1,1,1)
+ }
+ MouseArea{
+ id:mouse_item
+ anchors.fill: parent
+ hoverEnabled: true
+ onClicked: {
+ FluTheme.primaryColor = modelData
+ }
+ }
+ }
+ }
+ }
+ }
+}
diff --git a/example/qml.qrc b/example/qml.qrc
index 387ebde0..50169e8a 100644
--- a/example/qml.qrc
+++ b/example/qml.qrc
@@ -26,5 +26,6 @@
res/svg/avatar_12.svg
T_Awesome.qml
T_TextBox.qml
+ T_Theme.qml
diff --git a/src/FluColorSet.cpp b/src/FluColorSet.cpp
new file mode 100644
index 00000000..ebe9771c
--- /dev/null
+++ b/src/FluColorSet.cpp
@@ -0,0 +1,7 @@
+#include "FluColorSet.h"
+
+FluColorSet::FluColorSet(QObject *parent)
+ : QObject{parent}
+{
+
+}
diff --git a/src/FluColorSet.h b/src/FluColorSet.h
new file mode 100644
index 00000000..2b2c7647
--- /dev/null
+++ b/src/FluColorSet.h
@@ -0,0 +1,23 @@
+#ifndef FLUCOLORSET_H
+#define FLUCOLORSET_H
+
+#include
+#include "stdafx.h"
+
+class FluColorSet : public QObject
+{
+
+ Q_OBJECT
+ Q_PROPERTY_AUTO(QString,darkest)
+ Q_PROPERTY_AUTO(QString,darker)
+ Q_PROPERTY_AUTO(QString,dark)
+ Q_PROPERTY_AUTO(QString,normal)
+ Q_PROPERTY_AUTO(QString,light)
+ Q_PROPERTY_AUTO(QString,lighter)
+ Q_PROPERTY_AUTO(QString,lightest)
+public:
+ explicit FluColorSet(QObject *parent = nullptr);
+
+};
+
+#endif // FLUCOLORSET_H
diff --git a/src/FluColors.cpp b/src/FluColors.cpp
new file mode 100644
index 00000000..2b03abf6
--- /dev/null
+++ b/src/FluColors.cpp
@@ -0,0 +1,7 @@
+#include "FluColors.h"
+
+FluColors::FluColors(QObject *parent)
+ : QObject{parent}
+{
+
+}
diff --git a/src/FluColors.h b/src/FluColors.h
new file mode 100644
index 00000000..1de701af
--- /dev/null
+++ b/src/FluColors.h
@@ -0,0 +1,52 @@
+#ifndef FLUCOLORS_H
+#define FLUCOLORS_H
+
+#include
+#include "FluColorSet.h"
+#include "stdafx.h"
+
+class FluColors : public QObject
+{
+ Q_OBJECT
+ Q_PROPERTY_AUTO(QString,Black);
+ Q_PROPERTY_AUTO(QString,White);
+ Q_PROPERTY_AUTO(QString,Grey10);
+ Q_PROPERTY_AUTO(QString,Grey20);
+ Q_PROPERTY_AUTO(QString,Grey30);
+ Q_PROPERTY_AUTO(QString,Grey40);
+ Q_PROPERTY_AUTO(QString,Grey50);
+ Q_PROPERTY_AUTO(QString,Grey60);
+ Q_PROPERTY_AUTO(QString,Grey70);
+ Q_PROPERTY_AUTO(QString,Grey80);
+ Q_PROPERTY_AUTO(QString,Grey90);
+ Q_PROPERTY_AUTO(QString,Grey100);
+ Q_PROPERTY_AUTO(QString,Grey110);
+ Q_PROPERTY_AUTO(QString,Grey120);
+ Q_PROPERTY_AUTO(QString,Grey130);
+ Q_PROPERTY_AUTO(QString,Grey140);
+ Q_PROPERTY_AUTO(QString,Grey150);
+ Q_PROPERTY_AUTO(QString,Grey160);
+ Q_PROPERTY_AUTO(QString,Grey170);
+ Q_PROPERTY_AUTO(QString,Grey180);
+ Q_PROPERTY_AUTO(QString,Grey190);
+ Q_PROPERTY_AUTO(QString,Grey200);
+ Q_PROPERTY_AUTO(QString,Grey210);
+ Q_PROPERTY_AUTO(QString,Grey220);
+
+ Q_PROPERTY_AUTO(FluColorSet*,Yellow);
+ Q_PROPERTY_AUTO(FluColorSet*,Orange);
+ Q_PROPERTY_AUTO(FluColorSet*,Red);
+ Q_PROPERTY_AUTO(FluColorSet*,Magenta);
+ Q_PROPERTY_AUTO(FluColorSet*,Purple);
+ Q_PROPERTY_AUTO(FluColorSet*,Blue);
+ Q_PROPERTY_AUTO(FluColorSet*,Teal);
+ Q_PROPERTY_AUTO(FluColorSet*,Green);
+
+public:
+ explicit FluColors(QObject *parent = nullptr);
+
+signals:
+
+};
+
+#endif // FLUCOLORS_H
diff --git a/src/Fluent.cpp b/src/Fluent.cpp
index f3473cf3..5538f7ac 100644
--- a/src/Fluent.cpp
+++ b/src/Fluent.cpp
@@ -30,6 +30,10 @@ void Fluent::registerTypes(const char *uri){
qmlRegisterType(uri,major,minor,"WindowHelper");
+ qmlRegisterSingletonType(QUrl("qrc:/com.zhuzichu/controls/FluColors.qml"),uri,major,minor,"FluColors");
+ qmlRegisterSingletonType(QUrl("qrc:/com.zhuzichu/controls/FluTheme.qml"),uri,major,minor,"FluTheme");
+
+ qmlRegisterType(QUrl("qrc:/com.zhuzichu/controls/FluColorSet.qml"),uri,major,minor,"FluColorSet");
qmlRegisterType(QUrl("qrc:/com.zhuzichu/controls/FluMenu.qml"),uri,major,minor,"FluMenu");
qmlRegisterType(QUrl("qrc:/com.zhuzichu/controls/FluMenuItem.qml"),uri,major,minor,"FluMenuItem");
qmlRegisterType(QUrl("qrc:/com.zhuzichu/controls/FluScrollBar.qml"),uri,major,minor,"FluScrollBar");
@@ -43,7 +47,6 @@ void Fluent::registerTypes(const char *uri){
qmlRegisterType(QUrl("qrc:/com.zhuzichu/controls/FluWindow.qml"),uri,major,minor,"FluWindow");
qmlRegisterType(QUrl("qrc:/com.zhuzichu/controls/FluRectangle.qml"),uri,major,minor,"FluRectangle");
qmlRegisterType(QUrl("qrc:/com.zhuzichu/controls/FluAppBar.qml"),uri,major,minor,"FluAppBar");
- qmlRegisterType(QUrl("qrc:/com.zhuzichu/controls/FluAppBar.qml"),uri,major,minor,"FluAppBar");
qmlRegisterType(QUrl("qrc:/com.zhuzichu/controls/FluButton.qml"),uri,major,minor,"FluButton");
qmlRegisterType(QUrl("qrc:/com.zhuzichu/controls/FluCheckBox.qml"),uri,major,minor,"FluCheckBox");
qmlRegisterType(QUrl("qrc:/com.zhuzichu/controls/FluComboBox.qml"),uri,major,minor,"FluComboBox");
diff --git a/src/FluentUI.pro b/src/FluentUI.pro
index b6869b67..5ddee75d 100644
--- a/src/FluentUI.pro
+++ b/src/FluentUI.pro
@@ -13,6 +13,8 @@ RESOURCES += \
HEADERS += \
Def.h \
FluApp.h \
+ FluColorSet.h \
+ FluColors.h \
Fluent.h \
FluentUI.h \
FramelessView.h \
@@ -23,6 +25,8 @@ HEADERS += \
SOURCES += \
Def.cpp \
FluApp.cpp \
+ FluColorSet.cpp \
+ FluColors.cpp \
Fluent.cpp \
FluentUI.cpp \
WindowHelper.cpp \
diff --git a/src/controls/FluAppBar.qml b/src/controls/FluAppBar.qml
index 9f0b01cd..242269c2 100644
--- a/src/controls/FluAppBar.qml
+++ b/src/controls/FluAppBar.qml
@@ -5,14 +5,14 @@ import FluentUI 1.0
Rectangle{
- color: FluApp.isDark ? "#323232" : "#FFFFFF"
+ color: FluTheme.primaryColor.dark
height: 50
width: {
if(parent==null)
return 200
return parent.width
}
-
+ z: 65535
property string title: "标题"
property bool showDark: false
@@ -52,6 +52,7 @@ Rectangle{
left: parent.left
leftMargin: 14
}
+ color:"#FFFFFFFF"
fontStyle: FluText.Title
font.pixelSize: 14
font.bold: true
@@ -59,13 +60,15 @@ Rectangle{
RowLayout{
anchors.right: parent.right;
+ anchors.rightMargin: 10
height: parent.height
- spacing: 5
+ spacing: 15
TFpsMonitor{
Layout.alignment: Qt.AlignVCenter
Layout.rightMargin: 12
Layout.topMargin: 5
+ color:"#FFFFFFFF"
visible: showFps
}
@@ -75,6 +78,7 @@ Rectangle{
visible: showDark
FluText{
text:"夜间模式"
+ color:"#FFFFFFFF"
fontStyle: FluText.Body
}
FluToggleSwitch{
@@ -85,39 +89,73 @@ Rectangle{
}
}
- FluIconButton{
+ FluIcon{
icon : FluentIcons.FA_window_minimize
Layout.alignment: Qt.AlignVCenter
iconSize: 15
- text:"最小化"
- onClicked: {
- Window.window.showMinimized()
+ color:"#FFFFFF"
+ MouseArea{
+ id:mouse_miniminzed
+ anchors.fill: parent
+ hoverEnabled: true
+ onClicked: {
+ Window.window.showMinimized()
+ }
+ }
+ FluTooltip{
+ visible: mouse_miniminzed.containsMouse
+ text:"最小化"
+ delay: 1000
}
}
- FluIconButton{
- icon : {
+ FluIcon{
+
+ property bool isRestore: {
if(Window.window == null)
return false
+ return Window.Maximized === Window.window.visibility
+ }
+ color:"#FFFFFF"
+ icon : {
+ if(Window.window == null)
+ return FluentIcons.FA_window_restore
return Window.Maximized === Window.window.visibility ? FluentIcons.FA_window_restore : FluentIcons.FA_window_maximize
}
Layout.alignment: Qt.AlignVCenter
visible: resizable
- text:{
- if(Window.window == null)
- return ""
- Window.Maximized === Window.window.visibility?"向下还原":"最大化"
- }
iconSize: 15
- onClicked: {
- toggleMaximized()
+ MouseArea{
+ id:mouse_maximized
+ anchors.fill: parent
+ hoverEnabled: true
+ onClicked: {
+ toggleMaximized()
+ }
+ }
+ FluTooltip{
+ visible: mouse_maximized.containsMouse
+ text:{
+ return parent.isRestore?"向下还原":"最大化"
+ }
+ delay: 1000
}
}
- FluIconButton{
+ FluIcon{
icon : FluentIcons.FA_close
Layout.alignment: Qt.AlignVCenter
- text:"关闭"
- onClicked: {
- Window.window.close()
+ color:"#FFFFFF"
+ MouseArea{
+ id:mouse_close
+ anchors.fill: parent
+ hoverEnabled: true
+ onClicked: {
+ Window.window.close()
+ }
+ }
+ FluTooltip{
+ visible: mouse_close.containsMouse
+ text:"关闭"
+ delay: 1000
}
}
}
diff --git a/src/controls/FluCheckBox.qml b/src/controls/FluCheckBox.qml
index cc24ab5b..50ba8db0 100644
--- a/src/controls/FluCheckBox.qml
+++ b/src/controls/FluCheckBox.qml
@@ -19,7 +19,7 @@ Item {
border.color: {
if(FluApp.isDark){
if(checked){
- return Qt.rgba(76/255,160/255,224/255,1)
+ return FluTheme.primaryColor.lighter
}
return Qt.rgba(160/255,160/255,160/255,1)
}else{
@@ -27,7 +27,7 @@ Item {
if(mouse_area.containsMouse){
return Qt.rgba(25/255,117/255,187/255,1)
}
- return Qt.rgba(0/255,102/255,180/255,1)
+ return FluTheme.primaryColor.dark
}
return Qt.rgba(136/255,136/255,136/255,1)
}
@@ -39,7 +39,7 @@ Item {
if(mouse_area.containsMouse){
return Qt.rgba(74/255,149/255,207/255,1)
}
- return Qt.rgba(76/255,160/255,224/255,1)
+ return FluTheme.primaryColor.lighter
}
if(mouse_area.containsMouse){
return Qt.rgba(62/255,62/255,62/255,1)
@@ -50,7 +50,7 @@ Item {
if(mouse_area.containsMouse){
return Qt.rgba(25/255,117/255,187/255,1)
}
- return Qt.rgba(0/255,102/255,180/255,1)
+ return FluTheme.primaryColor.dark
}
if(mouse_area.containsMouse){
return Qt.rgba(244/255,244/255,244/255,1)
diff --git a/src/controls/FluColorSet.qml b/src/controls/FluColorSet.qml
new file mode 100644
index 00000000..ee2234a9
--- /dev/null
+++ b/src/controls/FluColorSet.qml
@@ -0,0 +1,13 @@
+import QtQuick 2.15
+
+QtObject {
+
+ property color darkest: Qt.rgba(0/255,74/255,131/255,1)
+ property color darker:Qt.rgba(0/255,84/255,148/255,1)
+ property color dark:Qt.rgba(0/255,102/255,180/255,1)
+ property color normal:Qt.rgba(0/255,120/255,212/255,1)
+ property color light:Qt.rgba(38/255,140/255,218/255,1)
+ property color lighter:Qt.rgba(76/255,160/255,224/255,1)
+ property color lightest:Qt.rgba(96/255,171/255,228/255,1)
+
+}
diff --git a/src/controls/FluColors.qml b/src/controls/FluColors.qml
new file mode 100644
index 00000000..acabda04
--- /dev/null
+++ b/src/controls/FluColors.qml
@@ -0,0 +1,112 @@
+pragma Singleton
+
+import QtQuick 2.15
+
+QtObject {
+
+ property color _Black: Qt.rgba(0/255,0/255,0/255,1)
+ property color _White: Qt.rgba(255/255,255/255,255/255,1)
+
+ property color _Grey10: Qt.rgba(250/255,249/255,248/255,1)
+ property color _Grey20: Qt.rgba(243/255,242/255,241/255,1)
+ property color _Grey30: Qt.rgba(237/255,235/255,233/255,1)
+ property color _Grey40: Qt.rgba(225/255,223/255,221/255,1)
+ property color _Grey50: Qt.rgba(210/255,208/255,206/255,1)
+ property color _Grey60: Qt.rgba(200/255,198/255,196/255,1)
+ property color _Grey70: Qt.rgba(190/255,187/255,184/255,1)
+ property color _Grey80: Qt.rgba(179/255,176/255,173/255,1)
+ property color _Grey90: Qt.rgba(161/255,159/255,157/255,1)
+ property color _Grey100: Qt.rgba(151/255,149/255,147/255,1)
+ property color _Grey110: Qt.rgba(138/255,136/255,134/255,1)
+ property color _Grey120: Qt.rgba(121/255,119/255,117/255,1)
+ property color _Grey130: Qt.rgba(96/255,94/255,92/255,1)
+ property color _Grey140: Qt.rgba(72/255,70/255,68/255,1)
+ property color _Grey150: Qt.rgba(59/255,58/255,57/255,1)
+ property color _Grey160: Qt.rgba(50/255,49/255,48/255,1)
+ property color _Grey170: Qt.rgba(41/255,40/255,39/255,1)
+ property color _Grey180: Qt.rgba(37/255,36/255,35/255,1)
+ property color _Grey190: Qt.rgba(32/255,31/255,30/255,1)
+ property color _Grey200: Qt.rgba(27/255,26/255,25/255,1)
+ property color _Grey210: Qt.rgba(22/255,21/255,20/255,1)
+ property color _Grey220: Qt.rgba(17/255,16/255,15/255,1)
+
+ property FluColorSet _Yellow:FluColorSet{
+ darkest: Qt.rgba(249/255,168/255,37/255,1)
+ darker:Qt.rgba(251/255,192/255,45/255,1)
+ dark:Qt.rgba(253/255,216/255,53/255,1)
+ normal:Qt.rgba(255/255,235/255,59/255,1)
+ light:Qt.rgba(255/255,238/255,88/255,1)
+ lighter:Qt.rgba(255/255,241/255,118/255,1)
+ lightest:Qt.rgba(255/255,245/255,157/255,1)
+ }
+
+ property FluColorSet _Orange:FluColorSet{
+ darkest: Qt.rgba(153/255,61/255,7/255,1)
+ darker:Qt.rgba(172/255,68/255,8/255,1)
+ dark:Qt.rgba(209/255,84/255,10/255,1)
+ normal:Qt.rgba(247/255,99/255,12/255,1)
+ light:Qt.rgba(248/255,122/255,48/255,1)
+ lighter:Qt.rgba(249/255,145/255,84/255,1)
+ lightest:Qt.rgba(250/255,158/255,104/255,1)
+ }
+
+ property FluColorSet _Red:FluColorSet{
+ darkest: Qt.rgba(143/255,10/255,21/255,1)
+ darker:Qt.rgba(162/255,11/255,24/255,1)
+ dark:Qt.rgba(185/255,13/255,28/255,1)
+ normal:Qt.rgba(232/255,17/255,35/255,1)
+ light:Qt.rgba(236/255,64/255,79/255,1)
+ lighter:Qt.rgba(238/255,88/255,101/255,1)
+ lightest:Qt.rgba(240/255,107/255,118/255,1)
+ }
+
+ property FluColorSet _Magenta:FluColorSet{
+ darkest: Qt.rgba(111/255,0/255,79/255,1)
+ darker:Qt.rgba(126/255,0/255,110/255,1)
+ dark:Qt.rgba(144/255,0/255,126/255,1)
+ normal:Qt.rgba(180/255,0/255,158/255,1)
+ light:Qt.rgba(195/255,51/255,177/255,1)
+ lighter:Qt.rgba(202/255,76/255,187/255,1)
+ lightest:Qt.rgba(208/255,96/255,194/255,1)
+ }
+
+ property FluColorSet _Purple:FluColorSet{
+ darkest: Qt.rgba(71/255,47/255,104/255,1)
+ darker:Qt.rgba(81/255,53/255,118/255,1)
+ dark:Qt.rgba(100/255,66/255,147/255,1)
+ normal:Qt.rgba(116/255,77/255,169/255,1)
+ light:Qt.rgba(134/255,100/255,180/255,1)
+ lighter:Qt.rgba(157/255,130/255,194/255,1)
+ lightest:Qt.rgba(168/255,144/255,201/255,1)
+ }
+
+ property FluColorSet _Blue:FluColorSet{
+ darkest: Qt.rgba(0/255,74/255,131/255,1)
+ darker:Qt.rgba(0/255,84/255,148/255,1)
+ dark:Qt.rgba(0/255,102/255,180/255,1)
+ normal:Qt.rgba(0/255,120/255,212/255,1)
+ light:Qt.rgba(38/255,140/255,218/255,1)
+ lighter:Qt.rgba(76/255,160/255,224/255,1)
+ lightest:Qt.rgba(96/255,171/255,228/255,1)
+ }
+
+ property FluColorSet _Teal:FluColorSet{
+ darkest: Qt.rgba(0/255,110/255,91/255,1)
+ darker:Qt.rgba(0/255,124/255,103/255,1)
+ dark:Qt.rgba(0/255,151/255,125/255,1)
+ normal:Qt.rgba(0/255,178/255,148/255,1)
+ light:Qt.rgba(38/255,189/255,164/255,1)
+ lighter:Qt.rgba(76/255,201/255,180/255,1)
+ lightest:Qt.rgba(96/255,207/255,188/255,1)
+ }
+
+ property FluColorSet _Green:FluColorSet{
+ darkest: Qt.rgba(9/255,76/255,9/255,1)
+ darker:Qt.rgba(12/255,93/255,12/255,1)
+ dark:Qt.rgba(14/255,111/255,14/255,1)
+ normal:Qt.rgba(16/255,124/255,16/255,1)
+ light:Qt.rgba(39/255,137/255,39/255,1)
+ lighter:Qt.rgba(75/255,156/255,75/255,1)
+ lightest:Qt.rgba(106/255,173/255,106/255,1)
+ }
+}
diff --git a/src/controls/FluFilledButton.qml b/src/controls/FluFilledButton.qml
index 0e4cb72e..9f1a5c1c 100644
--- a/src/controls/FluFilledButton.qml
+++ b/src/controls/FluFilledButton.qml
@@ -19,12 +19,12 @@ Rectangle {
if(disabled){
return Qt.rgba(199/255,199/255,199/255,1)
}
- return button_mouse.containsMouse ? Qt.rgba(74/255,149/255,207/255,1) : Qt.rgba(76/255,160/255,224/255,1)
+ return button_mouse.containsMouse ? Qt.darker(FluTheme.primaryColor.lighter,1.1) : FluTheme.primaryColor.lighter
}else{
if(disabled){
return Qt.rgba(199/255,199/255,199/255,1)
}
- return button_mouse.containsMouse ? Qt.rgba(25/255,117/255,187/255,1) : Qt.rgba(0/255,102/255,180/255,1)
+ return button_mouse.containsMouse ? Qt.lighter(FluTheme.primaryColor.dark,1.1): FluTheme.primaryColor.dark
}
}
width: button_text.implicitWidth
diff --git a/src/controls/FluInfoBar.qml b/src/controls/FluInfoBar.qml
index 919c329d..08761cbf 100644
--- a/src/controls/FluInfoBar.qml
+++ b/src/controls/FluInfoBar.qml
@@ -205,7 +205,7 @@ FluObject {
switch(_super.type){
case mcontrol.const_success: return Qt.rgba(108/255,203/255,95/255,1);
case mcontrol.const_warning: return Qt.rgba(252/255,225/255,0/255,1);
- case mcontrol.const_info: return Qt.rgba(76/255,160/255,224/255,1);
+ case mcontrol.const_info: return FluTheme.primaryColor.lighter;
case mcontrol.const_error: return Qt.rgba(255/255,153/255,164/255,1);
}
return "#FFFFFF"
diff --git a/src/controls/FluMultiLineTextBox.qml b/src/controls/FluMultiLineTextBox.qml
index db432828..ded80859 100644
--- a/src/controls/FluMultiLineTextBox.qml
+++ b/src/controls/FluMultiLineTextBox.qml
@@ -10,9 +10,9 @@ TextArea{
selectByMouse: true
selectionColor: {
if(FluApp.isDark){
- return Qt.rgba(76/255,160/255,224/255,1)
+ return FluTheme.primaryColor.lighter
}else{
- return Qt.rgba(0/255,102/255,180/255,1)
+ return FluTheme.primaryColor.dark
}
}
background: FluTextBoxBackground{
diff --git a/src/controls/FluProgressBar.qml b/src/controls/FluProgressBar.qml
index 70a61767..940fc227 100644
--- a/src/controls/FluProgressBar.qml
+++ b/src/controls/FluProgressBar.qml
@@ -27,7 +27,7 @@ FluRectangle {
radius: 3
width: control.width*progress
height: control.height
- color:FluApp.isDark ? Qt.rgba(76/255,160/255,224/255,1) : Qt.rgba(0/255,102/255,180/255,1)
+ color:FluApp.isDark ? FluTheme.primaryColor.lighter : FluTheme.primaryColor.dark
Behavior on x{
id:behavior
diff --git a/src/controls/FluProgressRing.qml b/src/controls/FluProgressRing.qml
index 96c1b5f7..9a0dc4c3 100644
--- a/src/controls/FluProgressRing.qml
+++ b/src/controls/FluProgressRing.qml
@@ -14,7 +14,7 @@ Rectangle {
property real progress: 0.25
property bool indeterminate: true
readonly property real radius2 : radius - linWidth/2
- property color primaryColor : FluApp.isDark ? Qt.rgba(76/255,160/255,224/255,1) : Qt.rgba(0/255,102/255,180/255,1)
+ property color primaryColor : FluApp.isDark ? FluTheme.primaryColor.lighter : FluTheme.primaryColor.dark
onProgressChanged: {
canvas.requestPaint()
diff --git a/src/controls/FluRadioButton.qml b/src/controls/FluRadioButton.qml
index b198cde2..29000778 100644
--- a/src/controls/FluRadioButton.qml
+++ b/src/controls/FluRadioButton.qml
@@ -55,10 +55,10 @@ Item {
}
if(checked){
if(FluApp.isDark){
- return Qt.rgba(76/255,164/255,224/255,1)
+ return FluTheme.primaryColor.lighter
}else{
- return Qt.rgba(0/255,102/255,180/255,1)
+ return FluTheme.primaryColor.dark
}
}else{
if(FluApp.isDark){
diff --git a/src/controls/FluSlider.qml b/src/controls/FluSlider.qml
index d4820012..b776c9d2 100644
--- a/src/controls/FluSlider.qml
+++ b/src/controls/FluSlider.qml
@@ -32,7 +32,7 @@ Item{
radius: 3
width: control.width*(value/100)
height: control.height
- color:FluApp.isDark ? Qt.rgba(76/255,160/255,224/255,1) :Qt.rgba(0/255,102/255,180/255,1)
+ color:FluApp.isDark ? FluTheme.primaryColor.lighter :FluTheme.primaryColor.dark
}
}
@@ -50,7 +50,7 @@ Item{
width: dotSize/2
height: dotSize/2
radius: dotSize/4
- color:FluApp.isDark ? Qt.rgba(76/255,160/255,224/255,1) :Qt.rgba(0/255,102/255,180/255,1)
+ color:FluApp.isDark ? FluTheme.primaryColor.lighter :FluTheme.primaryColor.dark
anchors.centerIn: parent
scale: control_mouse.containsMouse ? 1.2 : 1
Behavior on scale {
diff --git a/src/controls/FluTextBox.qml b/src/controls/FluTextBox.qml
index 72690cd5..df6c7279 100644
--- a/src/controls/FluTextBox.qml
+++ b/src/controls/FluTextBox.qml
@@ -8,9 +8,9 @@ TextField{
color: FluApp.isDark ? "#FFFFFF" : "#1A1A1A"
selectionColor: {
if(FluApp.isDark){
- return Qt.rgba(76/255,160/255,224/255,1)
+ return FluTheme.primaryColor.lighter
}else{
- return Qt.rgba(0/255,102/255,180/255,1)
+ return FluTheme.primaryColor.dark
}
}
selectByMouse: true
diff --git a/src/controls/FluTextBoxBackground.qml b/src/controls/FluTextBoxBackground.qml
index 7517a6d3..9f76f474 100644
--- a/src/controls/FluTextBoxBackground.qml
+++ b/src/controls/FluTextBoxBackground.qml
@@ -29,9 +29,9 @@ Rectangle{
anchors.bottom: parent.bottom
color: {
if(FluApp.isDark){
- input.focus ? Qt.rgba(76/255,160/255,224/255,1) : Qt.rgba(166/255,166/255,166/255,1)
+ input.focus ? FluTheme.primaryColor.lighter : Qt.rgba(166/255,166/255,166/255,1)
}else{
- return input.focus ? Qt.rgba(0/255,102/255,180/255,1) : Qt.rgba(183/255,183/255,183/255,1)
+ return input.focus ? FluTheme.primaryColor.dark : Qt.rgba(183/255,183/255,183/255,1)
}
}
Behavior on height{
diff --git a/src/controls/FluTextButton.qml b/src/controls/FluTextButton.qml
index 3bfeb835..f99dac34 100644
--- a/src/controls/FluTextButton.qml
+++ b/src/controls/FluTextButton.qml
@@ -5,9 +5,9 @@ FluText {
id:root
color: {
if(FluApp.isDark){
- return mouse_area.containsMouse?Qt.rgba(73/255,148/255,206/255,1):Qt.rgba(76/255,160/255,224/255,1)
+ return mouse_area.containsMouse?Qt.rgba(73/255,148/255,206/255,1):FluTheme.primaryColor.lighter
}
- return mouse_area.containsMouse?Qt.rgba(24/255,116/255,186/255,1):Qt.rgba(0/255,102/255,180/255,1)
+ return mouse_area.containsMouse?Qt.rgba(24/255,116/255,186/255,1):FluTheme.primaryColor.dark
}
signal clicked
MouseArea{
diff --git a/src/controls/FluTheme.qml b/src/controls/FluTheme.qml
new file mode 100644
index 00000000..6dfb5526
--- /dev/null
+++ b/src/controls/FluTheme.qml
@@ -0,0 +1,10 @@
+pragma Singleton
+
+import QtQuick 2.15
+
+QtObject {
+
+ property FluColorSet primaryColor: FluColors._Teal
+
+
+}
diff --git a/src/controls/FluToggleSwitch.qml b/src/controls/FluToggleSwitch.qml
index 1c2fa7b7..7203d6d3 100644
--- a/src/controls/FluToggleSwitch.qml
+++ b/src/controls/FluToggleSwitch.qml
@@ -4,7 +4,6 @@ import FluentUI 1.0
Switch {
id: root
- property color checkedColor: "#0064B0"
property var onClickFunc
width: 40
implicitWidth: 40
@@ -18,7 +17,7 @@ Switch {
color: {
if(FluApp.isDark){
if(root.checked){
- return checkedColor
+ return FluTheme.primaryColor.dark
}
if(switch_mouse.containsMouse){
return "#3E3E3C"
@@ -26,7 +25,7 @@ Switch {
return "#323232"
}else{
if(root.checked){
- return checkedColor
+ return FluTheme.primaryColor.dark
}
if(switch_mouse.containsMouse){
return "#F4F4F4"
@@ -35,7 +34,7 @@ Switch {
}
}
border.width: 1
- border.color: root.checked ? checkedColor : "#666666"
+ border.color: root.checked ? Qt.lighter(FluTheme.primaryColor.dark,1.2) : "#666666"
Rectangle {
x: root.checked ? root.implicitWidth - width - 4 : 4
diff --git a/src/controls/FluWindow.qml b/src/controls/FluWindow.qml
index 20a21ead..1ce9e5d4 100644
--- a/src/controls/FluWindow.qml
+++ b/src/controls/FluWindow.qml
@@ -39,8 +39,13 @@ Item {
}
}
- FluShadow{
- anchors.fill: container
+
+ Rectangle{
+ color:FluTheme.primaryColor.dark
+ border.width: 1
+ anchors.fill: parent
+ radius: 4
+ border.color:Qt.lighter(FluTheme.primaryColor.dark,1.3)
}
Rectangle{
diff --git a/src/controls/TFpsMonitor.qml b/src/controls/TFpsMonitor.qml
index e114dbd8..53abc4d4 100644
--- a/src/controls/TFpsMonitor.qml
+++ b/src/controls/TFpsMonitor.qml
@@ -17,6 +17,7 @@ Item {
Component{
id:contentComponent
FluText{
+ color:toou2d_fps.color
text: " Avg " + fpsAvg + " | " + fps + " Fps";
}
}
diff --git a/src/res.qrc b/src/res.qrc
index fd39bb51..57c11e0f 100644
--- a/src/res.qrc
+++ b/src/res.qrc
@@ -32,5 +32,8 @@
controls/FluMenuItem.qml
controls/FluShadow.qml
controls/FluTextButton.qml
+ controls/FluColorSet.qml
+ controls/FluColors.qml
+ controls/FluTheme.qml